[JS]function 안 this의 History?

JS에서 function이 타입인지를 확인하여 현 this.명사 사용에서 this가 가르치는 의미를 알아보려고 한다.

이와같은 자료는 '드림코딩' 채널을 통해서 작성해 보았다.

※이와 같은 function 회기 아이디어는 전적으로 개인적인 생각을 바탕으로 구성되었기 때문에 참고로만 활용하기 바란다.

 

 

초기 function

const person = makePerson('ellie', 30)


// 아마도 초기 ES의 function은 아래와 같지 않았을까?

function makePerson(name, age){
return {
	
    name : name,
    age : age,
    };
}

 

 

중기 function

- 초기에서 key와 value의 명칭이 동일하다면 shorthand 원칙에 따라 아래와 같이 축약

function makePerson(name, age){
	return{
    name,
    age,
    };
}

 

 

현대 function === constructor by ES6

- new를 통해서 this라는 object를 만들어서 새로운 property를 넣는 과정

function Person(name, age) {
  //this = { }; 생략됨
  this.name = name;
  this.age = age;
  //return this;
  
  const person1 = new Person('ellie', 30);
  console.log(person1);

 

결국 내가 헷갈렸던 function 안에서 this는 생략으로 인하여 이해를 하지 못하다가 발견하여 정리.

ref

1. new operator(연산자)를 통해 object(객체) 생성

2. 호출 개별 인자를 받아 function의 parameter에 전달하고 코드블록을 수행

 

주의해야할 점은 this는 문맥에 따라 / 맥락에 따라 가리키는 방향이 다양함으로 주의가 필요하다.

 

 

 

출처

드림코딩(object), 생활코딩

 

ps- 왜 이렇게 <pre></pre>쓰는 부분이 깨지는 걸까?

 

업데이트 정보 : 2023.09.13