JavaScript

22.05.08 생성자 함수와 new 연산자

슈팅스타제제 2022. 5. 8. 16:10

자바스크립트는 파도 파도 새롭네

Javascript is Wave Wave New

 

객체 리터럴 {...}을 사용하면 객체를 쉽게 만들 수 있다. 

만약 유사한 객체를 여러 개 만들어야 하는 경우가 생긴다면,

new 연산자와 생성자 함수를 사용하면 유사한 객체 여러 개를 쉽게 만들 수 있다. 

 

생성자 함수의 두가지 규칙

1. 함수 이름의 첫글자는 대문자로 시작한다. 

2. 반드시 'new' 연산자를 붙여 실행한다. 

 

function User(name){
  this.name = name
  this.isAdmin = false
}

위 생성자 함수의 작동 원리는

1. name 변수값이 인자로 들어오면

2. 빈 객체를 만들어 this 에 할당한다. 

3. 함수 본문을 실행한다. 본문에 대한 this 에 새로운 속성을 추가하여 this 를 수정한다. 

4. this 를 반환한다. 

function User(name){
// this = {} : 빈 객체가 암시적으로 만들어진다.

// 'name' 속성을 this 에 추가한다. 
  this.name = name
  
// 'isAdmin' 속성을 this 에 추가한다.
  this.isAdmin = false
  
// return this : this 가 암시적으로 반환된다. 
}

 

따라서 new User는 User 객체를 새로 하나 만드는 것이기 때문에 두번째 코드를 입력한 것과 동일하게 동작한다. 

let user = new User('제제')
let user = {
  name: '보라', 
  isAdmin: false
}

(요 위에거를 객체 리터럴 문법이라고 하는 듯..!)

 

* 만약 인자가 없는 생성자 함수는 괄호를 생략하여 호출할 수 있다. 

let User = new User
	||
let User = new User()

 

 

참고문서링크

https://ko.javascript.info/constructor-new

 

new 연산자와 생성자 함수

 

ko.javascript.info