일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | ||||||
2 | 3 | 4 | 5 | 6 | 7 | 8 |
9 | 10 | 11 | 12 | 13 | 14 | 15 |
16 | 17 | 18 | 19 | 20 | 21 | 22 |
23 | 24 | 25 | 26 | 27 | 28 |
Tags
- 이벤트루프
- react
- array
- 멋사
- useState
- 코딩
- 반복문
- 리액트
- 프론트엔드
- 비동기
- JavaScript
- 화살표함수
- 국비지원
- VAR
- 타입스크립트
- 자바스크립트
- CSS
- 개발자
- SS
- for문
- 내일배움카드
- 배열
- 메소드체이닝
- frontend
- 네트워크
- Let
- 제주코딩베이스캠프
- 웹개발
- 멋쟁이사자처럼
- likelion
Archives
- Today
- Total
Ch.Covelope
Javascript <자바스크립트> this 본문
728x90
반응형
this
this 는 함수가 호출되는 방식에 따라서 동적으로 결정된다.
1. 일반 함수에서 this 는 전역 객체인 window와 바인딩 된다.
console.log(this);
//window{...}
function a (){
console.log(this)
}
a();
//window{...}
2. 메소드 안에서 this 는 메소드를 가지고 있는 오브젝트(객체)에 바인딩 된다.
let x = {
data: "oh",
a : function(){ console.log(this) }
}
x.a();
// { data:"oh", a: f }
3. 생성자 함수로 호출시 생성자 함수가 생성할 객체에 바인딩 된다.
function name() {
this.first = "oh",
this.last = "ahh"
this.total = function(){
console.log(this.first);
}
}
let name1 = new name();
console.log(name1)
//{first: 'oh', last: 'ahh', total: ƒ}
this값은 함수를 만날 때마다 바뀔 수 있기 때문에 본인이 원하는 this를 쓰기 힘든 경우가 발생할 수 있는데 그럴 때 화살표 함수를 로 사용하면 내부의 this를 새로 바꾸지 않기 때문에 의도에 맞게 사용할 수 있을 거 같다.
var obj = {
name : ['kim', 'lee', 'jay'],
func : function(){
obj.name.forEach(() => {
console.log(this)
});
}
}
obj.func()
//{name: Array(3), func: ƒ} * 3
728x90
반응형
'JavaScript' 카테고리의 다른 글
JavaScript 자바스크립트 ES6 문법 정리하기. (0) | 2022.05.02 |
---|---|
ES5 prototype(프로토타입) 상속기능. (0) | 2022.02.16 |
Javascript <자바스크립트> call by value - reference. {콜바이벨류.콜바이레퍼런스} (0) | 2021.12.22 |
Javascript <자바스크립트> Map 메소드 사용하기. (0) | 2021.12.20 |
Javascript <자바스크립트> 재귀함수, 즉시실행함수. (0) | 2021.12.16 |
Comments