본문 바로가기

Java Script27

[JavaScript] new로 호출하는 생성자 함수 생성자 함수 JavaScript에서 함수는 반복되는 로직을 모아놓은 함수가 될 수도, 인스턴스의 모양(속성이나 메서드)이 정의된 생성자가 될 수도 있다. 다른 언어에서는 class와 생성자가 구분되지만, JavaScript에서는 ES6문법 이후 추가된 class 이외에 생성자 함수도 class의 역할을 한다. function Wizard(name, hair) { this.name = name; this.hair = hair; this.sayHello = function() { return `안녕, 내 이름은 ${this.name}야!`; } } let harry = new Wizard('Harry Potter', 'black'); let ron = new Wizard('Ron Weasley', 'red'.. 2020. 7. 30.
[JavaScript] IIFE (즉시 실행 함수) IIFE Immediately Invoked Function Expression의 약자. 정의됨과 동시에 즉시 실행하는 함수를 뜻하며, 괄호로 둘러싸인 익명함수 ( function () { statements } ) 와 즉시 실행 함수를 생성하는 괄호 ( )로 구성된다. (function () { statements })(); ▶ ( function () { statements } ) - 전역 스코프에 불필요한 변수를 추가해서 오염시키는 것을 방지하고, IIFE 함수 내부로 다른 변수들이 접근하는 것을 막는다. (function () { let name = "Harry Potter"; })(); name // throws "Uncaught ReferenceError: name is not defined".. 2020. 7. 29.
[JavaScript] Event Loop Event Loop JavaScript 엔진은 메모리 할당을 관리하는 Heap, 하나의 코드 조각을 하나씩 실행하는 Call stack으로 이루어져 있다. JavaScript는 단일 스레드기반의 언어이기에, 하나의 stack을 가지고, 동시에 하나의 작업만을 수행한다. 하지만 실제로 이 언어를 이용하는 환경 (Browser, Nodejs)은 여러 개의 스레드를 활용한다. 이 때 JavaScript 엔진과 환경을 상호 연동하기 위해서 사용하는 것이 Event Loop이다. 비동기적인 이벤트의 처리나 통신 작업이 발생하면 JavaScript 외부의 Web API에서 처리를 맡는 것이다. [ Web API ] Browser에서 제공되는 비동기 작업 실행 API이다. JavaScript 에서 Web API에 포.. 2020. 7. 26.
[JavaScript] Closure Closure JavaScript에서 함수는, 선언될 때 자신이 접근할 수 있는 범위를 정하고 기억하고 있다. 이것을 lexical scope(렉시컬 스코프)라고 하는데, 이런 lexical scope에 의해 외부 함수의 환경을 기억하고 있는 내부 함수가 Closure다. closure가 내부 변수를 참조하는 동안에는 내부 변수가 차지하는 메모리를 Garbage Collector가 회수하지 않으므로, closure 사용이 끝나면 참조를 제거하는 것이 좋다. 1. f1()이라는 함수가 정의되었다. 2. var a = 1; - 이 함수 내에는 함수 안에서만 사용할 수 있는 변수 a가 있다. 3. var a = f1(); 을 통해 f1()이 호출되어 함수가 실행되었고, return을 통해 값을 반환한다. 4... 2020. 7. 23.
[JavaScript] Hoisting Hoisting JavaScript의 실행 콘텍스트에서 var, function 선언문 등은, 해당 스코프의 맨 앞으로 옮겨진 것처럼 동작한다. 호이스팅은 ES5나 그 이후 표준의 공식 언어는 아니다. 다만 사람들이 이러한 JavaScript의 특성을 이해하기 위해 차용한 단어이다. JavaScript는 ES6에 도입된 let, const를 포함하여 모든 선언(var, let, const, function, function*, class)을 호이스팅한다. 변수 호이스팅(Variable Hoisting) 먼저, 변수는 다음 3단계에 걸쳐 생성 된다. 선언 단계(Declaration phase) 변수 hoisted를 실행 컨텍스트의 변수 객체(Variable Object)에 등록한다. 이 변수 객체는 스코프.. 2020. 7. 22.