原型鏈模式(深入)

2021-10-04 23:06:09 字數 1637 閱讀 4406

案例一

普通:functionfn(

)fn.prototype.

getx

=function()

;fn.prototype.

gety

=function()

;fn.prototype.

getz

=function()

;var f1 =

newfn

;

1、起乙個別名

把原來原型指向的位址賦值給我們的pro,現在他們操作的是同乙個記憶體空間

案例一拓展

functionfn(

)var pro = fn.prototype;

pro.

getx

=function()

;pro.

gety

=function()

;pro.

getz

=function()

;var f1 =

newfn

;

2、重構原型物件方式

自己開闢乙個堆記憶體,儲存我們公有的屬性和方法,把瀏覽器原來的給fn.prototype開闢的那個替換掉

案例一拓展:

functionfn(

)constructor:fn,

fn.prototype =,b:

function()

};var f=

newfn;f.

a();

>>可以執行

console.

log(f.constructor)

;>>object

1、只有瀏覽器天生給fn.prototype開闢的堆記憶體裡面才有constructor,而我們自己開闢的裡面沒有這個屬性,這樣constructor指向就不在fn而是object了

為了和原來的保持一致,我們需要手動的增加constructor指向

2、用這種方式給內建類增加公有屬性

給內建類array增加陣列去重的方法

案例二

普通array.prototype.

unique

=function()

;或者array.prototype =};

console.

dir(array.prototype)

;

我們這種方法會把之前已經存在於原型上的屬性和方法給替換掉了,所以我們用這種方式修改內建類的話,瀏覽器會給遮蔽掉

但是我們可以乙個個的修改內建的方法,當我們通過下面的方式在陣列的原型上增加方法,如果方法名和原來的內建重複了,會把人家內建的修改掉

我們以後再在內建類的原型上增加方法,命名都需要加乙個特殊的字首

案例二拓展

array.prototype.

sort

=function()

var ary =[1

,2,2

,3,2

,1,3

,4,1

,2];

ary.

sort()

;console.

log(ary)

;

深入解析原型鏈

每個函式都有prototype屬性,指向函式的原型物件,原型物件可用於掛載屬性和方法 注意 function.prototype.bind 除外,該函式沒有prototype prototype只有乙個屬性constructor,constructor指向建構函式本身 prototype的產生 宣告...

深入javascript之原型和原型鏈

所有引用型別 函式,陣列,物件 都擁有 proto 屬性 隱式原型 所有函式擁有prototype屬性 顯式原型 僅限函式 原型物件 擁有prototype屬性的物件,在定義數時就被建立 先複習下建構函式 建立建構函式 function word words word.prototype 建立例項 ...

深入JavaScript之原型和原型鏈

所有引用型別 函式 陣列 物件 都擁有 proto 屬性 隱式原型 所有函式擁有prototype屬性 顯式原型 僅限函式 原型物件 擁有prototype屬性的物件,在定義函式時就被建立 建立建構函式 function word words word.prototype 建立例項 var w ne...