Daily Front_Minhhk

[21~22장] 자바스크립트 딥다이브_빌트인 객체, this 본문

Study/JS_딥다이브

[21~22장] 자바스크립트 딥다이브_빌트인 객체, this

Minhhk 2023. 11. 23. 17:13

빌트인 객체

  • 표준 빌트인 객체 표준 빌트인 객체는 ECMASCript 사양에 정의된 객체를 말하며. 애플리케이션 전역의 공동 기능을 제공한다. 표준 빌트인 객체는 ECMASCript 사양에 정의된 객체이므로 자바스크립트 실행 환경(브라우저 또는 Node.js 환경)과 관계없이 언제나 사용할 수 있다. 표준 빌트인 객체는 전역 객체의 프로퍼티로서 제공된다. 따라서 별도의 선언 없이 전역 변수처럼 언제나 참조할 수 있다.

 

  • 호스트 객체 호스트 객체는 ECMASeript 사양에 정의되어 있지 않지만 자바스크립트 실행 환경 (브라우저 환경 또는 Node.js 환경에서 추가로 제공하는 객체를 말한다. 브라우저 환경에서는 DOM. BOM, Canvas. XMLHttpRequest. fetch, requestAnimationFrame. SVG. Web Storage, Web Component, Web Worker와 같은 클라이언트 사이드 Web API를 호스트 객체로 제공하고, Node.is 환경에서는 Node.is 고유 의 API를 호스트 객체로 제공한다.

 

  • 사용자 정의 객체 사용자 정의 객체는 표준 빌트인 객체와 호스트 객체처럼 기본 제공되는 객체가 아닌 사용자가 직접 정의한 객체를 말한다.

 

 


 

 

this

💡 this : 자신이 속한 객체 or 자신이 생성할 인스턴스를 가리키는 자기 참조 변수이며, 프로퍼티나 메서드를 참조할 수 있다.

→ this가 가리키는 값, this 바인딩은 함수 호출 방식에 의해 동적으로 결정된다.

 

 

  • 바인딩 → 식별자와 값을 연결하는 과정
// this는 어디서든지 참조 가능하다.
// 전역에서 this는 전역 객체 window를 가리킨다.
console.log(this); // window

function square(number) {
  // 일반 함수 내부에서 this는 전역 객체 window를 가리킨다.
  console.log(this); // window
  return number * number;
}
square(2);

const person = {
  name: 'Lee',
  getName() {
    // 메서드 내부에서 this는 메서드를 호출한 객체를 가리킨다.
    console.log(this); // {name: "Lee", getName: ƒ}
    return this.name;
  }
};
console.log(person.getName()); // Lee

function Person(name) {
  this.name = name;
  // 생성자 함수 내부에서 this는 생성자 함수가 생성할 인스턴스를 가리킨다.
  console.log(this); // Person {name: "Lee"}
}

const me = new Person('Lee');

 

객체 프로퍼티나, 메서드를 참조하기 위한 자기 참조 변수__ 객체 메서드 내부, 생성자 함수 내부에서 의미 있음!

 

일반 함수 내부에서는 this가 undefined 바인딩 됨. → this를 사용할 필요가 없기 때문에

 

함수의 상위 스코프를 결정하는

렉시컬 스코프는 함수 정의가 평가되어 함수 객체가 생성되는 시점에 상위 스코프를 결정.

 

this 바인딩은 함수 호출 시점에 결정

기본적으로 this 는 전역객체가 바인딩 된다.