전체 글56 [javascript] 호이스팅(hoisting)과 일시적 사각 지대(TDZ) + var, let, const var, let, const자바스크립트에서 변수를 선언하는 키워드는 세 가지이다. var는 최근 사용을 지양하는 키워드이지만 javascript info의 문구를 그대로 가져와 표현하자면 '오래된 스크립트에서 당신을 기다리고 있는 괴물 같은 존재'이다. 우선, var는 블록 스코프가 없다. 블록 스코프가 없다는 것은 블록 밖에서도 var에 접근할 수 있다는 말이다.if (true) { var test = true;}alert(test); // true(if 문이 끝났어도 변수에 여전히 접근할 수 있음) var는 변수의 중복 선언도 가능하다.var user = "Pete";var user = "John"; // 이 "var"는 아무것도 하지 않습니다(이전에 이미 선언됨).// ...에러 또한 발생하지 않.. 2022. 10. 5. [javascript] 실행 컨텍스트(Execution context)와 클로저(Closure) 실행 컨텍스트란?실행 컨텍스트는 스코프, 호이스팅, this, 클로져 등의 동작원리를 담고 있는 자바스크립트의 핵심원리이다. 이는 실행 가능한 코드를 형상화하고 구분하는 추상적인 개념, 즉 실행 가능한 코드가 실행되기 위해 필요한 환경이라고 할 수 있다. 실행 가능한 코드란 전역 코드와 함수 코드를 말한다. 자바스크립트가 실행될 때 우선적으로 전역 실행 컨텍스트가 만들어지며 함수가 실행될 때 함수 실행 컨텍스트가 만들어져 쌓인다. 자바스크립트 엔진이 코드를 실행하기 위해 필요한 정보는 변수 / 함수 선언 / 스코프 / this가 있다.let x = 'global x';let y = 'global y';function outer() { let z = 'local z'; console.log('o.. 2022. 10. 4. [javascript] prototype과 __proto__ Prototype이란?생성자 함수 Object는 내장 객체 생성자 함수인데, 이 생성자 함수의 prototype은 다양한 프로퍼티나 메서드가 구현되어 있는 객체를 참조한다. 이 Object 생성자 함수로 만들어진 객체는 [[Prototype]]이라는 숨김 프로퍼티를 갖는다. 이 숨김 프로퍼티 값은 null이거나 다른 객체에 대한 참조가 되는데, 다른 객체를 참조하는 경우 참조 대상을 프로토타입 객체 또는 프로토타입이라고 부른다. 일반적으로 부모 객체를 참조하게 되며 프로퍼티 또는 메서드를 상속받는다고 표현한다. obj의 프로퍼티나 메서드에 접근하려고 할 때, obj에 접근하려는 프로퍼티나 메서드가 없다면 [[Prototype]]이 가리키는 링크를 따라 자신의 부모 역할을 하는 Object의 프로퍼티나 .. 2022. 10. 3. [javascript] 생성자 함수와 클래스 생성자 함수란?반복적으로 재사용 가능한 객체를 생성할 때 사용하는 함수이다. 즉, 주물 틀과 같은 것. 반드시 지켜야 할 것은 new라는 키워드와 함께 생성자 함수의 제일 앞 글자를 대문자로 적어야 한다는 것이다.위의 그림은 Student라는 생성자 함수를 이용해 student라는 객체를 만드는 과정이다.1) new 키워드는 빈 객체를 생성하고,2) 생성자 함수에 정의된 프로퍼티들을 따라3) 함수의 인수들을 프로퍼티에 할당한다.4) 생성자 함수를 통해 완성된 객체를 student에 할당한다. Class란?클래스는 ES6부터 추가된 문법으로 생성자 함수와 같이 객체를 생성하기 위한 템플릿인데, 여기에서 더 나아가 메서드까지 추가하여 객체를 추상화하는 함수라고 할 수 있다.기본 문법은 다음과 같다.(클래스.. 2022. 10. 3. [javascript] this + bind, call, apply this?this란 자신이 속한 객체 또는 자신이 생성할 인스턴스를 가리키는 자기 참조 변수이다. this를 통해 자신이 속한 객체 또는 자신이 생성할 인스턴스의 프로퍼티나 메서드를 참조할 수 있다. > global 실행 컨텍스트에서 this는 global 객체를 참조한다. 브라우저 호스트 환경에서는 window를, node.js 호스트 환경에서는 global이 되겠다. > 객체의 메서드 또는 생성자 함수 내부에서 사용할 경우, 함수를 호출한 객체가 this에 참조된다. 때로 this가 원하는 객체를 참조하지 않을 때가 있는데//예시 1let user = { firstName: "John", sayHi() { alert(`Hello, ${this.firstName}!`); }};setT.. 2022. 10. 2. 이전 1 ··· 4 5 6 7 8 9 10 ··· 12 다음
