1. 程式人生 > >javascript中Object.create與new的不同

javascript中Object.create與new的不同

new

new配合建構函式使用,建立一個新物件。

//定義class
var Person = function (firstName) {
  this.firstName = firstName;
};
//定義method
Person.prototype.sayHello = function() {
  console.log("Hello, I'm " + this.firstName);
};
//例項物件
var person1 = new Person("Alice");
//物件呼叫method
person1.sayHello(); // logs "Hello, I'm Alice"

這裡有個疑問,為啥sayHello方法定義在Person.prototype上,而prototype又是什麼東西? 

prototype是javascript OOP的magic。javascript的面向物件,繼承等實現都是圍繞著prototype屬性轉的。  在javascript中,只有function(javascript中function也是物件)才有prototype屬性。定義一個函式,它的prototype預設是一個空物件,即{}。

var test = function () {return 'haha';};
console.log(test.prototype); // {}

函式有了prototype屬性,由函式建立的物件才有原型的概念。person1由Person函式構建出來的,所以person1的原型就是Person.prototype。javascript使用__proto__指向物件的原型。

console.log(Person.prototype) // { sayHello: [Function] }
console.log(person1.__proto__) // { sayHello: [Function] }

由此可以總結new做了: 1. 建立例項物件person1  2. 呼叫建構函式(Person)初始化person1成員變數(firstname)。  3. 指定例項物件的原型為Person.prototype物件。即person1.__proto__指向Person.prototype

Object.create()
Object.create(o)的作用是建立一個空物件,空物件的原型是引數o:

var o = Object.create(null);
console.log(o); // {}
o.name = 'jian';
var o2 = Object.create(o);
console.log(o2); // {}
console.log(o2.name); // 'jian', 

o2為空物件,但o2.name輸出了‘jian‘,在物件o2上沒有找到name屬性,但在原型o上找到了。 由此可以總結Object.create()做了: 1. 建立空物件{}  2. 指定空物件{}的原型為Object.create()的引數。

原文:https://blog.csdn.net/bdss58/article/details/51288090