JavaScript 문법 - 생성자함수

jihye·2022년 5월 17일
0

자바스크립트

목록 보기
5/7
post-thumbnail

생성자 함수란?
쉽게 말해, 붕어빵 틀이나 와플 팬이라 할 수 있다.
필요한 재료를 넣고 찍어내는 것.

생성자 함수는 관례적으로 첫 글자를 대문자로 사용하여 표기한다.
그리고 호출할 때는 new 키워드를 붙여 호출한다.
이렇게 new 키워드를 붙여야 생성자 함수가 되는 것이고,
따로 return을 작성하지 않아도 객체가 반환된다.


1. 사용법

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

let user1 = new User('jihye',11);
console.log(user1); //  User {name:'jihye', age: 11}

2. 동작 방법

new 함수명() 을 실행하면,
1. 생성자 함수 내부에서 this라는 빈 객체를 선언한다.
2. 그리고, this 에 name 과 age 라는 속성을 추가한다.
3. this 객체 반환

function User(name,age){
  //this={}
  this.name = name;
  this.age = age;
  //this={name : name, age: age};
}
new 함수명(); 

3. 함수와 생성자 함수는 어떻게 다른가?

이 의문은 내가 생성자 함수를 알지 못 할 때 들던 의문이었다.
함수와 쓰는것이 비슷해 보이는데 뭐가 다르지?
생성자 함수는 new라는 키워드를 붙여 함수 내부에 객체를 만들어서 객체를 return 해준다.
일반 함수는 new 키워드 없이 함수() 해버리면 그냥 호출이 되는 것이다. 만일 함수내에 return 값이 없으면 그냥 호출만하고 아무것도 return 해주지 못 하여 undefined가 된다.

function Item(title, price){
	this.title = title;
  	this.price = price; 
}
const item1 = new Item('가방',1000);
const item2 = Item('옷', 2000); 

console.log(item1, item2); 
//Item {title:'가방', price:1000}; 
// undefined 
profile
프론트엔드 개발자

0개의 댓글