JS this binding

라코마코·2020년 4월 19일
0

JS

목록 보기
1/6

this 바인딩, 컨텍스트 바인딩

기본 바인딩 ( 기본적으로 this에 전역 객체 (window) 가 바인딩된다.)

function hello(){
  console.log(this); // window
}

명시적 바인딩 (call,apply,bind 함수를 이용해서 this 바인딩)

명시적 바인딩이 암시적 바인딩보다 우선순위가 높다.

객체 바인딩 (New binding) ( this는 객체를 바인딩함 )

function Foo(name){
  this.name = name;
}

Foo.prototype.sayHi=function(){
  console.log(this.name);
}

let obj = new Foo('babo');
obj.sayHi() // will babo

클래스의 경우에서도, 클래스 내부의 this는 클래스 객체를 바인딩하게된다.

어휘적 this (ES6 arrow function)

기본 함수 에서의 this 바인딩은, 전역 this 바인딩이 기본값이지만
ES6의 화살표 함수 에서는 조금 다르다.

기존 this 바인딩은 코드 실행 시점에 따라서 바인딩 되어 동적 바인딩인데

ES6 화살표 함수는 코드상 상위 블록 컨택스트를 this 가 바인딩하기 때문에 정적 바인딩이다.

0개의 댓글