JS - 생성자 함수

- 객체 리터럴

let user = {

name : Mike,

age : 30,

}

 

Javascript에서는 위와 같이 name, age를 갖는 객체를 선언하여 만들어 줄 수 있다.

 

 그런데 개발을 하다보면 이러한 객체 리터럴을 여러개 생성해야하는 경우가 있는데

이럴 때 생성자 함수를 통해서 간편하게 생성할 수 있다.

function User(name, age) {
  this.name = name;
  this.age = age;
  this.sayName = function () {
    console.log(this.name);
  };
}

let user1 = new User("Kim", 20);
let user2 = new User("Han", 40);
let user3 = new User("Park", 30);
console.log(user1);
console.log(user3);
user2.sayName();

 

 

이러한 생성자 함수를 작성할 떄 관례적으로 첫글자를 대문자로 작성해준다.

 

- 생성자 함수의 동작원리

 위 이미지에서 보이는 것처럼 실제로는 this ={}와 return this를 작성하지는 않지만 

작성된 것처럼 동작한다.

 

따라서 new 를 통해서 생성자 함수를 사용하면  먼저 생성자함수내에서 this = {} 라는 빈객체를 만들고

name, age를 각각 할당해준다. 그다음 this를 리턴해준다.

 

'JavaScript' 카테고리의 다른 글

JS - Call Stack  (0) 2022.04.30
JS - eval 함수 보안 취약점  (0) 2022.04.29
JS - 자바스크립트 호이스팅과 변수의 생성과정에 대해  (0) 2022.04.27
JS - toggle  (0) 2021.11.20
JS - Event listener  (0) 2021.11.16