본문 바로가기

카테고리 없음

Object.create()

자바스크립트에서는 메서드라는 개념은 정확히 없다. 그러나 객체의 속성을 함수로 지정할수 있기 때문에 메서드 역할을 대처할수 있는 것이다.

Object.create() 메서드는 지정된 프로토타입 객체 와 속성(property)을 가지는 새로운 객체를 반환한다.

왜? 사용하는가. 자바스크립트 내부에서 생성자로 객체를 생성하면서 연결이 깨지는 것을 원하지 않았기 때문에 만들어진 것이 Object.create 함수다. 즉 연결이 끊어지지 않게 하기 위해서 사용한다고 할수있다.

위 글만 봐서는 도저히 무슨소린지 이해가 가지 않는다. 더 깊숙히 천천히 알아보도록 하자.

 

Object.create는 두가지 인자를 받는다 (prototypeObect,propertyOberct) 두번째(prototype) 옵션이라 없어도 무관하다.

 

function Person(name) {
    this.name = name;
}

Person.prototype ={
    myname: function() {
        console.log('my name is : ' + this.name);
    }
};

var objcreate = Object.create(Person.prototype);	//Person.prototype을 갖는 새로운 객
objcreate.name = 'kim';		//Person을 참조하는 것을 볼수 있다.
objcreate.myname();

 

사진을 보면 objcreate 가 지정된 프로토타입 객체(Person)을 갖는 새로운 객체를 반환한 것을 볼수 있다

new키워드를 사용할 때와 다른점은 소스에 생성자 개념이 약해지고 객체의 인스턴스와 인스턴스 간의 상속을 강조하는 것이 Object.create 함수의 특징이라고 할수있다.

두개의 차이점 new()는 생성자가 실행이되는데 Object.create는 생성자가 실행되지 않고 단순히 프로토타입만 받아온걸 볼수 있다.

이 둘은 같은 프로토타입을 갖고 있다. 결론은 Object.create는 생성자로 객체를 만드는것이 목적이 아니라 프로토타입에 참조가 주 목적이라고 할수있다.

var Human = function(name) {
  this.name = name;
}

Human.prototype.sleep = function() {
  console.log(this.name + ' is sleeping...');
}

var steve = new Human('steve');

var Student = function(name) {
  //Human.call(this.name); // Human.apply(this, arguments)
  //12번째 줄이 있지 않다면 Human의 this가 undefinde가 된다.
  //this에 값을 주려면 call과 apply를 사용하면 된다.
}

Student.prototype = Object.create(Human.prototype);
//Student.prototype.constructor = Student;
//18번째 줄은 constructor을 이어주는 코드이다.
//18번째 줄이 없다면 construct는 Human 을 가르키게 된다.
//왜냐하면 Object.create 메서드를 사용할때 참조를 Human으로 바꿔줬기 때문이다.
//construct를 다시 Student에 연결하기 위해서는 18번째 코드를 사용하여 연결할수 있다.
Student.prototype.learn = function() {};

var john = new Student('john');
john.learn();
john.sleep();