javascript, jQuery & Node.js

prototype 프로토타입 만들기, 객체 재사용 - 객체지향 자바스크립트 05

yy_dd2 2022. 4. 25. 07:21
반응형

프로토타입 의미

객체 내의 함수를 객체의 밖에서 사용하여 모든 객체가 사용할  있는 함수로 만든다

 

프로토타입을 사용하지 않으면??

객체 안에 함수가 계속 생성이 되는데 시간,비용,메모리 사용량이 들어간다

 

프로토타입을 통해 어떻게 극복하는가?

객체의 밖에서 함수를 객체 안에 프로토타입으로 정의하여 함수를 만든다

객체들이 공통적으로 사용하는 함수를 정의함으로 객체 생성시에 계속 생성되는 과정을 생략하고

 한번의 포로토타입 함수 생성으로 시간,비용,메모리를 절약한다

 

// 생성자 함수
// constructor : new를 붙이면 객체를 생성하는 생성자가 된다
// 객체를 함수로 만들기
// 객체 안에 함수가 계속 생성이 되는데 시간,비용,메모리 사용량이 들어간다
function Person(name,first,second){
    this.name = name;
    this.first = first;
    this.second = second;
    // this.sum = function(){
    //     return this.first+this.second;
    // }
}

// 3.
// prototype 으로 객체의 함수 만들기
// 단 한번만 실행된다 -> 메모리 절약 시간 절약
Person.prototype.sum = function(){
    //return this.first+this.second;
    return 'prototype : '+ (this.first+this.second);
}



var kim = new Person('kim', 10, 20);
// 4.
// 객체가 무수히 많을 때 하나의 객체에만 다른sum 함수를 주고싶다.
kim.sum = function(){
    return 'this : '+ (this.first+this.second);
}
// 1. 
// ex sum을 바꾸고싶다
// kim.sum = function(){
//     return 'modified : '+ (this.first+this.second);
// }
// 2. 근데 lee.sum 도 바꾸고싶다 그럼 또 이걸 써야하는데.....
// 객체 공통적으로 사용되는 속성을 가진 함수를 만들고 싶다
var lee = new Person('lee', 10, 10);
// lee.sum = function(){
//     return 'modified : '+ (this.first+this.second);
// }
// lee 안에 함수가있는지 찾고 없으면 생성자안에 prototype에 sum() 함수가 있는지 찾는다
console.log("kim.sum()", kim.sum());
console.log("lee.sum()", lee.sum());
반응형