[자바스크립트] 객체 생성 요약 (객체 리터럴, 생성자 함수)

객체 리터럴 객체 생성 방식

const member1 = {
 name: '박진영',
 getName(){
  return this.name; 
 }
}

const member2 = {
 name: '김진영',
 getName(){
  return this.name; 
 }
}

동일한 구조임에도 항상 {} 를 사용해서 객체를 생성한다.
하지만 생성자 함수에 의한 객체 생성 방식은 다르다.

생성자 함수 방식

function Member(name){
  console.log(this);
  this.name = name;
  this.getName = function(){
    return this.name; 
  }
}


const member1 = new Member('박진영');
const member2 = new Member('김진영');

console.log(member1.getName()+' '+member2.getName());
//박진영 김진영 출력

new Member('xxx') 처럼 new 연산자와 함께 생성자 함수를 사용하면 JS엔진에서 다음과 같은 과정을 거쳐 인스턴스 생성->초기화 후 인스턴스를 반환한다.

1.먼저 런타임 이전에 생성자 함수 객체가 빈상태로 생성된다.
2.그리고 인스턴스는 this에 바인딩되면서 this 는 결국 빈객체를 가리키게 된다.
그다음 초기화가 이루어진다.
3.빈객체에 위에서 정의한 코드들을 한줄씩 읽는다.
4.한줄씩 읽으면서 name, getName 등 프로퍼티와 메서드를 추가하고
생성자 함수가 전달받은 인수를 받아 값을 할당한다.

5.마지막으로 객체를 가리키는 this를 반환한다.