본문 바로가기
JavaScript/JavaScript

Javascript) this 용법(3, 4)

by 박채니 2022. 5. 23.

안녕하세요, 코린이의 코딩 학습기 채니 입니다.

 

개인 포스팅용으로 내용에 오류 및 잘못된 정보가 있을 수 있습니다.


this 용법 3)

일반함수 안에서 this는 window 전역 객체를 가리킴

function test14() {
    console.log(this);
    console.log(window);
}

 

this 용법 4)

화살표 함수는 this가 없음 (부모 스코프의 this를 가져와 바인딩)

- 부모 스코프는 화살표 함수의 선언 위치를 의미

- this가 바인딩 되면 변경 불가

 

HTML 코드

<button onclick="test15();">this - 화살표함수</button>

 

Javascript 코드

const test15 = () => {
    console.log(this);
}

화살표 함수가 전역에 위치해있기 때문에 전역의 this는 window이므로 this가 window가 됩니다.

 

<button id="btn15" onclick="test15(); (() => console.log(this))();">this - 화살표함수</button>

inline 속성에서 선언한 this는 해당 객체를 의미하기 때문에 부모 스코프의 this를 가져와 바인딩했으므로 해당 tag객체가 리턴 됩니다.

 

이 외 this 용법

https://chanychu.tistory.com/245

 

Javascript) this 용법, .parentElement, .className, .classList

안녕하세요, 코린이의 코딩 학습기 채니 입니다. 개인 포스팅용으로 내용에 오류 및 잘못된 정보가 있을 수 있습니다. this 용법 1) 전역에서 this는 window 객체를 가리킴 this 용법 2) 태그의 inline even

chanychu.tistory.com