實例詳解JavaScript構造函數和原型_第1頁
實例詳解JavaScript構造函數和原型_第2頁
實例詳解JavaScript構造函數和原型_第3頁
實例詳解JavaScript構造函數和原型_第4頁
實例詳解JavaScript構造函數和原型_第5頁
已閱讀5頁,還剩1頁未讀 繼續(xù)免費閱讀

下載本文檔

版權說明:本文檔由用戶提供并上傳,收益歸屬內容提供方,若內容存在侵權,請進行舉報或認領

文檔簡介

第實例詳解JavaScript構造函數和原型缺點:存在內存浪費的問題,

如果有倆對象或者更多就會對一個復雜數據類型進行空間的多次開辟

構造函數原型prototype原型對象主要解決了內存浪費的問題構造函數通過原型分配的函數是所有對象所共享的。在JavaScript里每一個構造函數都有一個prototype屬性,指向另一個對象。這個prototype就是一個對象,prototype這個對象的所有屬性和方法,都會被構造函數所擁有。這時候就可以使用prototype把方法放到里面供該對象所有的實例對象使用。

對象原型_proto_對象

對象都會有一個屬性_proto_指向構造函數的prototype原型對象,之所以我們對象可以使用構造函數prototype原型對象的屬性和方法,就是因為對象有_proto_原型的存在。

sy的_proto_和sym的_proto_是一樣的方法的查找規(guī)則:首先先看sy,sym對象身上是否有sing方法,如果有就執(zhí)行這個對象上的sing,因為存在__proto__,就去構造函數原型對象Prototype的存在,就去構造函數原型對象Prototype身上去查找sing這個方法(簡單來說就是,我自己有就使用,沒有就去原型對象里找)函數和對象創(chuàng)建時會自動創(chuàng)建一個屬性他兩指向同一個空對象

1.2constructor構造函數構造器構造函數

對象原型(_proto_)和構造函數(prototype)原型對象里面都有一個屬性constructor屬性,constructor我們稱為構造函數,因為它指回構造函數本身。

他們倆里面都有constructor如果prototype里面以對象的形式添加,那么就是prototype指向變了,指向了一個新的原型對象,這個新對象里沒有指向construor,需要自己手動指向一下

2.原型鏈

2.1js中成員查找規(guī)則

當訪問一個對象的屬性(包括方法)時,首先查找這個對象自身有沒有該屬性。如果沒有就查找它的原型(也就是._proto_指向的prototype原型對象)。如果還沒有就查找原型對象的原型(Object的原型對象)。依此類推一直找到Object為止(null)。

2.2原型對象this指向

1.在構造函數中,里面this指向的是對象實例shanyu

script

functionPerson(uname,uage){

this.uname=uname;

this.uage=uage;

//聲明一個變量然后驗證this指向是不是和實例化對象相同

varthat;

Ptotype.skill=function(){

console.log(我會吃飯

that=this;

varshanyu=newPerson(山魚,30);

shanyu.skill();

console.log(that===shanyu);

/script

2.3擴展內置對象

可以通過原型對象,對原來的內置對象進行擴展自定義的方法.

script

//自定義對象應用,給Array添加一個自定義方法

Atotype.sum=function(){

varsum=0;

for(vari=0;ithis.length;i++){

sum+=this[i];

returnsum;

vararr=[1,2,3,4];

console.log(arr.sum());

/script

數組和字符串內置對象不能給原型對象覆蓋操作Atotype={}如果進行該操作就會使本來有的方法被覆蓋掉,只能是Atotype.方法名=function(){}的方式。

3.call作用

調用這個函數,并且修改函數運行時的this指向,有三個參數分別是thisArg當前調用函數this的指向對象arg1,arg2傳遞的其他參數

script

functionsing(x,y){

console.log(a~a~給我已被忘情水

console.log(this);

console.log(x+y);

varfn={

name:山魚

//call()可以改變這個函數的this指向此時這個函數的this就指向了o這個對象

sing.call(fn,1,2)

/script

通過我們打的可以看到this的指向為Son,也就是Son使用了父構造函數里面的,uname,uage

4.1利用原型對象繼承

es6之前并沒有extends所以可以使用構造函數和模型對象結合的方式來進行繼承操作

script

functionFather(uname,uage){

this.uname=uname;

this.uage=uage;

Ftotype.eat=function(){

console.log(我愛吃雞腿

//子構造函數

Stotype=newFather();

Stotype.constructor=Son;

functionSon(uname,uage,swing){

Father.call(this,uname,uage);

this.swing=swing;

Stotype.student=function(){

console.log(我愛學習!!

//要向使用父親原型對象里面的方法,可以實例化一下Father,然后

//這時候Son的this指向到了Father,所以我們要用constructor

溫馨提示

  • 1. 本站所有資源如無特殊說明,都需要本地電腦安裝OFFICE2007和PDF閱讀器。圖紙軟件為CAD,CAXA,PROE,UG,SolidWorks等.壓縮文件請下載最新的WinRAR軟件解壓。
  • 2. 本站的文檔不包含任何第三方提供的附件圖紙等,如果需要附件,請聯系上傳者。文件的所有權益歸上傳用戶所有。
  • 3. 本站RAR壓縮包中若帶圖紙,網頁內容里面會有圖紙預覽,若沒有圖紙預覽就沒有圖紙。
  • 4. 未經權益所有人同意不得將文件中的內容挪作商業(yè)或盈利用途。
  • 5. 人人文庫網僅提供信息存儲空間,僅對用戶上傳內容的表現方式做保護處理,對用戶上傳分享的文檔內容本身不做任何修改或編輯,并不能對任何下載內容負責。
  • 6. 下載文件中如有侵權或不適當內容,請與我們聯系,我們立即糾正。
  • 7. 本站不保證下載資源的準確性、安全性和完整性, 同時也不承擔用戶因使用這些下載資源對自己和他人造成任何形式的傷害或損失。

評論

0/150

提交評論