(JS) this : "new" keyword

호두파파·2021년 1월 14일
0

this

목록 보기
5/7
function foo () {
  console.log("I am just a function..");
}

new foo();

자바스크립트에서 우리는 위와 같이 new키워드와 함께 함수를 실행할 수 있다. 앞에 new가 있다는 점만 제외한다면, 일반 함수 실행문과 동일하다.

new 키워드를 사용한 함수 내부에서 this를 사용할 경우, this의 값은 새로운 빈 객체가 된다.

function person (name) {
  this.name = name;
  console.log(this);
}

new person("hodoo");

this는 새로운 빈 객체로 시작하지만, 원한다면 새로운 속성을 추가할 수 있다.

new 키워드와 함께 사용될 경우, 해당 함수를 "생성자 함수" 라고 부른다.

function person (name) {
  this.name = name;
  console.log(this);
}

// 일반 함수로 사용되었습니다.
person("hodoo");

// 생성자 함수로 사용되었습니다.
new person("hodoo");

같은 함수라 하더라도 new키워드와 함께 사용했는지에 따라, 생성자 함수가 될 수도 아닐 수도 있다.

❗️생성자 함수 용도로 만든 함수는 생성자 함수로만 사용되고, 일반 함수 용도로 만든 함수는 일반 함수로만 사용된다. 두 개를 바꿔 사용하는 경우는 거의 없다.

function Person (name, age) {
  this.name = name;
  this.age = age;
}

new Person("hodoo", 10);

생성자 함수의 경우 함수명을 대문자로 시작하는 통상적인 표기법이 있다.

profile
안녕하세요 주니어 프론트엔드 개발자 양윤성입니다.

0개의 댓글