亚洲中字慕日产2020,大陆极品少妇内射AAAAAA,无码av大香线蕉伊人久久,久久精品国产亚洲av麻豆网站

資訊專欄INFORMATION COLUMN

JavaScript剩余操作符Rest Operator

jone5679 / 435人閱讀

摘要：剩余操作符和展開操作符的表示方式一樣，都是三個(gè)點(diǎn)但是他們的使用場(chǎng)景會(huì)不同。獲取參數(shù)剩余操作符可以用來(lái)方便地獲取傳進(jìn)來(lái)的參數(shù)。想要變成數(shù)組，可以通過(guò)方法，使用剩余操作符可以避免將轉(zhuǎn)為數(shù)組的麻煩。

本文適合JavaScript初學(xué)者閱讀
剩余操作符

之前這篇文章JavaScript展開操作符(Spread operator)介紹講解過(guò)展開操作符。剩余操作符和展開操作符的表示方式一樣，都是三個(gè)點(diǎn) "...",但是他們的使用場(chǎng)景會(huì)不同。

剩余參數(shù)

定義函數(shù)的時(shí)候，如果函數(shù)的參數(shù)以… 為前綴，則改參數(shù)是剩余參數(shù)（rest parameter）。剩余參數(shù)表示參數(shù)個(gè)數(shù)不確定的參數(shù)列表。在函數(shù)被調(diào)用時(shí),該形參會(huì)成為一個(gè)數(shù)組,數(shù)組中的元素都是傳遞給該函數(shù)的多出來(lái)的實(shí)參的值。

獲取參數(shù)

剩余操作符可以用來(lái)方便地獲取傳進(jìn)來(lái)的參數(shù)。

function sum(a,b,...args){
  console.log(args.length); // 傳進(jìn)來(lái)的參數(shù)的個(gè)數(shù) 3
  let s = a + b;
  if(args && args.length){
      args.forEach(i => {s += i});
  }  
 return s;
}
sum(1, 2, 3, 4, 5 ); // 傳進(jìn)來(lái)的參數(shù)的個(gè)數(shù) 3

其中第一個(gè)形參a對(duì)應(yīng)的是1,第二個(gè)形參b對(duì)應(yīng)的2,…args表示的就是[3, 4, 5]。

和arguments的差別

上面剩余參數(shù)args是一個(gè)數(shù)組，而函數(shù)的arguments是一個(gè)偽數(shù)組。應(yīng)此剩余參數(shù)可以使用數(shù)組的相關(guān)方法sort，map，forEach，pop，而arguments不能。

arguments想要變成數(shù)組，可以通過(guò)Array.prototype.slice.call方法，使用剩余操作符可以避免將arguments轉(zhuǎn)為數(shù)組的麻煩。

// 下面的代碼模擬了剩余數(shù)組
function sum(a,b,){
  var args = Array.prototype.slice.call(arguments, sum.length);  
  console.log(args.length); // 傳進(jìn)來(lái)的參數(shù)的個(gè)數(shù) 3
  let s = a + b;
  args.forEach(i => {s += i});
 return s;
}
sum(1, 2, 3, 4, 5 );

而使用剩余操作符，則不需要轉(zhuǎn)化，直接使用，更加方便。

剩余操作符與解構(gòu)賦值

我們知道，ES6 允許按照一定模式，從數(shù)組和對(duì)象中提取值，對(duì)變量進(jìn)行賦值，這被稱為解構(gòu)（Destructuring）。 比如如下代碼：

let array = [1,2,3]
let [a,b,c] = array; // a 1, b 2, c 3

再比如如下代碼：

let obj = {a:1,b:2,c:3}
let {a,b,c} = obj; // a 1, b 2, c 3

在解構(gòu)賦值時(shí)，可以使用剩余操作符。剩余操作符所操作的變量會(huì)匹配在解構(gòu)賦值中所有其他變量未匹配到的屬性。
比如如下代碼，others會(huì)匹配到first和second對(duì)于屬性的余下的屬性：

const { first, second, ...others } = {
  first: 1,
  second: 2,
  third: 3,
  fourth: 4,
  fifth: 5
}

first // 1
second // 2
others // { third: 3, fourth: 4, fifth: 5 }

對(duì)象中余下的屬性值被打包起來(lái)構(gòu)造一個(gè)新的對(duì)象賦值給了others。

數(shù)組也可以通過(guò)剩余操作符，把剩余的元素打包成一個(gè)新的數(shù)組賦值給剩余屬性，代碼如下：

let array = [1,2,3,4,5];
let [a,b,...c] = array;  // a 1,b 2, c [3,4,5]
剩余操作符和展開操作符

某種程度上，可以任務(wù)剩余操作符是展開操作符的相反操作。展開操作符會(huì)”展開“數(shù)組編程多個(gè)元素，剩余操作符會(huì)把多個(gè)元素壓縮成一個(gè)單一的元素。

歡迎關(guān)注公眾號(hào)“ITman彪叔”。彪叔，擁有10多年開發(fā)經(jīng)驗(yàn)，現(xiàn)任公司系統(tǒng)架構(gòu)師、技術(shù)總監(jiān)、技術(shù)培訓(xùn)師、職業(yè)規(guī)劃師。熟悉Java、JavaScript。在計(jì)算機(jī)圖形學(xué)、WebGL、前端可視化方面有深入研究。對(duì)程序員思維能力訓(xùn)練和培訓(xùn)、程序員職業(yè)規(guī)劃和程序員理財(cái)投資有濃厚興趣。

文章版權(quán)歸作者所有，未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請(qǐng)注明本文地址：http://www.ezyhdfw.cn/yun/105808.html

相關(guān)文章

  • JavaScript 編程精解 中文第三版 十二、項(xiàng)目：編程語(yǔ)言

    摘要：來(lái)源編程精解中文第三版翻譯項(xiàng)目原文譯者飛龍協(xié)議自豪地采用谷歌翻譯部分參考了編程精解第版確定編程語(yǔ)言中的表達(dá)式含義的求值器只是另一個(gè)程序。若文本不是一個(gè)合法程序，解析器應(yīng)該指出錯(cuò)誤。 來(lái)源：ApacheCN『JavaScript 編程精解 中文第三版』翻譯項(xiàng)目原文：Project: A Programming Language 譯者：飛龍 協(xié)議：CC BY-NC-SA 4.0 自豪地采用...

    Near_Li 評(píng)論0 收藏0

  • 深入理解 ES6 的解構(gòu)賦值

    摘要：在可遍歷的量中使用數(shù)組模型數(shù)組解構(gòu)使用一個(gè)迭代器來(lái)獲取數(shù)據(jù)源中的元素。所以，數(shù)組解構(gòu)能夠在上工作的迭代器總是按照元素插入的順序?qū)⒃胤祷?，所以上述的解?gòu)返回的結(jié)果總是相同的。 解構(gòu)賦值（destructuring assignment）語(yǔ)法是一個(gè)Javascript表達(dá)式，這種語(yǔ)法能夠更方便的提取出 Object 或者 Array 中的數(shù)據(jù)。這種語(yǔ)法可以在接受提取的數(shù)據(jù)的地方使用，比如...

    only_do 評(píng)論0 收藏0

  • ES6—擴(kuò)展運(yùn)算符和rest運(yùn)算符（6）

    摘要：擴(kuò)展運(yùn)算符簡(jiǎn)介擴(kuò)展運(yùn)算符是三個(gè)點(diǎn)，可以將一個(gè)數(shù)組轉(zhuǎn)為用逗號(hào)分隔的參數(shù)序列。在實(shí)際項(xiàng)目中靈活應(yīng)用擴(kuò)展運(yùn)算符運(yùn)算符，能寫出更精簡(jiǎn)易讀性高的代碼。 1、擴(kuò)展運(yùn)算符簡(jiǎn)介 擴(kuò)展運(yùn)算符（ spread ）是三個(gè)點(diǎn)（...），可以將一個(gè)數(shù)組轉(zhuǎn)為用逗號(hào)分隔的參數(shù)序列。 說(shuō)的通俗易懂點(diǎn)，有點(diǎn)像化骨綿掌，把一個(gè)大元素給打散成一個(gè)個(gè)單獨(dú)的小元素。 showImg(https://segmentfault.c...

    Amio 評(píng)論0 收藏0

  • ES6 變量聲明與賦值：值傳遞、淺拷貝與深拷貝詳解

    摘要：變量聲明與賦值值傳遞淺拷貝與深拷貝詳解歸納于筆者的現(xiàn)代開發(fā)語(yǔ)法基礎(chǔ)與實(shí)踐技巧系列文章。變量聲明在中，基本的變量聲明可以用方式允許省略，直接對(duì)未聲明的變量賦值。按值傳遞中函數(shù)的形參是被調(diào)用時(shí)所傳實(shí)參的副本。 ES6 變量聲明與賦值：值傳遞、淺拷貝與深拷貝詳解歸納于筆者的現(xiàn)代 JavaScript 開發(fā)：語(yǔ)法基礎(chǔ)與實(shí)踐技巧系列文章。本文首先介紹 ES6 中常用的三種變量聲明方式，然后討論了...

    snowLu 評(píng)論0 收藏0

  • ES6的常用語(yǔ)法

    摘要：和命令和類似于中的的使用都是用來(lái)聲明變量的，只是都存在各自的特殊用法。解構(gòu)數(shù)組和對(duì)象是中最常用也是最重要表示形式。實(shí)例生成以后，可以用方法分別指定狀態(tài)和狀態(tài)的回調(diào)函數(shù)。這個(gè)迭代器對(duì)象擁有一個(gè)叫做的方法來(lái)幫助你重啟函數(shù)并得到下一個(gè)值。 let和const命令 let和const類似于javascript中的var的使用,都是用來(lái)聲明變量的，只是都存在各自的特殊用法。 在javascrip...

    gougoujiang 評(píng)論0 收藏0

發(fā)表評(píng)論

0條評(píng)論

最新活動(dòng)
閱讀需要支付1元查看
<