JavaScript에서의 this

this

• Javascript 에서의 this 키워드는 다른 언어와 조금 다르게 동작한다.
• Java에서의 this는 자기자신을 의미하지만, JavaScrip에서의 this는 함수를 호출하는 방법에 의해 결정된다.

-> Javascript 내에서의 this는 ' 누가 나를 불렀느냐' 를 뜻함. 즉 선언이 아닌 호출에 따라 달라진다.

1. 단독으로 쓰인 경우
   브라우저에서 단독으로 this를 호출할 경우엔 object Window가 된다

   var x = this
   console.log(this)
   ///결과 [object Window]

2. 함수 안에서 쓴 this

함수 안에서 this는 함수의 주인에게 바인딩

function fn(){
return this
}
console.log(fn())
//Window

var num = 0;
function add(){
this.num = 100;
num++;
console.log()num // 101
console.log(window.num) // 101
console.log(num === window.num) // true
}

위 코드에서 this.num의 this 는 window객체를 가르킨다.
따라서 num 은 전역번수(var num = 0;)를 가리치케 됩니다

다만, strict mode에서는 함수내에서 this에 디폴트 바인딩이 없기 때문에
undefined가 된다.

3. 메서드 안에서 쓴 this

일반 함수가 아닌 메서드에서는 , 해당 메서드를 호출한 객체로 바인딩 된다.

var person = {
firstName="OH",
lastName="soomin",
fullNme=function(){
return this.firstName + "" + lastName
}}
person.fullName();
//Oh soomin

5. 생성자 안에서 쓴 this

생성자 함수가 생성하는 객체로 this가 바인딩 됨

function Person(name){
this.name = name;

var kim = new Person('kim')

6. 명시적 바인딩을 한 this
   apply(), call()메서드는 인자를 this로 만들어주는 메서드

console.log(this);
}
fn() // window
var obj = 123
fn.call(obj)
// 123

apply()는 인수 배열을 받고
call()은 인수 목록을 받음

7. 화살표 함수 내에서의 this

화살표 함수내에 this는 this를 새로 정의하지 않고, 바로 바깥 함수나, 글래스의 this를 쓴다.

---

자바스크립트에서 this는 호출한 대상에 따라 달라지며 단독으로 쓰일경우엔 global object, 함수 안에서 쓰일 경우엔 함수의 주인인 window object,
메서드에서 쓰인 경우엔 해당 메서드를 호출한 객체 , 이벤트 핸들러 안에서 쓰일 경우엔, 이벤트를 받는 HTML요소 , 생성자 안에서 쓰일 경우엔 생성자가 생성하는 객체, apply() 혹은 call()메서드 등을 사용해 명시적 바인딩을 한 경우엔 해당 메서드의 인자가 this와 바인딩 되며, 화살표 함수를 사용한 경우엔 바로 바깥 함수나 클래스에 바인딩 된다.