首頁 web前端 js教程 JS函數重載的解決方案_javascript技巧

JS函數重載的解決方案_javascript技巧

May 16, 2016 pm 04:48 PM
javascript js 函數重載

在物件導向的程式設計中,很多語言都支援函數重載,能根據函數傳遞的不同個數、類型的參數來做不同的操作,JS對它卻不支持,需要我們額外做些小動作。
  
  在JS的函數執行上下文中有一個名為arguments的有意思的變量,它以數組的形式存儲了函數執行時傳遞過來的所有參數,即使函數定義沒有定義這麼多個形參。還有一個特別之處就是跟Array類型相比,arguments變數有且只有一個length屬性,Array的方法,例如push、pop 等,它並不具備,它只是一個「偽數組」:具有length屬性,存儲的數組能夠用數組訪問符[]來訪問,並且是只讀不可寫。

一、對於不同個數參數的重載
  這裡應該很明白,直接用arguments函數的length屬性來判斷就可以了。


複製程式碼 程式碼如下:






二、對於不同類型的參數的重載
 
  對於JS這樣一種動態類型的語言,這種變數聲明的隨意性淡化了嚴格的變數類型在開發人員腦子裡的重要性(PS:同樣是基於ECMA系統的,AS就引入了變數宣告的強制類型),許多意想不到的BUG其實都是由這種變數類型的自動轉換造成的。其實JS提供了很精確的方法讓我們來嚴格偵測變數的類型,比較通 用的就是typeof方法和constructor屬性。

1、typeof variable 回傳變數型別

複製程式碼

程式碼如下:temp = "say"; //string
temp = "say"; //string


temp = "say"; //string


temp = "say"; //string


temp = "say"; //string
temp = 1; //number
temp = undefined; //undefined
temp = null; //object temp = {}; //object

temp = []; //object

temp = true; //boolean

temp = function (){} //function

alert(typeof temp);

    透過上面的測試你可以看出來,對於null,Object,Array回傳的都是object類型,而使用下面的方法就可以解決這個困擾。 2.constructor屬性偵測變數型別     JS中每個物件都有constructor屬性,它是用來引用建構此物件的函數,透過這個引用的判斷就可以偵測變數類型了。


複製程式碼


程式碼如下:

temp = "say"; ==String; //true temp= {};

temp.constructor == Object;//true

temp= [];

temp.constructor == Array;//true


複製程式碼


程式碼如下:

//自訂物件function Ball() {}

//實例化一個物件

var basketBall = new Ball();

basketBall.constructor==Ball; //true

複製程式碼 程式碼如下:

function talk(msg){
     var t = typeof msg;
     if(t=="string"){     else if(t=="number"){
            alert("It's a number");
   talk("demo"); //It's a number



附上一個很巧妙的嚴格偵測參數型別和個數的函數:

複製程式碼

程式碼如下://依據參數列表來嚴格檢查一個變數列表的類型function strict( types, args ) {      // ,則拋出異常
           throw "Invalid number of arguments. Expected " types.length ", received " arg 🎜>    for ( var i = 0; i           //如JavaScript某些類型不符,則拋出異常
    //如JavaScript某些類型不符[i] ) {
               >     }
}

//上述方法的使用
function doFunction(id,name){
     //偵測參數數量與型別
     strict([Number,String],arguments);    strict([Number,String],arguments);    strict([Number,String],arguments);   
}


本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn

熱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

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

熱工具

記事本++7.3.1

記事本++7.3.1

好用且免費的程式碼編輯器

SublimeText3漢化版

SublimeText3漢化版

中文版,非常好用

禪工作室 13.0.1

禪工作室 13.0.1

強大的PHP整合開發環境

Dreamweaver CS6

Dreamweaver CS6

視覺化網頁開發工具

SublimeText3 Mac版

SublimeText3 Mac版

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

建議:優秀JS開源人臉偵測辨識項目 建議:優秀JS開源人臉偵測辨識項目 Apr 03, 2024 am 11:55 AM

人臉偵測辨識技術已經是一個比較成熟且應用廣泛的技術。而目前最廣泛的網路應用語言非JS莫屬,在Web前端實現人臉偵測辨識相比後端的人臉辨識有優勢也有弱勢。優點包括減少網路互動、即時識別,大大縮短了使用者等待時間,提高了使用者體驗;弱勢是:受到模型大小限制,其中準確率也有限。如何在web端使用js實現人臉偵測呢?為了實現Web端人臉識別,需要熟悉相關的程式語言和技術,如JavaScript、HTML、CSS、WebRTC等。同時也需要掌握相關的電腦視覺和人工智慧技術。值得注意的是,由於Web端的計

如何區分 C++ 中函式重載與重寫 如何區分 C++ 中函式重載與重寫 Apr 19, 2024 pm 04:21 PM

函數重載允許一個類別中具有同名但簽名不同的函數,而函數重寫發生在衍生類別中,當它覆蓋基底類別中具有相同簽名的函數,提供不同的行為。

js和vue的關係 js和vue的關係 Mar 11, 2024 pm 05:21 PM

js和vue的關係:1、JS作為Web開發基石;2、Vue.js作為前端框架的崛起;3、JS與Vue的互補關係;4、JS與Vue的實踐應用。

PHP 函數的重載與重寫 PHP 函數的重載與重寫 Apr 26, 2024 pm 05:12 PM

PHP中支援函數重載和重寫,可建立靈活可重複使用的程式碼。函數重載:允許建立同名函數,但參數不同,根據參數匹配情況呼叫最合適的函數。函數重寫:允許子類別定義同名函數,覆寫父類別方法,子類別方法呼叫時將覆寫父類別方法。

golang如何實作函式重載? golang如何實作函式重載? Apr 29, 2024 pm 05:21 PM

Go語言不支援傳統函數重載,但可以透過以下方法實現類似效果:使用命名函數:為不同參數或傳回類型的函數建立唯一名稱;使用泛型(Go1.18及以上):為不同類型參數建立函數的單一版本。

C++ 函式重載的限制和注意事項有哪些? C++ 函式重載的限制和注意事項有哪些? Apr 13, 2024 pm 01:09 PM

函數重載的限制包括:參數類型和順序必須不同(相同參數個數時),不能使用預設參數區分重載。此外,模板函數和非模板函數不能重載,不同模板規範的模板函數可以重載。值得注意的是,過度使用函數重載會影響可讀性和偵錯,編譯器從最具體到最不具體的函數進行搜尋以解決衝突。

C++ 函式重載的最佳實踐 C++ 函式重載的最佳實踐 Apr 20, 2024 am 10:48 AM

C++函數重載最佳實務:1、使用清晰且有意義的名稱;2、避免過載過多;3、考慮預設參數;4、保持參數順序一致;5、使用SF​​INAE。

C++ 函式重載在實際專案中的應用場景? C++ 函式重載在實際專案中的應用場景? Apr 26, 2024 pm 01:57 PM

函數重載允許在C++中以不同方式定義具有相同名稱的函數,處理不同類型的參數或執行不同操作。具體應用場景包括:處理不同資料類型提供不同的功能提高程式碼可讀性

See all articles