原型與原型鏈

denson 發(fā)布于2019-08-22 18:34 / 451人閱讀

摘要：全局對(duì)象規(guī)定全局對(duì)象叫做，但是瀏覽器把作為全局對(duì)象瀏覽器先存在的。就是一個(gè)哈希表，里面含有很多屬性。對(duì)象表示一個(gè)包含文檔的窗口，其屬性指向窗口中載入的文檔。使用屬性可以獲取指定文檔所在窗口。在標(biāo)簽瀏覽器比如中，每個(gè)標(biāo)簽具有自己的對(duì)象。

全局對(duì)象

ECMAScript規(guī)定全局對(duì)象叫做global，但是瀏覽器把window作為全局對(duì)象（瀏覽器先存在的）。
window就是一個(gè)哈希表，里面含有很多屬性。
window 對(duì)象表示一個(gè)包含DOM文檔的窗口，其 document 屬性指向窗口中載入的 DOM文檔。使用 document.defaultView 屬性可以獲取指定文檔所在窗口。
在標(biāo)簽瀏覽器（比如Firefox）中，每個(gè)標(biāo)簽具有自己的 window 對(duì)象。也就是說(shuō)，同一個(gè)窗口的標(biāo)簽之間不會(huì)共享一個(gè) window 對(duì)象。
無(wú)代碼時(shí)，創(chuàng)建一個(gè)新頁(yè)面window就會(huì)被創(chuàng)建。
window的屬性就是全局變量。
這些全局變量分為兩種：

1、一種是 ECMAScript 規(guī)定的

例如：

parseInt

parseFloat

Number

String

Boolean

Object

2、一種是瀏覽器自己加的屬性

例如：

alert

prompt

comfirm

console.log

console.dir

document

document.createElement

document.getElementById

簡(jiǎn)單類(lèi)型和對(duì)象的區(qū)別 1、創(chuàng)建一個(gè)number

var n = 1
var n = new Number(1)

這兩個(gè)都是創(chuàng)建一個(gè)Number類(lèi)型的數(shù)據(jù)，但是區(qū)別在于，第二個(gè)創(chuàng)建的是聲明一個(gè)對(duì)象，因?yàn)閖s創(chuàng)建初期要求和java相像，所以才有了這種數(shù)據(jù)創(chuàng)建方式,雖然用第一種創(chuàng)建的是一個(gè)簡(jiǎn)單數(shù)據(jù)類(lèi)型，但是卻可以擁有toString，valueOf等函數(shù)，這是因?yàn)榕R時(shí)轉(zhuǎn)換成一個(gè)temp臨時(shí)對(duì)象，而這個(gè)對(duì)象中包含了那些函數(shù)

2、創(chuàng)建一個(gè)string

var s = "string"
var s = new String("string")

創(chuàng)建string也有兩種方法，第二種方法和第一種的區(qū)別就是，第二種創(chuàng)建的也是一個(gè)對(duì)象，具體和number是一樣的

3、創(chuàng)建一個(gè)boolean

var b = true
var b = new Boolean(ture)

創(chuàng)建布爾類(lèi)型也有兩種方法，第二種創(chuàng)建的是一個(gè)對(duì)象，和number和string一樣，但是布爾使用第二種創(chuàng)建方法有個(gè)問(wèn)題就是，因?yàn)榈诙N創(chuàng)建的是一個(gè)對(duì)象，所以如果直接用來(lái)判斷無(wú)論是真假都會(huì)變成真，就像這樣

var b = new Boolean(false)

b == Boolean?{false}
!!b == true

因?yàn)樗袑?duì)象轉(zhuǎn)換為布爾值都為真

4、創(chuàng)建一個(gè)object

var o = {}
var o = new Object()

對(duì)于創(chuàng)建對(duì)象來(lái)說(shuō)，兩種創(chuàng)建方法得出的對(duì)象完全一樣

公用屬性（原型） 原型

所有對(duì)象上都有toString，valueOf這兩個(gè)函數(shù)，但是如果創(chuàng)建一個(gè)對(duì)象就創(chuàng)建一次這種共有的函數(shù)，那是非常占內(nèi)存的。
所以就將這些對(duì)象共有的函數(shù)給取出來(lái)重新生成一個(gè)對(duì)象并存在一個(gè)地址，這樣每創(chuàng)建一個(gè)對(duì)象將共有函數(shù)的地址存進(jìn)去就可以使每個(gè)對(duì)象調(diào)用其公用屬性了，不用浪費(fèi)去聲明重復(fù)意義的函數(shù)
在對(duì)象中存在一個(gè)隱藏屬性__proto__來(lái)儲(chǔ)存公用屬性的地址，當(dāng)要調(diào)用toString時(shí)，首先看對(duì)象屬性里存不存這個(gè)函數(shù)，如果不存在就會(huì)進(jìn)入公用屬性里面去找，然后調(diào)用

//控制臺(tái)打印
var o1 = {}
undefined
var o2 = new Object()
undefined
o1 === o2
false
o1.toString === o2.toString
true

由此可以看出，不同對(duì)象里的公用函數(shù)是一樣的，這個(gè)公用屬性就是原型
通過(guò)原型這種機(jī)制，JavaScript 中的對(duì)象從其他對(duì)象繼承功能特性；這種繼承機(jī)制與經(jīng)典的面向?qū)ο缶幊陶Z(yǔ)言的繼承機(jī)制不同。

原型鏈

不僅只有object有公用屬性，Number、String、Boolean都有各自的共有屬性，如果創(chuàng)建一個(gè)number類(lèi)型，其中toFixed函數(shù)并沒(méi)有存在于Obj的公用屬性里面，那么它要存在哪里
這就是因?yàn)镹umber也存在自己的公用屬性，當(dāng)使用Number創(chuàng)建一個(gè)對(duì)象的時(shí)候，對(duì)象中存在隱藏屬性__proto__儲(chǔ)存著Number公用屬性的地址，而Number的公用屬性中也存在著一個(gè)隱藏屬性__proto__，這個(gè)隱藏屬性存著的地址是Object的公用屬性的地址

var n = new Number(1)
var o1 = new Object()
n.__proto__.__proto__ === o1.__proto__
true

不僅是Number類(lèi)型是這樣，String和Boolean類(lèi)型中也存在各自的公用屬性，而像上面描述的那樣，Number對(duì)象存在隱藏屬性指向Number的公用屬性，Number公用屬性中存在隱藏屬性指向Object的公用屬性，像這樣像一條鏈子一樣將它們的公用屬性串連起來(lái)的東西就叫做原型鏈

__proto__和prototype

我們都知道瀏覽器有垃圾回收機(jī)制，但是當(dāng)我打開(kāi)一個(gè)頁(yè)面什么都沒(méi)有創(chuàng)建時(shí)，公用屬性作為一個(gè)哈希表，如果沒(méi)有被引用，那么它就將會(huì)被回收，而是什么引用的它們呢

Object.prototype

這個(gè)就是object的公用屬性，也就是原型

var o1 = {}
o1.__proto__ === Object.prototype
true

Number對(duì)象也是一樣的

var n1 = new Number(1)
n1.__proto__ === Number.prototype
true

由此我們可以推出n1的公用屬性的公用屬性就是

n1.__proto__.__proto__ === Object.prototype
true

String和Boolean也是和Number一樣

var s1 = new String("1")
var b1 = new Boolean(true)

b1.__proto__ === Boolean.prototype
true
s1.__proto__ === String.prototype
true
b1.__proto__.__proto__ === Object.prototype
true
s1.__proto__.__proto__ === Object.prototype
true

聲明一個(gè)變量，就是一、將哈希整理好，二、__proto__指向公用屬性
prototype和__proto__都是對(duì)公用屬性的引用，區(qū)別在于，prototype是防止公用屬性被垃圾回收清理，而__proto__是對(duì)公用屬性的使用
總結(jié)來(lái)說(shuō)就是

var 對(duì)象 = new 函數(shù)()
對(duì)象.__proto__ === 函數(shù).prototype//因?yàn)?Function 是 Object 的構(gòu)造函數(shù)。

__proto__是對(duì)象的屬性，prototype是函數(shù)的屬性
雖然String.prototype的隱藏屬性指向

String.prototype.__proto__ === Object.prototype
true

但是Object.prototype的隱藏屬性指向null

Object.prototype.__proto__ === null
true

云服務(wù)器 GPU云服務(wù)器原型原型鏈原型鏈原型鏈繼承原型鏈圖

文章版權(quán)歸作者所有，未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請(qǐng)注明本文地址：http://www.ezyhdfw.cn/yun/96009.html

發(fā)表評(píng)論

登陸后可評(píng)論

0條評(píng)論

denson

男|高級(jí)講師

我要關(guān)注我要私信

TA的文章

pacificrack黑五優(yōu)惠：混合服務(wù)器3折，低至$30/月，E5-2650v2/16G/240G

閱讀 2623·2021-11-22 12:05
學(xué)stm32有機(jī)會(huì)進(jìn)大公司嗎？如何選擇？

閱讀 3504·2021-10-14 09:42
舍利云：日本vps電信聯(lián)通CN2移動(dòng)直連2核2G內(nèi)存5M帶寬28.8元起

閱讀 1738·2021-07-28 00:15
自適應(yīng)和響應(yīng)式

閱讀 2038·2019-08-30 11:08
【學(xué)習(xí)筆記】CSS深入理解之float

閱讀 1544·2019-08-29 17:31
snippet,讓你編碼效率翻倍

閱讀 974·2019-08-29 16:42
JS 1-數(shù)據(jù)類(lèi)型

閱讀 2392·2019-08-26 11:55
javascript 數(shù)組的常用方法

閱讀 2164·2019-08-26 11:49

亚洲中字慕日产2020,大陆极品少妇内射AAAAAA,无码av大香线蕉伊人久久,久久精品国产亚洲av麻豆网站

資訊專(zhuān)欄INFORMATION COLUMN

上云采購(gòu)季！| 2核2G4M爆款云服務(wù)器低至59元/年，更有多臺(tái)、長(zhǎng)期優(yōu)惠，快來(lái)選購(gòu)！

原型與原型鏈

相關(guān)文章

《javascript高級(jí)程序設(shè)計(jì)》筆記：原型圖解

【5】JavaScript 函數(shù)高級(jí)——原型與原型鏈深入理解（圖解）

JavaScript中的原型與原型鏈

進(jìn)擊JavaScript之（四）原型與原型鏈

原型鏈一：原型與原型鏈

JavaScript系列--淺析原型鏈與繼承

發(fā)表評(píng)論

0條評(píng)論

denson

男|高級(jí)講師

TA的文章

pacificrack黑五優(yōu)惠：混合服務(wù)器3折，低至$30/月，E5-2650v2/16G/240G

學(xué)stm32有機(jī)會(huì)進(jìn)大公司嗎？如何選擇？

舍利云：日本vps電信聯(lián)通CN2移動(dòng)直連2核2G內(nèi)存5M帶寬28.8元起

自適應(yīng)和響應(yīng)式

【學(xué)習(xí)筆記】CSS深入理解之float

snippet,讓你編碼效率翻倍

JS 1-數(shù)據(jù)類(lèi)型

javascript 數(shù)組的常用方法

最新活動(dòng)

資訊專(zhuān)欄INFORMATION COLUMN

上云采購(gòu)季！| 2核2G4M爆款云服務(wù)器低至59元/年，更有多臺(tái)、長(zhǎng)期優(yōu)惠，快來(lái)選購(gòu)！

原型與原型鏈

相關(guān)文章

發(fā)表評(píng)論

0條評(píng)論

男|高級(jí)講師

TA的文章

最新活動(dòng)

上云采購(gòu)季！| 2核2G4M爆款云服務(wù)器低至59元/年，更有多臺(tái)、長(zhǎng)期優(yōu)惠，快來(lái)選購(gòu)！