객체 - 객체 안에 함수 넣기
const dog={
    name: '멍멍이',
	sound:'멍멍!',
	say: funciton say(){
		console.log(this.sound);  //this는 함수가 위치한 객체의 자기자신 --> dog 를 의미
    }
};
dog.say(); //멍멍!
// function을 지워줘도 동작함
const dog={
    name: '멍멍이',
	sound:'멍멍!',
	say: say(){
		console.log(this.sound);  //this는 함수가 위치한 객체의 자기자신 --> dog 를 의미
	}
};
dog.say(); //멍멍!
//화살표 함수를 사용했을때에는 동작안함
const dog={
    name: '멍멍이',
	sound:'멍멍!',
	say: () =>{
    	console.log(this);       // TypeError: this가 undefined되어서 출력이 되지 않음
    	console.log(this.sound); // TypeError: this가 undefined되어서 출력이 되지 않음
	}
};
dog.say(); //error
안에 함수를 넣을때, 화살표함수로 선언하면 재대로 동작하지 않습니다.
이유는 function 으로 선언한 함수는 this 가 제대로 자신이 속한 객체를 가르키게 되는데,
화살표 함수는 그렇지 않기 때문입니다.
const dog = {
	name: '멍멍이',
    sound: '멍멍!',
    say: function(){
    	console.log(this.sound);
    }
};
const cat = {
	name: '야옹이',
    sound: '야옹~'
}
cat.say = dog.say;
dog.say(); //멍멍!
//dog - cat 연결되었기 때문에 cat안에 say함수가  들어가 this는 cat을 가르키게 된다.
cat.say(); //야옹~ 
// 3.함수를 밖으로 꺼내버리면 this와의 관계가 사라져 버린다.
const catSay = cat.say;
catSay(); // typeError: undefined erorr 1. 함수의 this 는 자기가 속해있는곳이 어딘지 나타냅니다.
2. 화살표 함수는 내부에서는 this가 무엇인지 인지하지 못합니다.
3. 함수를 밖으로 꺼내버리면 this와의 관계가 사라져 버립니다.
'JavaScript' 카테고리의 다른 글
| 함수 - function (0) | 2020.09.10 | 
|---|---|
| 객체 - Getter와 Setter 함수 (0) | 2020.09.07 | 
| 객체 - 비구조화 할당 (0) | 2020.09.07 | 
| 객체 (0) | 2020.09.07 | 
| Script 함수 (0) | 2020.09.06 |