목록JavaScript (10)
pgg-dev
메모리 영역에서 자바스크립트의 데이터가 처리되는 과정을 살펴보자. 메모리와 데이터에 관한 배경 지식 비트와 바이트 컴퓨터는 모든 데이터를 0 또는 1로 변환하여 기억한다. 0 또는 1로 표현할 수 있는 하나의 메모리 조각을 비트(bit) 라고 한다. 메모리는 매우 많은 비트로 구성되어 있고, 각 비트는 고유한 식별자를 통해 위치를 확인한다. 그런데 0과 1만 표현할 수 있는 비트 단위로 위치를 확인하는 것은 비효율적이다. 비트를 몇개씩 묶어 하나의 단위로 만들면 표현할 수 있는 값의 범위도 늘어남과 동시에 검색 시간도 줄일 수 있다. 하지만 너무 많은 비트를 한 단위로 묶으면 낭비되는 비트가 생길 수도 있다. 이런 고민의 결과로, 크게 문제 되지 않을 적정한 공간을 묶은 것이 바이트(byte) 이다. 1..
스코프란? 특정 장소에 변수를 저장하고, 나중에 다시 그 변수를 찾을 때에 잘 정의된 규칙이 필요한데 이 규칙을 '스코프'라고 한다. 이 규칙을 통하여 변수가 어디에 저장되는지, 변수를 어떻게 찾는지 알 수 있다. 변수를 찾는 이유는 변수에 값을 대입하거나 변수의 값을 얻어오기 위해서다. 스코프는 전역스코프와 지역 스코프 두 가지 종류가 있다. 스코프 체인 대상 변수를 현재 스코프에서 발견하지 못하면 엔진은 다음 바깥의 스코프로 넘어가는 식으로 변수를 찾거나 글로벌 스코프에 도달할 때까지 계속하고, 글로벌 스코프에 도달하면 변수를 찾든 못 찾든 검색을 멈추고 에러를 발생시킨다. 1 2 3 4 5 6 7 8 function foo() { var color = "blue"; function bar() { c..
Map Object를 변형한 것이다. 키-값 쌍을 저장한다. 각 쌍의 삽입 순서를 기억한다. 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 let map = new Map([["dog", "woof"]]); map.set("cat", "meow"); for (var [key, value] of map) { console.log(key + " goes " + value); } //dog goes woof //cat goes meow map.get("dog"); //"woof" map.size; //2 map.has("cat"); //true map.keys(); //{"dog", "cat"} map.values(); //{"woof", "meow"} map.delete("dog..
자바스크립트는 싱글 스레드 프로그래밍 언어이다. 하나의 프로그램은 동시에 하나의 코드만 실행할 수 있다는 말이다. one thread == one call stack == one thing at a time 호출 스택(call stack)은 프로그램 상에서 실행되는 순서를 기록하는 데이터 구조이다. 함수를 실행하면 스택에 함수를 추가(push) 하고, 리턴이 일어나면 스택의 가장 위쪽부터 제거(pop)한다. 호출 스택 작동 원리 엔진이 코드를 실행하기 전에는 호출스택이 비워져 있다. 코드를 실행하면 코드 자체인 main 함수를 스택에 집어넣는다. 함수들을 각각 정의하고, 마지막에 printSquare를 만난다. 함수를 호출하기 때문에 스택에 추가하고, 다시 square가 추가된다. square는 mult..
호이 스팅이란? var 를 사용하여 정의된 변수 및 함수의 선언문이 각각 속한 스코프의 꼭대기로 끌어올려지는 작업을 뜻한다. var a = 1; 위의 코드는 한 줄의 코드지만 자바스크립트 엔진은 아래와 같이 해석한다. 1 2 var a; a = 1; 1행 → 변수의 선언문으로써, 컴파일러 단계에서 처리한다. 2행 → 실행단계에서 처리한다. 스코프의 모든 선언문은 실행 전에 먼저 처리된다. 1 2 3 4 for (var i = 0; i
- 프로미스는 비동기 작업을 편하게 처리할 수 있도록 도입된 ES6 기능이다. - 비동기 작업을 순차적으로 진행하거나 병렬로 진행할 수 있다. - 반환 값은 항상 promise 객체이다. - 비동기작업이 많아짐에 따라서 콜백 지옥이 발생하게 되는데 이것을 프로미스가 해소해준다. 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 const increaseAndPrint = (n, callback) => { setTimeout(() => { const increased = n + 1; console.log(increased); if (callback) { callback(increased); } }, 1000); }; increaseA..