이번 포스팅에서는 객체를 생성하는 방법에 대해 정리해보려고 합니다.
생성자 함수 & 인스턴스
생성자 함수는 new 연산자와 함께 호출해서 객체를 생성하여 반환하는 함수를 말합니다.
주로 비슷한 성질을 가진 여러 개의 객체를 만들기 위해 미리 짜여진 거푸집 같은 거라고
생각하시면 이해하기 쉬울 겁니다.
생성자함수를 사용해서 나온 객체를 인스턴스라고 합니다.
|
1
2
3
4
5
6
7
8
9
10
11
12
13
|
function animal(tribe, color){
this.tribe = tribe;
this.color = color;
this.info = function(){
console.log('This is ${this.color} ${this.tribe}');
};
}
const radrebbit = new animal('rabbit', 'red');
console.log(redrabbit); // asnimal {tribe : 'rabbit', color : 'red', info : f}
redrabbit.info(); // This is red rabbit
|
cs |
그러나 무조건 생성자 함수를 사용해야만 객체를 만들 수 있는 건 아닙니다.
객체를 만드는 방법에는 생성자함수와 객체 리터럴을 이용해 만드는 방법 2가지가 있고
그중에서도 객체 리터럴 방식이 더 직관적이고 간편합니다.
비슷한 여러 객체를 생성해야 할 때는 생성자함수방식을 사용하고
일회성 객체를 생성할 때는 객체 리터럴방식을 사용하시면 됩니다. 상황에 맞게!
객체 리터럴
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
|
const rabbit = {
type = '토끼',
name = '흰발',
sound = '깡총'
say() {
console.log(this.sound);
}
};
console.log(rabbit.say()); // 깡총
const frog = {
type = '개구리',
name = '왕눈이',
sound = '개굴'
say() {
console.log(this.sound);
}
};
console.log(frog.say()); //개굴
|
cs |
위의 방식이 객체 리터럴방식입니다.
하지만 위에 말했다시피! 이렇게 비슷한 객체를 여러 개 만들어야 될 때는 생성자 함수를
이용하면 코드의 중복을 피할 수 있습니다.
프로토타입
같은 생성자 함수로 만들어진 객체는 모두 같은 프로토타입을 공유합니다.
즉 같은 객체 생성자 함수를 사용하면 함수 또는 값을 재사용하는 걸
프로토타입이라고 부릅니다.
프로토타입은 부모 객체의 역할을 하는데 다른 객체에 프로퍼티를 공유할 수 있는 특징이 있습니다.
프로토타입을 상속받은 자식객체는 부모객체의 프로퍼티를 자신의 것처럼 사용할 수 있습니다.
|
1
2
3
4
5
6
7
8
9
|
class Player {
constructor(name){
this.name = name;
return {};
}
}
const players = new Player('Yum');
console.log(players);
|
cs |
생성자 함수는 기본적으로 prototype 프로퍼티를 가지고 있는데 생성자 함수가 만들어지는
시점에 prototype이 생성되고, prototype안에 constructor 프로퍼티를 가지고 있습니다.
이번글은 여기서 마무리하고
다음에 좀 어려운 개념인 프로토타입에 대해 포스팅해보겠습니다.
글도 길어질 거 같고, 사실 저도 이해하고 적어야 한니깐요ㅎㅎ 공부해야 해요ㅠㅠ
읽어주셔서 감사합니다
