객체??
객체란 서로 연관된 변수와 함수를 그룹핑한 그릇이라고 할 수 있다. 그리고 그 객체 내의 변수를 프로퍼티(property), 함수를 메소드(method)라고 부른다.
그리고 이렇게 생성된 객체는 일종의 독립된 프로그램처럼 독립성을 갖게된다. 독립성을 갖게된다는 것은 여러 완제품의 부품으로 사용될 수 있다는 것을 의미한다.
바로, 객체 지향(OOP)의 궁극적인 목표는 좋은 부품(객체)의 로직을 만드는 것이다.
객체의 재사용성
const person = {
'name' : '조은길',
'introduce' : function(){
return 'My name is '+this.name;
}
}
console.log( person.introduce() );
위의 코드는 person이라는 객체의 한 예시이다. person이라는 객체의 name에는 '조은길'이라는 정보가 담겨있다. 그런데, 조은길이 아니라 다른 이름을 담고 싶다면 어떻게 해야할까??
만약 다른 사람의 이름을 담을 객체가 필요하다면, 객체의 정의를 반복해야 할 것이다.
- CASE1
const person1 = {
'name' : '도날드 트럼프',
'introduce' : function(){
return 'My name is '+this.name;
}
}
const person2 = {
'name' : '조 바이든',
'introduce' : function(){
return 'My name is '+this.name;
}
}
위와같이 해도 문제가 없어보일 수있지만, 같은 취지의 객체를 이런 방식으로 찍어내는 것은 코드 중복이라는 문제가 발생한다.
위의 코드에서 새 객체를 찍어낼 때마다, 메소드를 정의하는 부분이 반복된다. 만약 이 메소드의 동작 방법을 변경한다면, 객체들을 일일히 찾아서 해당 메소드를 바꿔줘야 한다.
이거야 말로 프로그래머들이 가장 피하고 싶어하는 상황이다. 코드 중복은 코드의 가독성이 떨어진다는 것이고, 코드의 양이 많아진다는 것이며, 유지보수가 더 어려워진다는 의미이다.
그래서, 이런 중복을 피하기 위해 나온 개념이 생성자와 new이다.
생성자와 new 키워드
생성자와 new 키워드는 객체의 구조를 재활용하기 위해서 나온 개념이다.
생성자(constructor)는 객체를 만드는 역할을 하는 함수다. 자바스크립트에서 함수는 재사용 가능한 로직의 묶음이 아니라 객체를 만드는 창조자라고 할 수 있다.
let p = new person();
console.log(p);
위와 같이 new를 앞에 붙이고, 함수를 호출하면, 이 함수를 그냥 함수라고 하지 않고, 생성자라고 부른다.
더 정확하게는 객체의 생성자이다.
예제에서 생성자는 person() 베이스로 만든 객체를 return한다.
혹시 JS 이전에 다른 언어를 배우신 분이라면, 자기의 머리를 리셋하기 바란다. JAVA나 C++의 생성자(constructor)와는 전혀 다른 개념이다. Java에서는 생성자는 class 안에 존재한다. 즉, 생성자는 class에 소속 되있고, 이 생성자를 호출해서, 해당 class의 객체를 만든다.
그런데, JS는 생성자가 class를 비롯한 어디에도 소속되있지 않다. 그리고 이 함수에다가 new를 붙여서 실행하게 되면, 새로운 객체를 만들게 된다.
즉, 결론은 함수 앞에 new를 붙이면 그 return 값은 객체가 된다.
하지만,
const person = {
'name' : '조은길',
'introduce' : function(){
return 'My name is '+this.name;
}
}
console.log( person.introduce() );
위의 코드를 new를 이용해 Person()의 재사용성을 높히고 싶다면, 약간의 수정이 필요하다.
function Person(name){
this.name = name;
this.introduce = function(){
return 'My name is '+this.name;
}
}
var p1 = new Person('조은길');
console.log( p1.introduce());
var p2 = new Person('트럼프');
console.log( p2.introduce());
우리는 p1과 p2라는 서로 다른 이름이 저장 되있는 객체를 만들었다. 그러나, CASE1과는 확연한 개선이 일어났다.
바로
this.introduce = function(){
return 'My name is '+this.name;
} 의 코드의 중복을 막을 수 있게 됐다.
즉, 생성자가 하는 일은 객체에 대한 초기화이다.
우리가 Person이라고 하는 생성자가 만들어놓은 빈 객체가 어떠한 프로퍼티와 메소드를 가져야하는지를 생성자 안에 기술하므로써, 그 객체가 할 수 있는 일을 세팅해주는 데, 이것을 초기화 라고 한다.
이 초기화를 영어로는 initialization 줄여서, init 이라고 부른다.
지금까지 내용을 정리하자면,
1. 함수에new를 붙이면 리턴값은 객체 반환한다.
2.let p ={}와let p=new Person(){..}와 다를바없는데 장점은 중복제거, 객체에 대한 초기화이다.
- 객체를 양산하는 공장 => JS 생성자
자료출처
오늘 TIL은 코드스테이츠에서 학습한 내용과 생활코딩에서 학습한 내용을 바탕으로 작성됐다.
