[javascript] new 연산자와 생성자 함수

쏘소·2022년 5월 2일
0

Javascript

목록 보기
3/5

생성자 함수

따르는 규칙

  1. 함수 이름의 첫 글자는 대문자로 시작(함수가 대문자로 시작하면 new를 이용해 생성자로 만들어 시행해야 한다는 약속)
  2. 반드시 'new'연산자를 붙여 실행

생성자 함수 알고리즘 동작 원리

  1. 빈 객체를 만들어 this에 할당
  2. 함수 본문을 실행. this에 새로운 프로퍼티를 추가해 this를 수정한다.
  3. this를 return으로 반환한다.
function User(name) {
  // this = {};  (빈 객체가 암시적으로 만들어짐)

  // 새로운 프로퍼티를 this에 추가함
  this.name = name;
  this.isAdmin = false;

  // return this;  (this가 암시적으로 반환됨)
}

생성자 함수를 쓰는 이유, 의의

new User("호진"), new User("지민") 등 재사용할 수 있는 객체 생성 코드를 구현할 수 있다. 또한 생성자 함수를 사용하면 매개변수를 이용해 객체 내부를 자유롭게 구성할 수 있어 유연성이 확보 된다. 예를 들어 생성자 함수 내에 메서드를 더해줄 수 있다.

익명 생성자 함수

재사용이 필요없는 복잡한 객체를 만들 때 사용하게 된다. 생성자 함수는 익명 함수이기 때문에 어디에도 저장되지 않는다. 처음 만들 때부터 단 한 번만 호출할 목적으로 만들었기 때문에 재사용이 불가능하다. 이렇게 익명 생성자 함수를 이용하면 재사용은 막으면서 코드를 캡슐화 할 수 있다.

let user = new function() {
  this.name = "John";
  this.isAdmin = false;

  // 사용자 객체를 만들기 위한 여러 코드.
  // 지역 변수, 복잡한 로직, 구문 등의
  // 다양한 코드가 여기에 들어간다.
};     

Q 왜? 위의 예시처럼 user 에 let을 이용해서 익명 생성자 함수를 할당해주지 않았나? 다시 쓸 수 있지 않나,,,? 익명 함수에 대해서 다시 공부해봐야할 것 같다..

생성자 함수에서의 return문

생성자 함수엔 보통 return 문이 없다. 반환해야 할 것들은 모두 this에 저장되고, this는 자동으로 반환되기 때문에 반환문을 명시적으로 써 줄 필요가 없다.

하지만 return 문이 존재한다면 아래와 같은 간단한 규칙이 적용된다.

  • 객체를 return 한다면 this 대신 객체가 반환된다.
  • 원시형을 return 한다면 return문이 무시된다.

참고 - 자바스크립트 설명문서

profile
개발하면서 행복하기

0개의 댓글