原型
了解原型鏈,我們先了解下原型
- 所有的對象都有toString()、valueOf()、constructor、hasOwnProperty()等
- 所有的數組都是有對象應該有的屬性
- 所有的數組都有push()、shift()、join()、slice()、splice()等
- var array = [] 應該有數組共有的所有屬性
var array = []
我們用console.dir()檢測下array有什么屬性
我們發現 console.dir(array) 打出來的結果是:
- array 有一個屬性叫做
__proto__
(它是一個對象) -
array.__proto__
有很多屬性,包括 push()、shift()、join()、slice()、splice()等 -
array.__proto__
其實也有一個叫做__proto__
的屬性,包括toString()、valueOf()、constructor、hasOwnProperty()等 -
array.__proto__.__proto__
其實也有一個叫做__proto__
的屬性(console.log 沒有顯示),值為 null
原型鏈
當我們讀取 array.toString 時,JS 引擎會做下面的事情:
看看 array 數組本身有沒有 toString 屬性。沒有就走到下一步。
看看
array.__proto__
有沒有 toString 屬性,發現array.__proto__
有 toString 屬性,于是找到了
所以 array.toString
實際上就是第 2 步中找到的 array.__proto__.toString
。
可以想象,
如果
array.__proto__
沒有,那么瀏覽器會繼續查看array.__proto__.__proto__
如果
array.__proto__.__proto__
也沒有,那么瀏覽器會繼續查看array.__proto__.__proto__.__proto__
直到找到 toString 或者
__proto__
為 null。
上面這個搜索過程,是連著由 __proto__
組成的鏈子一直走的。
這個鏈子,就叫做原型鏈。
API
hasOwnProperty() 方法
hasOwnProperty() 方法會返回一個布爾值,指示對象是否具有指定的屬性作為自身(不繼承)屬性。
var o = {
name:'jack'
}
o.hasOwnProperty('name'); // true
o.hasOwnProperty('toString'); // false
Object.create() 方法
Object.create() 方法使用指定的原型對象和其屬性創建了一個新的對象。
var a ={
name:'jack'
}
var b = {
form:'china'
}
a = Object.create(b)
prototype
對象.__proto__
=== 對象.constructor.prototype
function Person(){}
Person.prototype.name = 'jack'
var person= new Person()
console.log(person.name) // jack
console.log(person.__proto__ === Person.prototype) // true
console.log(Person.__proto__ === Person.constructor.prototype) // true
console.log(Person.__proto__ === Function.prototype) //true
console.log(Person.prototype.constructor === Person) // true
console.log(Object.prototype.__proto__ === null) // true
console.log(Object.prototype.constructor === Object) // true
console.log(person.constructor === Person) // true
console.log(person.constructor === Person.prototype.constructor) // true
只有對象才有 __proto__
,只有函數才有 prototype
。