首頁 > web前端 > js教程 > 了解JavaScript,函數中的 Rest 參數

了解JavaScript,函數中的 Rest 參數

php中世界最好的语言
發布: 2017-11-18 09:55:37
原創
2286 人瀏覽過

我們的學習或工作中會牽涉到JavaScript,那麼也一定要了解JavaScript,說到rest參數,是函數很大一部分組成。而且函數千變萬化,這篇文章有助於你了解並且掌握JavaScript,讓我們來好好研究一下。

JavaScript函數可以使用任意數量的參數。與其他語言(如C#和Java)不同,你可以在呼叫JavaScript函數時傳遞任意數量的參數。 JavaScript函數允許未知數量的函數參數。在ECMAScript 6之前,JavaScript有一個變數來存取這些未知或可變數組的參數,這是一個類似陣列的對象,並非一個陣列。細想以下程式碼來理解arguments變數:

function add(){
    var result = 0;
    for(let i=0;i<arguments.length;i++){
        result = result + arguments[i];
    }
    return result;
}
var r = add(6,9,3,2);
console.log(r);
var t = add(7,56,9);
console.log(t);
登入後複製

如你所見,arguments物件用於存取未知或可變的函數參數。即使arguments使用length屬性和方括號,它也不是一個真正的JavaScript數組。你不能對arguments物件使用其他JavaScript陣列方法,如pop,push,slice等。在使用arguments時存在的一些問題是:

JavaScript函數arguments物件不是一個真正的JavaScript陣列;因此,你不能使用其他陣列方法,如pop,push,slice等。

內部函數中存取外部函數的arguments物件是很困難的。要存取的話,你需要在變數中分配外部函數的arguments函數,然後在內部函數中使用它。

如果你想要使用arguments物件作為數組,那麼你需要透過Aarry.prototype.slice手動轉換。

ECMAScript 6引入了一個新功能,Rest參數,它表示一個未知數量的參數作為函數中的一個陣列。它不僅將額外的參數表示為數組,還解決了arguments物件的許多問題。使用rest參數重寫上面的add函數。

function add(...theArgs){
    var result = 0;
    for(let i=0;i<theArgs.length;i++){
        result = result + theArgs[i];
    }
    return result;
}
var r = add(6,9,3,2);
console.log(r);
var t = add(7,56,9);
console.log(t);
登入後複製

你可以將rest參數定義為…theArgs或… args。如果最後命名的函數參數以…(三個點)作為前綴,那麼它將成為函數的rest參數。 JavaScript函數的rest參數是純JavaScript陣列。在上面的程式碼中,…theArgs是函數add的rest參數,因為它是唯一的命名參數,也以…(三個點)作為前綴。由於rest參數是JavaScript數組,所以你可以對rest參數theArgs執行諸如push,pop等操作,如下面的程式碼所示:

function add(...theArgs){
    theArgs.push(10);
    var result = 0;
    for(let i=0;i<theArgs.length;i++){
        result = result + theArgs[i];
    }
    var lastItem  = theArgs.pop();
    console.log(lastItem);
    return result;
}
登入後複製

JavaScript函數的rest參數也可以與其他參數一起工作。如果你不想在rest參數數組中包含特定參數的話,那麼你可能需要在函數中使用其他命名參數。細想以下程式碼區塊:

function add(num1, num2, ...theArgs){
    console.log(num1);
    console.log(num2);
    console.log(theArgs.length);
}
var r = add(6,9,3,2);
var t = add(7,56,9);
登入後複製

對於第一次函數調用,6和9將分別分配給num1和num2。對於第二個函數調用,7和56將被分配給num1和num2。啟動第三個參數的參數將會被指派給rest參數陣列。請記住,前兩個參數不會成為rest參數陣列的一部分。所以,如果你打算將所有的值都包含在rest參數中,那麼你應該一開始就將它們定義為用逗號分隔的命名參數。下面給出的程式碼將會導致錯誤:

function add(num1, ...theArgs,num2){
    console.log(num1);
    console.log(num2);
    console.log(theArgs.length);
}
登入後複製

在上面的程式碼中,rest參數不是最後一個參數,所以JavaScript會拋出錯誤。 rest參數必須是最後一個正式參數。

JavaScript允許你破壞rest參數,這意味著你可以將rest變數資料解包為不同的變數名稱稱呼。請看下面的程式碼:

function add(...[a,b,c]){
    return a+b+c;
}
var r = add(6);
console.log(r);
var t = add(7,56,9);
console.log(t);
登入後複製

第一次函數調用,將分配a = 6,b = undefined,c = undefined,第二次函數調用,將分配a = 7,b = 56,c = 9。在此範例中,函數將忽略傳遞的任何額外的參數。

JavaScript函數的rest參數是arguments物件使用函數未知參數的一個巨大改進。它是一個純JavaScript陣列;因此,你可以對它使用所有陣列方法。你可以將rest變數資料解包到命名變數中。你可以給rest參數指定任何名稱,這又是一個使用arguments關鍵字的重大改進。

在「了解JavaScript」系列的下一篇文章中,我們將介紹JavaScript函數中的預設參數,敬請期待。

了解JavaScript,函數中的 Rest 參數,到這裡就結束了。歡迎大家一起研究探討:

相關閱讀:

了解JavaScript,了解 let 語句

#


了解JavaScript,函數中的預設參數


原生js實作可移動的提示div框原始碼


以上是了解JavaScript,函數中的 Rest 參數的詳細內容。更多資訊請關注PHP中文網其他相關文章!

相關標籤:
來源:php.cn
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板