搜尋
首頁web前端js教程js中繼承的幾種用法總結(apply,call,prototype)_javascript技巧

一,js中物件繼承

js中有三種繼承方式

1.js原型(prototype)實作繼承

複製程式碼 程式碼如下:


程式碼如下:



程式碼如下:



 
 
 
 
 

2.建構子實現繼承複製程式碼
程式碼如下:


 
 
 




3.call , apply實現繼承


複製代碼 程式碼如下:

 
 
 




二、call和apply的用法(詳細介紹)


js中call和apply都可以實現繼承,唯一的一點參數不同,func.call(func1,var1,var2,var3)對應的apply寫法為:func.apply(func1,[var1,var2,var3] )。
JS手冊中對call的解釋:

複製代碼


代碼如下:

代碼如下:call 方法  呼叫一個物件的一個方法,以另一個物件取代目前物件。 
    call([thisObj[,arg1[, arg2[,   [,.argN]]]]) 

參數可 
thisObj 

參數可 
。將被用作當前對象的對象。 

arg1, arg2,  , argN 
可選。將會被傳遞方法參數序列。 

說明 
call 方法可以用來取代另一個物件呼叫一個方法。 call 方法可將一個函數的物件上下文從初始的上下文變更為由 thisObj 指定的新物件。 

如果沒有提供 thisObj 參數,則 Global 物件被用作 thisObj。  


說簡單一點,這兩函數的作用其實就是更改物件的內部指針,也就是改變物件的this指向的內容。這在物件導向的js程式設計過程中有時是很有用的。以下以apply為例,說說這兩個函數在 js中的重要角色。如:


複製程式碼 程式碼如下:

function Person(name,age){   //定義一個類別  
       age;       //年齡  
       顯示類別的屬性  
        this.funcName=" Print"; 
        this.show=function(){ 
                            if(typeof(this[key])!="function "){ 
                    msg.push([key,":",this[key]].join(              } 
            alert(msg.join(" ") ); 
        }; 
    } 
    function Student(name,age,grade,school){ ), 學生類別all優越的地方  
        Print.apply(this,arguments); 
        this.grade=grade;      school=school;                 //學校  
    } 
    var p1=new Person("卜開化",80); 
    p1.sayhello(); 
    var s1=new Student("白雲飛",40,9,"岳麓學院"); 
>    s1.sayhello(); 
    alert(s1.funcName);
 


另外,Function.apply()在提升程式效能方面有著突出的作用:
另外,Function.apply()在提升程式效能方面有著突出的作用:
我們先從Math.max()函數說起,Math.max後面可以接任意個參數,最後回傳所有參數中的最大值。
例如




複製程式碼


程式碼如下:

alert(Math.max(5,8));   //8  
    alert(Math.max(5,7,9,3, 1,6));   //9  

    //但是在許多情況下,我們需要找出陣列中最大的元素。  

    var arr=[5,7,9,1]; 
    //alert(Math.max(arr));    // 卻是不行的。 NaN  

    //要這樣寫  
    function getMax(arr){ 
      ];i            ret=Math.max(ret,arr[i]); 
      🎜>
    alert(getMax(arr)); //9  

    //改用apply,可以這樣寫  
    function getMax2(arr){ 
    🎜>    alert(getMax2(arr)); //9  

    //兩段程式碼達到了同樣的目的,但是getMax2卻優雅,高效,簡潔得多。  

    //再例如陣列的push方法。
    var arr1=[1,3,4]; 
    var arr2=[3,4,5]; 
    //如果我們要把arr2展開,然後一個一個追加到arr1中去,最後要把arr1中去設arr1=[1,3,4,3,4,5]  
    //arr1.push(arr2)明顯是不行的。 因為這樣做會得到[1,3,4,[3,4,5]]  

    //我們只能用一個循環去一個一個的push(當然也可以用arr1.concat(arr2) ,但concat方法並不會改變arr1本身)  

    var arrLen=arr2.length; 
    for(var i=0;i    } 

    //自從有了Apply,事情就變得如此簡單  

    Array.prototype.push.🎜>
    Array.prototype.push.o.想要的結果
 


陳述
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
Java vs JavaScript:開發人員的詳細比較Java vs JavaScript:開發人員的詳細比較May 16, 2025 am 12:01 AM

javaandjavascriptaredistinctlanguages:javaisusedforenterpriseandmobileapps,while javascriptifforInteractiveWebpages.1)JavaisComcompoppored,statieldinglationallyTypted,statilly tater astrunsonjvm.2)

JavaScript數據類型:瀏覽器和nodejs之間是否有區別?JavaScript數據類型:瀏覽器和nodejs之間是否有區別?May 14, 2025 am 12:15 AM

JavaScript核心數據類型在瀏覽器和Node.js中一致,但處理方式和額外類型有所不同。 1)全局對像在瀏覽器中為window,在Node.js中為global。 2)Node.js獨有Buffer對象,用於處理二進制數據。 3)性能和時間處理在兩者間也有差異,需根據環境調整代碼。

JavaScript評論:使用//和 / * * / * / * /JavaScript評論:使用//和 / * * / * / * /May 13, 2025 pm 03:49 PM

JavaScriptusestwotypesofcomments:single-line(//)andmulti-line(//).1)Use//forquicknotesorsingle-lineexplanations.2)Use//forlongerexplanationsorcommentingoutblocksofcode.Commentsshouldexplainthe'why',notthe'what',andbeplacedabovetherelevantcodeforclari

Python vs. JavaScript:開發人員的比較分析Python vs. JavaScript:開發人員的比較分析May 09, 2025 am 12:22 AM

Python和JavaScript的主要區別在於類型系統和應用場景。 1.Python使用動態類型,適合科學計算和數據分析。 2.JavaScript採用弱類型,廣泛用於前端和全棧開發。兩者在異步編程和性能優化上各有優勢,選擇時應根據項目需求決定。

Python vs. JavaScript:選擇合適的工具Python vs. JavaScript:選擇合適的工具May 08, 2025 am 12:10 AM

選擇Python還是JavaScript取決於項目類型:1)數據科學和自動化任務選擇Python;2)前端和全棧開發選擇JavaScript。 Python因其在數據處理和自動化方面的強大庫而備受青睞,而JavaScript則因其在網頁交互和全棧開發中的優勢而不可或缺。

Python和JavaScript:了解每個的優勢Python和JavaScript:了解每個的優勢May 06, 2025 am 12:15 AM

Python和JavaScript各有優勢,選擇取決於項目需求和個人偏好。 1.Python易學,語法簡潔,適用於數據科學和後端開發,但執行速度較慢。 2.JavaScript在前端開發中無處不在,異步編程能力強,Node.js使其適用於全棧開發,但語法可能複雜且易出錯。

JavaScript的核心:它是在C還是C上構建的?JavaScript的核心:它是在C還是C上構建的?May 05, 2025 am 12:07 AM

javascriptisnotbuiltoncorc; sanInterpretedlanguagethatrunsonenginesoftenwritteninc.1)JavascriptwasdesignedAsignedAsalightWeight,drackendedlanguageforwebbrowsers.2)Enginesevolvedfromsimpleterterpretpretpretpretpreterterpretpretpretpretpretpretpretpretpretcompilerers,典型地,替代品。

JavaScript應用程序:從前端到後端JavaScript應用程序:從前端到後端May 04, 2025 am 12:12 AM

JavaScript可用於前端和後端開發。前端通過DOM操作增強用戶體驗,後端通過Node.js處理服務器任務。 1.前端示例:改變網頁文本內容。 2.後端示例:創建Node.js服務器。

See all articles

熱AI工具

Undresser.AI Undress

Undresser.AI Undress

人工智慧驅動的應用程序,用於創建逼真的裸體照片

AI Clothes Remover

AI Clothes Remover

用於從照片中去除衣服的線上人工智慧工具。

Undress AI Tool

Undress AI Tool

免費脫衣圖片

Clothoff.io

Clothoff.io

AI脫衣器

Video Face Swap

Video Face Swap

使用我們完全免費的人工智慧換臉工具,輕鬆在任何影片中換臉!

熱工具

WebStorm Mac版

WebStorm Mac版

好用的JavaScript開發工具

SublimeText3 Linux新版

SublimeText3 Linux新版

SublimeText3 Linux最新版

MinGW - Minimalist GNU for Windows

MinGW - Minimalist GNU for Windows

這個專案正在遷移到osdn.net/projects/mingw的過程中,你可以繼續在那裡關注我們。 MinGW:GNU編譯器集合(GCC)的本機Windows移植版本,可自由分發的導入函式庫和用於建置本機Windows應用程式的頭檔;包括對MSVC執行時間的擴展,以支援C99功能。 MinGW的所有軟體都可以在64位元Windows平台上運作。

SublimeText3漢化版

SublimeText3漢化版

中文版,非常好用

SublimeText3 Mac版

SublimeText3 Mac版

神級程式碼編輯軟體(SublimeText3)