함수 호출 방식에 의해 결정되는 this 자바스크립트의 함수는 호출될 때, 매개변수로 전달되는 인자값 이외에, arguments 객체 와 this를 암묵적으로 전달 받는다. function square(number) { console.log(arguments); console.log(this); return number * number; } square(2); Java에서의 this 는 인스턴스 자신(self)을 가리키는 참조변수다. this가 객체 자신에 대한 참조 값을 가지고 있다는 뜻이다. 주로 매개변수와 객체 자신이 가지고 있는 멤버 변수명이 같을 경우 이를 구분하기 위해서 사용된다. 아래 Java 코드의 생성자 함수 내의 this.name은 멤버변수를 의미하며 name은 생성자 함수가 전달받은 ..
실행 컨텍스트 실행 컨텍스트(Execution Context)는 scope hoisting this function closure 등의 동작원리를 담고 있는 자바스크립트의 핵심원리이다. 실행 컨텍스트를 바로 이해하지 못하면 코드 독해가 어려워지며 디버깅도 매우 곤란해진다. ECMAScript 스펙에 따르면 실행 컨텍스트를 실행 가능한 코드를 형상화하고 구분하는 추상적인 개념 이라고 정의한다. 좀 더 쉽게 말하자면 실행 가능한 코드가 실행되기 위해 필요한 환경 이라고 말할 수 있겠다. 여기서 말하는 실행 가능한 코드는 아래와 같다. 전역 코드 : 전역 영역에 존재하는 코드 Eval 코드 : eval 함수로 실행되는 코드 함수 코드 : 함수 내에 존재하는 코드 일반적으로 실행 가능한 코드는 전역 코드 와 함..
use strict "use strict" 혹은 'use strict' 는 단순한 문자열처럼 생겼다. 하지만 이 문구가 스크립트 최상단에 오면 스크립트 전체가 “모던한” 방식으로 동작하게된다. "use strict"; // 이 코드는 모던한 방식으로 실행된다. "use strict"는 평범한 JavaScript에 몇가지 변경이 일어나게 한다. 기존에는 조용히 무시되던 에러들을 throwing한다. JavaScript 엔진의 최적화 작업을 어렵게 만드는 실수들을 바로잡는다. 가끔씩 엄격 모드의 코드는 비-엄격 모드의 동일한 코드보다 더 빨리 작동하도록 만들어진다. 엄격 모드는 ECMAScript의 차기 버전들에서 정의 될 문법을 금지한다. "use strict" 는 대개 스크립트 전체에 적용하지만, 스크립..
TDZ TDZ(Temporal Dead Zone)를 해석하면 "일시적 사각지대"다. 첫 번째 코드 [인스턴스 생성 후 클래스 선언] const myCat = new cat('mimi') class cat { constructor(name) { this.name = name; } } 두 번째 코드 [함수 호출 후 함수 선언] hello('Shin') function hello (name) { return `Hello ${name} :)` } 위 두개의 코드를 실행해보면 두 번째 코드는 정상적으로 작동 하지만 첫 번째 코드를 작동시키면 ReferenceError: Cannot access 'cat' before initialization 에러가 발생한다. TDZ의 발생 const 변수를 선언하고, 초기화한 ..
동기(Synchronous)와 비동기(Asynchronous) 처리방식 동기 방식은 서버에서 요청을 보냈을 때 응답이 돌아와야 다음 동작을 수행할 수 있다. 즉, A작업이 모두 진행 될때까지 B작업은 대기해야한다. 비동기 방식은 반대로 요청을 보냈을 때 응답 상태와 상관없이 다음 동작을 수행 할 수 있다. 즉, A작업이 시작하면 동시에 B작업이 실행된다. A작업은 결과값이 나오는대로 출력된다. 동기(synchronous) 동기는 데이터의 요청과 결과가 한 자리에서 동시에 일어나는것을 말한다. 요청을 하면 시간이 얼마나 걸리던지 요청한 자리에서 요청한 순서대로 결과가 주어져야 한다. 데이터 요청에 따른 응답을 리턴해주기 전까지 다른 활동을 할 수 없으며 기다려야한다. 순서에 맞게 진행되는 장점이 있으나, ..
자바스크립트는 싱글 스레드 기반의 언어 이고, 자바스크립트 엔진은 하나의 호출 스택만을 사용한다. 이는 요청이 동기적으로 처리되어 한 번에 한 가지 일만 처리할 수 있음 을 의미한다. 만약 네트워크 요청과 같은 비동기 함수가 동기적으로 이루어지는 함수로 만들어졌다면 네트워크 요청이 다른 서버로 보내지고 컴퓨터는 응답 받기를 기다리며 느려질 것이다. 그 사이에 클릭이나 다른 요소가 렌더링이 되어져야 하는게 있더라도 스택은 네트워크 요청 함수에 블락킹 되어있으므로 아무 일도 일어나지 않게 된다. 이러한 문제는 비동기 콜백을 사용함으로써 해결된다. 비동기 요청은 자바스크립트 엔진을 구동하는 환경인 브라우저 나 Node.js 에서 처리된다. 비동기 처리를 위한 브라우저와 Node.js의 구조 브라우저 환경의 구..
