this 키워드를 알아보자

크롱·2023년 8월 9일
0

JavaSrcipt

목록 보기
36/53

💟 this

console.log(this)를 하면, window 객체가 콘솔창에 나타납니다.
this 키워드는 window 객체를 포함해서, 사용하는 환경에 따라 또 다른 뜻(?)을 가지게 됩니다.

🐬 window

그냥 쓰거나 일반 함수에서 쓰면 window 객체
기본 함수 수납공간이라고 생각하면 됩니다

 console.log(this) //window {}

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


🌻🌻'use strict' 모드에선, 일반함수 내에서 thisundefined라고 뜬다.
 

🐊 object

오브젝트 내 함수메소드에서 this를 쓰면
그 함수를 가지고 있는 오브젝트를 뜻한다

var 오브젝트 = {
	name: 'kim',
  	함수 : function(){
      console.log(this)
    }
}

오브젝트.함수() 

👇         👇
👇콘솔창 결과👇
{
	name: 'kim',
  	함수 :f
}

중첩된 오브젝트 예시 코드를 알아보자

var 오브젝트2 = {
  data : {
    함수 : function(){ console.log(this) }
  }
}
오브젝트2.data.함수();


👇         👇
👇콘솔창 결과👇
{
  	함수 :f
}

💙즉, 오브젝트2.data 가 나온다!!💙


아 그리고 메소드 만들때 이렇게 해도됩니다.

var 오브젝트2 = {
  data : {
    함수(){ console.log(this) }
  }
}

만약 메소드가 화살표 함수라면🍜

this는 상위요소인 window를 뜻합니다.
함수밖에 있던거 그대로 씀.

var 오브젝트 = {
  data : {
    함수 : ()=>{ console.log(this) }
  }
}
오브젝트.data.함수(); //window 객체








💙 정리

사실 위에서 배운 두가지 유형은 사실 똑같은 얘기에요.

즉, window는 global object ; 전역변수 보관소 입니다!

그래서 그냥 스크립트 안에서 바로 this 쓰거나 일반 함수에서 this 쓰면 window 객체가 나오는거랍니다.

profile
👩‍💻안녕하세요🌞

0개의 댓글