🤓 슬기로운 개발생활 🤓 슬기로운 개발생활

function a(){ let b = 10; function c(){ console.log(b); } c(); } a(); console.log(b); 위의 코드가 실행될 때 자바스크립트 엔진이 돌아가는 과정은 다음과 같다. 1. 먼저 전역 스코프에 위치하고 있는 변수 a를 담고, 변수 a에는 정의되어있는 함수를 할당한다. 2. 그 다음 a 함수가 호출되고 전역 컨텍스트에서 a가 실행되어 let b = 10 코드가 실행된다. 3. 이제 call stack memory에 a함수가 저장된 것과 마찬가지로 식별자 b와 c가 callstack에 저장된다(b : 10, c : function(){}). 4. 다음 c함수가 호출되고 console.log(b)를 만난다. 현재 활성화 상태인 c 컨텍스트에서 b를 검..

스코프(scope) 스코프란 쉽게 말해 변수의 유효범위이다. function start(){ for (let i = 0; i < 5; i++){ console.log(i); } console.log(i); } start(); 위의 코드를 실행 시켜보면 for 문 안에 console.log(i) 는 잘 실행된 반면, for 문 밖의 console.log(i)는 i가 정의되어 있지 않다고 에러가 뜬 것을 볼 수 있다. 그 이유는 i가 for 문 안에서만 유효한 변수이기 때문이다. 위의 오류를 해결하고 싶다면 아래와 같이 변수를 아예 밖에서 선언하여 스코프의 범위를 for문 밖으로 확장시킬 수 있다. function start(){ let i = 0; for(i = 0; i < 5; i++){ console...

기본형과 참조형을 구분하는 기준 데이터 타입의 종류는 크게 기본형과 참조형 2가지로 나뉜다. 기본형과 참조형을 구분 짓는 가장 큰 점은 실제 값 전체 복사 vs 실제 값이 들어있는 주소 값 복사이다. - 기본형 (copy value of a) let a = 1; let b = a; a += 10; console.log(a) //11 console.log(b) //1 위의 코드를 살펴보면 a의 값이 변하더라도 b의 값은 그대로 인 것을 볼 수 있다. let b = a; 코드를 통해 a값 전체가 복사되어 b라는 변수에 담겼다. a, b는 서로 영향을 받지 않고 독립적으로 존재하는 것을 볼 수 있다. 기본형 데이터가 저장될 때는 아래와 같은 순서로 저장된다. 1. 변수 영역에서 빈 공간(@1003 : 임의의 ..

동기(Synchronous) vs 비동기(Asynchronous) 카페 점원이라고 생각해보자. 손님에게 복숭아 아이스티를 주문받았다. 그럼 아래와 같이 6 단계를 거쳐 손님에게 제공할 수 있다. 1. 주문받기 -> 2초 소요 2. 복숭아티 파우더를 컵에 넣는다(1 스푼) -> 2초 소요 3. 따뜻한 물을 조금 붓고, 파우더를 녹여준다. -> 5초 소요 4. 파우더가 녹았다면, 얼음을 넣고 차갑게 저어준다. -> 3초 소요 5. 물을 적당량 넣어주고 섞어준다. -> 2초 소요 6. 손님에게 제공한다. -> 2초 소요 동기적 실행(synchronous system) 은 하나의 테스크 실행이 완료될 때까지 다른 테스크들은 블로킹(작업 중단) 되는 방식이다. 1명의 손님에게 음료를 제공하기 전까지 다른 손님의 ..

this let array = []; array.push(1); array.pop(); push, pop, shift, unshift 등 자바스크립트에서는 많은 메서드들을 사용할 수 있다. 메서드들은 자신이 속한 객체(마침표 앞의 객체)의 프로퍼티를 참조하고 변경할 수 있다. 자바스크립트에서 제공하는 메서드들은 이미 자바스크립트에서 정의를 해두었기 때문에 가져다 사용할 수 있다. function Example(){ this.storage = []; } Example.prototype.push = function(){ this.storage.push(1); return 1; } Example 생성자 함수를 생성했다. push 메서드는 storage에 1을 추가하는 메서드이다. 생성자 함수로 인스턴스를 생성..