JS基礎知識(2)-原型
阿新 • • 發佈:2018-11-22
每個函式都有 prototype 屬性,除了 Function.prototype.bind(),該屬性指向 原型。
每個物件都有 __proto__ 屬性,指向了建立該物件的建構函式的原型。其實這個 屬性指向了 [[prototype]],但是 [[prototype]] 是內部屬性,我們並不能訪問到, 所以使用 _proto_ 來訪問。 物件可以通過 __proto__ 來尋找不屬於該物件的屬性,__proto__ 將物件連線起 來組成了原型鏈。
一個物件除了自身的顯示屬性外還隱含一個_proto_屬性,這個屬性指向建立該物件的建構函式的原型。
如:
let foo={ //內部也是使用了 new Object() x: 10, y: 20 }
假設擁有兩個物件,它們之間只有一小部分不同,其他部分都相同。顯然,我們將會重用相似的功能/程式碼,如下calculate函式以及變數x為對b,c公用,則可以
var a = {
x: 10,
calculate: function (z) {
return this.x + this.y + z
}
};
var b = {
y: 20,
__proto__: a
};
var c = {
y: 30,
__proto__: a
};
通過建構函式來實現相同部分,也就是用建構函式來代替上述a的功能
function Foo(y) { // function 就是個語法糖 內部等同於 new Function() this.y = y; } Foo.prototype.x = 10; Foo.prototype.calculate = function (z) { return this.x + this.y + z; }; var b = new Foo(20); var c = new Foo(30);
程式碼關係如下圖:
每個物件都有一個原型。建構函式Foo也有自己的__proto__,值為Function.prototype,Function.prototype也通過其__proto__屬性關聯到Object.prototype。
物件可以通過 __proto__ 來尋找不屬於該物件的屬性,__proto__ 將物件連線起 來組成了原型鏈。
在ES6中有了類:
class Foo { constructor(name) { this._name = name; } getName() { return this._name; } } class Bar extends Foo { getName() { return super.getName() + ' Doe'; } } var bar = new Bar('John'); console.log(bar.getName()); // John Doe