BO의 개발로그

목차 1. 함수와 메소드 2. this란? 3. this의 동작 방식 3.1 전역 공간에서 this가 바라보는 대상 3.2 메소드로 호출될 때 this가 바라보는 대상 (암시적 binding) 3.3 원하는 대상으로 this binding하기 (명시적 binding) 4. 화살표 함수(Arrow Function) 5. 참고 링크 들어가기에 앞서, 다른 언어에서 this는 일반적으로 클래스(class)에서만 사용하며, class로 생성한 인스턴스 객체를 의미한다. 하지만 자바스크립트에서는 그렇지 않다. 그렇다면 자바스크립트에서의 this는 어떻게 동작할까? 1. 함수와 메소드 this 공부에 앞서, 꼭 알아야 할 함수와 메소드의 차이에 대해서 짚고 넘어가 보자! 함수와 메소드는 모두 function 키워드..

목차 1. 스코프란? 2. 스코프의 종류 2.1 Global(전역) 스코프 2.2 Local(지역) 스코프 3. 스코프 체인 4. 클로저란? 5. 참고 링크 1. 스코프란? 스코프(Scope)는 '유효 범위'라는 뜻으로, 변수가 유효한(살아 있는) 범위라고 할 수 있다. var x = 'global'; function foo () { var x = 'function scope'; console.log(x); // function scope } foo(); console.log(x); // global 스코프가 존재하기 때문에 우리가 변수를 중복해서 사용할 수 있는 것이다. 만약 스코프가 없었다면 코드 전체에 절대 충돌하지 않는 변수(식별자)명을 딱 하나만 써야 한다! 2. 스코프의 종류 2.1 Globa..

목차 1. 호이스팅이란? 2. 호이스팅의 범위 3. 변수 호이스팅 (var, let, const) 4. 함수 호이스팅 (함수 선언문, 함수 표현식) 4.1 함수 선언문과 함수 표현식 4.2 함수 선언문의 호이스팅 5. 참고 링크 1. 호이스팅이란? 자바스크립트 및 액션스크립트 코드를 인터프리터가 로드할 때, 변수의 정의가 그 범위에 따라 선언과 할당으로 분리되어 변수의 선언을 항상 컨텍스트 내의 최상위로 끌어올리는 것을 의미한다. 이는 오로지 변수에만 해당되는 것은 아니고 함수도 가능하며, 자바스크립트에서 함수의 호출을 첫 줄에서 하고 마지막 줄에 함수를 정의해도 문제없이 작동되도록 하는 유용한 특성이다. 한마디로, 호이스팅이란 변수가 끌어올려지는 현상을 말한다. var 변수 선언과 함수 선언문에서만 호..

목차 1. 실행 컨텍스트란? 2. 실행할 코드와 콜스택 2.1 실행할 코드 2.2 콜스택 3. 컨텍스트에 담기는 정보 3.1 Variable Environment 3.2 Lexical Environment 3.3 This Binding 4. 생성 과정 4.1 스코프 체인의 생성과 초기화 4.2 변수 객체화 실행 4.3 this value 결정 5. 참고 링크 1. 실행 컨텍스트란? 실행 컨텍스트란, 자바스크립트 코드가 실행되고 있는 컨텍스트(환경)를 말한다. 즉, 실행 컨텍스트는 실행할 코드에 제공할 환경 정보(변수 정보)들을 담아놓은 환경이다. 함수를 실행할 때마다 그 함수에 대한 새로운 실행 컨텍스트를 생성하여 자신만의 고유한 컨텍스트에서 실행된다. 다시 말해, 하나의 함수는 본인의 고유한 실행 컨텍..

목차 1. 동기와 비동기 1.1 동기와 비동기란? 1.2 동기와 비동기의 장단점 1.3 비동기 처리가 필요한 이유 2. 콜백 함수 (Callback Function) 2.1 콜백 함수란? 2.2 콜백 지옥 3. 프로미스 (Promise) 3.1 프로미스란? 3.2 reject와 resolve 3.3 Chaining 3.4 state 3.5 에러 처리 3.6 더 알아보기 4. async & await 5. 더 알아보기 5.1 오늘 정리한 내용에서 확장하여 공부하면 좋은 내용 5.2 위의 내용까지도 다 공부하고 나서 추가적으로 공부하면 좋은 내용 프로미스 공부를 들어가기에 앞서, 먼저 짚고 넘어갈 내용들을 살펴보고, 프로미스에 대해서 공부해보도록 하자! 1. 동기와 비동기 1.1 동기와 비동기란? 웹 앱을 ..

목차 1. 동시성 모델 2. 이벤트 루프 2.1 자바스크립트 엔진 2.2 Web APIs 2.3 Task Queue 3. 이벤트 루프의 실행 과정 4. 참고 링크 1. 동시성 모델 이벤트 루프에 대해서 알아보기 전에, 우리는 동시성 모델에 대해서 먼저 알아야 한다. 자바스크립트는 이벤트 루프에 기반한 동시성(concurrency) 모델을 가지고 있다. 💡 동시성이란? 실제 물리적으로 동시에 일어나는 것이 아니라, 흐름을 실행시키는 것은 하나지만 작은 타임 슬라이스 단위로 다른 흐름을 돌아가면서 실행시켜서 동시에 일어나는 것처럼 보이게 하는 방식을 말한다. 자바스크립트의 큰 특징 중 하나는 '싱글 스레드' 기반의 언어라는 점인데, 스레드가 하나라는 말은 곧 한 번에 하나의 작업만 처리할 수 있다는 뜻이다...