JS-This

This

일반 함수의 this는 호출 위치에서 정의하고,
화살표함수의 this는 자신이 선언된 함수(렉시컬) 범위에서 정의

ex) 아래와 같이 화살표함수의 this를 console.log로 출력 해 보면 Ricardo Quaresma가 출력 됨.

• 객체데이터 내에서 하나의 속성에 함수데이터를 할당하게 되는데, 할당하는 함수가 화살표함수라면, this 키워드는 현재 함수 바깥을 감싸고 있는 외부함수를 참조함.

function user() {
	this.firstName = 'Ricardo'
  	this.lastName = 'Quaresma'
  
  	return {
    	firstName: 'Cristiano',
      	lastName: 'Ronaldo',
      	age: 85,
      	getFullName: () => {
        	return `${this.firstName} ${this.lastName}`
        }
    }
}

const u = user()
console.log(u.getFullName())

---

ex) 아래와 같이 일반함수의 this를 console.log로 출력 해 보면 Cristiano Ronaldo가 출력 됨.

• u의 getFullName을 콘솔의 log로 찍는거니 getFullName이라는 함수의 위치에 있는 Cristiano Ronaldo가 출력 됨.

function user() {
	this.firstName = 'Ricardo'
  	this.lastName = 'Quaresma'
  
  	return {
    	firstName: 'Cristiano',
      	lastName: 'Ronaldo',
      	age: 85,
      	getFullName: function () {
        	return `${this.firstName} ${this.lastName}`
        }
    }
}

const u = user()
console.log(u.getFullName())

---

  	return {
    	firstName: 'Cristiano',
      	lastName: 'Ronaldo',
      	age: 85,
      	getFullName: function () {
        	return `${this.firstName} ${this.lastName}`
        }

위의 경우에

• firstName / lastName / age 의 경우 속성(property)라고 불리우고
• getFullName과 같은, 하나의 객체 데이터에서 특정한 속성에 함수를 할당하게 되면 '메소드' 라고 할 수 있음.

---

  	return {
    	firstName: 'Cristiano',
      	lastName: 'Ronaldo',
      	age: 85,
      	getFullName: function () {
        	return `${this.firstName} ${this.lastName}`
        }
      
   메소드에서 function키워드를 사용할 때, 아래와 같이 콜론기호를 생략 할 수있음.
      단 화살표함수에서는 사용 불가능.
	return {
    	firstName: 'Cristiano',
      	lastName: 'Ronaldo',
      	age: 85,
      	getFullName() {
        	return `${this.firstName} ${this.lastName}`
        }