|
js中的對(duì)象分為兩種：普通對(duì)象object和函數(shù)對(duì)象function。  function fn1(){}; var fn2 = function(){}; var fn3 = new Function(); var fn4 = Function(); var obj1 = new fn1(); var obj2 = {}; var obj3 = new Object(); var obj4 = Object(); console.log(typeof fn1);//function console.log(typeof fn2);//function console.log(typeof fn3);//function console.log(typeof fn4);//function console.log(typeof obj1);//object console.log(typeof obj2);//object console.log(typeof obj3);//object console.log(typeof obj4);//object 還有就是所有的構(gòu)建函數(shù)比如Function、Object、Number等等都是函數(shù)對(duì)象，這個(gè)共知的。 //所有的構(gòu)建函數(shù)都是function類型的 console.log(typeof Object);//function console.log(typeof Function);//function console.log(typeof Number);//function 所有的這類構(gòu)建函數(shù)使用new或者直接調(diào)用方式都能構(gòu)建出一個(gè)新的數(shù)據(jù)類型。但是構(gòu)建出來(lái)的數(shù)據(jù)有區(qū)別的 var o = new Object(), o1 = Object(); console.log(o == o1);//false console.log(o === o1);//false var f = new Function(), f1 = Function(); console.log(f == f1);//false console.log(f === f1);//false var a = new Array(), a1 = Array(); console.log(a == a1);//false console.log(a === a1);//false var n = new Number(), n1 = Number(); console.log(n == n1);//true console.log(n === n1);//false var s = new String(), s1 = String(); console.log(s == s1);//true console.log(s === s1);//false var b = new Boolean(), b1 = Boolean(); console.log(b == b1);//true console.log(b === b1);//false //數(shù)據(jù)類型null/undefined是沒有構(gòu)造函數(shù)的 上面的例子中Object/Function/Array的對(duì)比結(jié)果都好說(shuō)，因?yàn)樗麄儤?gòu)建出來(lái)的都是新的對(duì)象，對(duì)象比較是要比較根源（數(shù)據(jù)是否是同一個(gè)）。無(wú)論是使用new還是直接調(diào)用生成一個(gè)新的對(duì)象是要開辟新的空間存儲(chǔ)的，不會(huì)和任何一個(gè)對(duì)象相等。 但是對(duì)于數(shù)值類型，比較符“==”只是比較值相等，比較符"==="除了比較值以外還要比較數(shù)據(jù)類型。 那么構(gòu)建數(shù)值類型比較為什么呈現(xiàn)上面的樣子？ 我們以Number為例。實(shí)際上new Number()構(gòu)建出來(lái)的變量n是一個(gè)特殊的對(duì)象，chrome上的展示如下 只不過(guò)這個(gè)對(duì)象和數(shù)值類型比較的時(shí)候被當(dāng)做數(shù)值類型來(lái)比較。當(dāng)使用“===”的時(shí)候比較數(shù)值相等時(shí)再比較數(shù)據(jù)類型的時(shí)候是有別于其他數(shù)值類型的。 上面提到了和數(shù)值類型比較的時(shí)候才成立，如果這個(gè)對(duì)象和其他對(duì)象比較則使用對(duì)象比較的規(guī)則。 比如下面的例子 var num = new Number(0); var str = new String(0); var str1 = String(0); console.log(num == str);//false console.log(num == str1);//true console.log(num === str1);//false num和str都是比較特殊的對(duì)象，str1為數(shù)值類型。num和str比較實(shí)用對(duì)象比較的規(guī)則來(lái)，num和str1比較實(shí)用數(shù)值比較的規(guī)則來(lái)。
上面分析了那么多，現(xiàn)在進(jìn)入正題。 普通對(duì)象是沒有prototype屬性的,只有隱藏屬性__proto__（IE上也有該隱藏屬性，但是使用obj.__proto__不能輸出東西，所以建議不要使用__proto__屬性）。而函數(shù)對(duì)象則兩者兼有。prototype屬性指向的是函數(shù)對(duì)象的原型對(duì)象，對(duì)象的__proto__屬性是創(chuàng)建實(shí)例對(duì)象的時(shí)候?qū)?yīng)的函數(shù)對(duì)象的原型對(duì)象。 a.函數(shù)對(duì)象的原型對(duì)象（fn.prototype）這里我們需要理解原型對(duì)象的值是怎么來(lái)的。原型對(duì)象的值實(shí)際上就是在函數(shù)創(chuàng)建的時(shí)候,創(chuàng)建了一個(gè)它的實(shí)例對(duì)象并賦值給它的prototype。過(guò)程如下（以Function為例） var temp = new Function(); Function.prototype = temp; 所以我們看一下熟知的函數(shù)的原型對(duì)象吧 //chrome下的顯示效果 Function.prototype;//function() {} Object.prototype;//Object {} Number.prototype;//Number {[[PrimitiveValue]]: 0} Boolean.prototype;//Boolean {[[PrimitiveValue]]: false} Array.prototype;//[] String.prototype;//String {length: 0, [[PrimitiveValue]]: ""} 說(shuō)道這里，必須提的是所有函數(shù)對(duì)象的原型對(duì)象都繼承制原始對(duì)象,即fn.prototype.__proto__為原始對(duì)象（原始對(duì)象在繼承屬性__proto__中有定義）。這其中比較特別的是Object函數(shù)，他的原型對(duì)象就是原始對(duì)象，即Object.prototype。 var f1 = new Function(); var f2 = Function(); var fn3 = function(){} console.log(f1.prototype.__proto__ === Object.prototype);//true console.log(f2.prototype.__proto__ === Object.prototype);//true console.log(f2.prototype.__proto__ === Object.prototype);//true console.log(Number.prototype.__proto__ === Object.prototype);//true console.log(Boolean.prototype.__proto__ === Object.prototype);//true
b.繼承屬性__proto__實(shí)際上js沒有繼承這個(gè)東東，但是__proto__卻起到了類似繼承的作用。我們所知的所有的對(duì)象起源都是一個(gè)空對(duì)象，我們把這個(gè)空對(duì)象叫做原始對(duì)象。所有的對(duì)象通過(guò)__proto__回溯最終都會(huì)指向（所謂的指向類似C中的指針，這個(gè)原始對(duì)象是唯一的，整個(gè)內(nèi)存中只會(huì)存在一個(gè)原始對(duì)象）這個(gè)原始對(duì)象。用下面的例子佐證 var o = new Object(); o.__proto__;//Object {} o.prototype;//undefined Object.prototype;//Object {} Object.__proto__;//function(){} Object.__proto__.__proto__;//Object {} var f = new Function(); f.__proto__;//function(){} f.prototype;//Object {} Function.prototype;//function(){} Function.__proto__;//function(){} Function.__proto__.__proto__;//Object {}  原始對(duì)象的__proto__屬性沒null,并且沒有原型對(duì)象。 所有的對(duì)象都繼承自原始對(duì)象;Object比較特殊，他的原型對(duì)象也就是原始對(duì)象;所以我們往往用Object.prototype表示原始對(duì)象。 //所有的對(duì)象都繼承自原始對(duì)象 //Object比較特殊，他的原型對(duì)象也就是原始對(duì)象 //所以我們往往用Object.prototype表示原始對(duì)象 Object.prototype === o.__proto__;//true Object.prototype === Object.__proto__.__proto__;//true Object.prototype === Function.__proto__.__proto__;//true f.prototype的的值貌似也是原始對(duì)象？其實(shí)不是，我們?cè)?strong>函數(shù)對(duì)象的原型對(duì)象這一段中不是說(shuō)過(guò)嗎函數(shù)對(duì)象f的原型對(duì)象實(shí)際上是函數(shù)對(duì)象的一個(gè)實(shí)例。每一個(gè)實(shí)例都是一個(gè)新的單獨(dú)的對(duì)象。 new f();//Object {}
所有的函數(shù)對(duì)象都繼承制原始函數(shù)對(duì)象；Function比較特殊，他的原型對(duì)象也就是原始函數(shù)對(duì)象；所以我們往往用Function.prototype表示原始函數(shù)對(duì)象；而原始函數(shù)對(duì)象又繼承自原始對(duì)象。 //所有的函數(shù)對(duì)象都繼承制原始函數(shù)對(duì)象， //Function比較特殊，他的原型對(duì)象也就是原始函數(shù)對(duì)象 Function.prototype === f.__proto__ Function.prototype === Object.__proto__ ;//true Function.prototype === Function.__proto__;//true //所以我們往往用Function.prototype表示原始函數(shù)對(duì)象 //而原始函數(shù)對(duì)象又繼承自原始對(duì)象 Function.prototype.__proto__ === Object.prototype; 所以對(duì)象之間的繼承和原型對(duì)象結(jié)構(gòu)如下圖（引用的別人的js object猜想圖）
看了上面的圖我們還知道函數(shù)對(duì)象的原型對(duì)象的構(gòu)造函數(shù)就是函數(shù)對(duì)象本身。不難理解函數(shù)對(duì)象的原型對(duì)象就是函數(shù)對(duì)象的實(shí)例了吧。
c. 原型鏈在使用New方法初始化函數(shù)的時(shí)候（詳細(xì)點(diǎn)擊查看new的深度理解）得到的新對(duì)象的__proto__屬性會(huì)指向函數(shù)對(duì)象的原型對(duì)象，而函數(shù)對(duì)象的原型對(duì)象又繼承至原始對(duì)象。所以呈現(xiàn)以下結(jié)構(gòu) function fn(){}; var test = new fn(); 把這個(gè)有__proto__串起來(lái)的直到Object.prototype.__proto__為null的鏈叫做原型鏈。原型鏈實(shí)際上就是js中數(shù)據(jù)繼承的繼承鏈。
如果覺得本文不錯(cuò)，請(qǐng)點(diǎn)擊右下方【推薦】！ |
|
|
來(lái)自： 昵稱10504424 > 《工作》
