[JS] 생성과 반환의 차이

객체를 **"생성"**하는 것과 **"반환"**하는 것의 차이를 이해하는 것은 중요한 개념입니다. 둘의 차이는 객체를 만드는 과정과 그 결과물이 어떻게 처리되는지에 따라 구분됩니다.

1. 객체 생성 (Creation)

객체 생성은 메모리 공간에 새로운 객체를 만드는 행위입니다. 이 과정에서 객체의 속성들이 정의되고, 그 객체를 가리키는 참조가 생깁니다.

• new 키워드 사용:
  • new 키워드를 사용하여 생성자 함수를 호출하면, 자바스크립트 엔진은 자동으로 새로운 빈 객체를 메모리에 생성합니다.
  • 이 객체는 생성자 함수의 prototype 속성과 연결됩니다.
  • 생성자 함수 내부의 this는 이 새로 생성된 객체를 가리키며, 생성자 함수는 이 객체의 속성들을 초기화합니다.
  • 특별히 return 문이 없는 경우, 이 새로 생성된 객체가 자동으로 반환됩니다.

function YalcoChicken(name, no) {
    this.name = name;
    this.no = no;
}

const chain3 = new YalcoChicken('제주', 24);  // 새로운 객체가 생성됨

 

• 여기서 new YalcoChicken('제주', 24)는 새로운 객체를 생성하는 행위입니다.

2. 객체 반환 (Return)

객체 반환은 이미 존재하는 객체나 함수 내에서 생성된 객체를 반환하는 행위입니다. 즉, 반환은 객체를 함수 바깥으로 전달하는 것을 의미합니다.

• 일반 함수에서의 객체 반환:
  • 함수 내에서 객체를 생성하거나, 이미 존재하는 객체를 반환할 수 있습니다.
  • new 키워드와는 달리, 함수가 명시적으로 return을 사용해야만 해당 객체가 함수 호출의 결과로 반환됩니다.
  • 함수가 객체를 반환하면, 그 객체는 함수 호출 시 그 결과로 외부에 전달됩니다.

function createYalcoChicken(name, no) {
    return {
        name: name,
        no: no,
    };
}

const chain2 = createYalcoChicken('강남', 17);  // 생성된 객체가 반환됨

• 여기서 createYalcoChicken('강남', 17)는 함수 내에서 새로운 객체를 생성한 후 그 객체를 반환하는 것입니다.

3. 차이점 요약

• 생성:
  • 객체를 메모리에 새롭게 만들어내는 과정입니다.
  • new 키워드를 사용한 생성자 함수 호출 시 자동으로 이루어집니다.
• 반환:
  • 함수가 실행되고 나서, 그 함수 내에서 생성된 객체(또는 기존 객체)를 함수 바깥으로 전달하는 과정입니다.
  • 명시적으로 return 키워드를 사용하여 이루어집니다.

실제 사용 예시에서의 차이

• 생성만 하고 반환하지 않는 경우:
  • 객체를 생성만 하고 반환하지 않으면, 그 객체는 메모리에 존재하지만 호출한 코드에서는 접근할 방법이 없습니다. 예를 들어, 생성자 함수 내에서 객체를 생성하지만 return을 사용하지 않으면, 그 객체는 함수 내부에서만 존재합니다.
• 반환만 하고 생성하지 않는 경우:
  • 이미 존재하는 객체를 반환할 수 있습니다. 이 경우 메모리에 새로운 객체가 생성되는 것이 아니라, 이미 존재하는 객체를 전달합니다.

이렇게 생성과 반환은 서로 다른 개념이지만, 함수 호출 시 객체를 새로 만들고 그 결과를 전달하기 위해 자주 함께 사용됩니다.

 

 

 

---

 

 

 

1. 객체 생성의 이유:

1) 프로토타입 상속과 재사용성:

• new 키워드를 사용하는 생성자 함수는 객체의 프로토타입 체인을 설정합니다. 이로 인해 공유된 메서드와 속성을 여러 인스턴스가 공유할 수 있습니다.
• 생성자 함수는 메모리 효율적인 코드 작성에 기여합니다. 메서드가 prototype에 정의되면 모든 인스턴스가 이를 공유하게 되므로, 각 인스턴스마다 메서드를 중복 생성할 필요가 없습니다.

 

function YalcoChicken(name, no) {
    this.name = name;
    this.no = no;
}

YalcoChicken.prototype.introduce = function() {
    return `안녕하세요, ${this.no}호 ${this.name}점입니다!`;
};

const chain1 = new YalcoChicken('판교', 3);
const chain2 = new YalcoChicken('강남', 17);

console.log(chain1.introduce === chain2.introduce);  // true

 

 

• 이 예시에서 introduce 메서드는 모든 인스턴스가 공유합니다. 만약 일반 함수에서 객체를 반환하는 방식이었다면, 각 객체마다 동일한 메서드가 중복 생성되어 메모리를 더 많이 소비하게 됩니다.

2) 객체 생성의 명확한 구조:

• 생성자 함수를 사용하면, 객체를 생성하고 초기화하는 로직을 명확하게 구조화할 수 있습니다.
• new 키워드는 암묵적으로 객체를 생성하고 초기화하는 역할을 하므로, 코드가 간결하고 직관적이게 됩니다.

 

const chain = new YalcoChicken('제주', 24);  // 직관적으로 객체 생성

 

3) 객체 지향 프로그래밍(OOP)

• 생성자 함수는 객체 지향 프로그래밍에서 중요한 역할을 합니다. 객체 지향 프로그래밍은 클래스(또는 생성자 함수)와 인스턴스라는 개념을 중심으로 하기 때문에, 객체를 생성하는 방식이 필수적입니다.
• 객체 지향 프로그래밍의 패턴을 따르기 위해서 생성자 함수와 new 키워드를 사용하는 방식이 자주 사용됩니다.

2. 객체 반환의 이유:

1) 단순함과 유연성:

• 일반 함수를 사용해 객체를 반환하는 방법은 간단하고 유연합니다. 굳이 프로토타입 체인을 사용하지 않아도 되는 경우, 이러한 방식이 더 적합할 수 있습니다.
• 작은 규모의 프로젝트나 간단한 객체를 생성할 때 사용됩니다.

function createYalcoChicken(name, no) {
    return { name, no };
}

 

2) 메모리 효율성:

• 간단한 객체 생성이 필요한 경우, 생성자 함수보다 일반 함수를 사용하는 것이 메모리적으로 더 가볍습니다.
• 필요 없는 프로토타입 체인을 만들지 않으므로, 메모리를 절약할 수 있습니다.

3. 생성과 반환의 조화:

• 생성자 함수는 주로 재사용 가능하고 확장 가능한 구조를 만들 때 유용합니다. 이는 특히 프로토타입 상속을 이용할 때 메모리 효율적입니다.
• 일반 함수를 통한 반환은 간단한 객체를 만들 때 적합하며, 코드가 간결하고 직관적입니다.

결론:

• 객체 생성(new)과 반환은 서로 다른 목적을 가지고 있습니다. 생성은 객체 지향 프로그래밍에서의 구조와 재사용성을 강화하는 반면, 반환은 간단하고 가벼운 객체를 만드는 데 유리합니다.
• 어떤 것을 사용할지는 상황에 따라 달라집니다. 큰 규모의 시스템에서는 객체 지향 패턴과 생성자 함수가 유리할 수 있으며, 작은 프로젝트나 단순한 객체 생성에는 일반 함수와 반환이 더 적합할 수 있습니다.