自拍偷在线精品自拍偷,亚洲欧美中文日韩v在线观看不卡

Js ES6擴(kuò)展運(yùn)算符(spread)和剩余運(yùn)算符(rest)

開(kāi)發(fā)
Spread 和 Rest 是 ES6 Javascript 提供的兩個(gè)功能,分別主要用于解構(gòu)和函數(shù)參數(shù)處理。Spread 從可迭代對(duì)象(如數(shù)組、字符串或?qū)ο螅┲蝎@取元素并將它們分散到各個(gè)部分。這就像將一副紙牌鋪在桌子上一樣。

Js運(yùn)算符...

Spread 和 Rest 是 ES6 Javascript 提供的兩個(gè)功能,分別主要用于解構(gòu)和函數(shù)參數(shù)處理。Spread 從可迭代對(duì)象(如數(shù)組、字符串或?qū)ο螅┲蝎@取元素并將它們分散到各個(gè)部分。這就像將一副紙牌鋪在桌子上一樣。

另一方面,Rest 收集可迭代對(duì)象的剩余元素,從而更容易處理可變參數(shù)或元素。這就像游戲結(jié)束后將分散的紙牌重新聚集在一起。讓我們?cè)敿?xì)了解它們。

了解擴(kuò)展運(yùn)算符

在上圖中,你看到了這四只可愛(ài)的貓——生日貓、學(xué)習(xí)貓、睡覺(jué)貓和工作貓?,F(xiàn)在,將它們想象成聚集成一個(gè)陣列。使用 Spread Operator — 您可以將這些貓分散成單獨(dú)的貓。

這是擴(kuò)展運(yùn)算符的簡(jiǎn)單代碼示例

圖片

JavaScript 中的展開(kāi)運(yùn)算符將可迭代對(duì)象(如數(shù)組、字符串或?qū)ο螅┑脑卣归_(kāi)或解包為可在新數(shù)組/對(duì)象中使用的單個(gè)元素。

讓我們看看展開(kāi)運(yùn)算符的用例。

1. 克隆陣列

在上面的代碼中,克隆數(shù)組使用擴(kuò)展運(yùn)算符復(fù)制原始數(shù)組。現(xiàn)在,您有兩個(gè)相同的數(shù)組。

2. 函數(shù)參數(shù)列表

在上面的代碼中,...joinedArray參數(shù)允許您將任意數(shù)量的具有各種屬性的附加詳細(xì)信息傳遞給函數(shù)。

3. 數(shù)組文字

在上面的代碼中,擴(kuò)展運(yùn)算符用于allBooks通過(guò)組合classics數(shù)組中的元素、modernBooks使用擴(kuò)展運(yùn)算符的數(shù)組并添加 book 來(lái)創(chuàng)建一個(gè)新數(shù)組。

4. 對(duì)象文字

在上面的代碼中,擴(kuò)展運(yùn)算符updatedBook通過(guò)添加新的鍵值對(duì)(genre和year)來(lái)創(chuàng)建一個(gè)對(duì)象,同時(shí)保留原始對(duì)象的現(xiàn)有屬性book。

5. 合并數(shù)組

在上面的代碼中,擴(kuò)展運(yùn)算符 ( ...) 用于創(chuàng)建一個(gè)名為 的新數(shù)組mergedArray。array1它本質(zhì)上是從和中獲取所有元素array2,并將它們放入提供給您的新數(shù)組中,即 mergedArray。

擴(kuò)展運(yùn)算符就像數(shù)組的復(fù)印機(jī)。它有助于制作精確的副本,因此,如果您更改一個(gè)副本,另一個(gè)副本將保持不變。

了解 Rest 運(yùn)算符

在上圖中,你可以再次看到這四只可愛(ài)的貓——生日貓、學(xué)習(xí)貓、睡覺(jué)貓和工作貓,但這一次,它們作為單獨(dú)的貓分散開(kāi)來(lái)。使用 Rest Operator,我們可以將這些貓聚集并捆綁成一個(gè)舒適的貓群。

這是擴(kuò)展運(yùn)算符的簡(jiǎn)單代碼示例

JavaScript 中的剩余運(yùn)算符將可迭代對(duì)象(如數(shù)組、字符串或?qū)ο螅┑氖S嘣鼐奂蚴占絾蝹€(gè)變量中。

現(xiàn)在,讓我們探討一下 Rest 運(yùn)算符的用例。

1. 收集函數(shù)參數(shù)

在上面的代碼中,該calculateTotal函數(shù)使用帶有參數(shù)值的剩余運(yùn)算符...values來(lái)接受并將任意數(shù)量的值存儲(chǔ)在數(shù)組中。然后它使用循環(huán)來(lái)計(jì)算總和。

Rest 運(yùn)算符簡(jiǎn)化了函數(shù)中變量參數(shù)的處理,使您的代碼更干凈、更靈活。

2. 解構(gòu)數(shù)組

在上面的代碼中,...rest參數(shù)將剩余元素收集到一個(gè)名為 的數(shù)組中,rest 從索引 2 開(kāi)始。

在擴(kuò)展和剩余之間選擇:

Spread 和 Rest 之間的選擇取決于用例。

使用 Spread 來(lái)傳播可迭代對(duì)象:

  • 克隆數(shù)組、合并數(shù)組和復(fù)制對(duì)象。
  • 當(dāng)你想毫不費(fèi)力地傳播可迭代的內(nèi)容時(shí)。

使用 Rest 來(lái)收集可迭代對(duì)象:

  • 處理可變函數(shù)參數(shù)和解構(gòu)數(shù)組。
  • 當(dāng)您需要收集和管理數(shù)量可變的元素時(shí)。

綜上所述:

Spread 和 Rest 運(yùn)算符是 JavaScript 的強(qiáng)大功能,每個(gè)運(yùn)算符都具有獨(dú)特的功能。

了解何時(shí)傳播和聚集可確保流暢高效的編碼體驗(yàn)。

因此,無(wú)論您是使用 Spread 運(yùn)算符克隆數(shù)組,還是使用 Rest 運(yùn)算符處理變量參數(shù),JavaScript 中的這些功能都會(huì)使您的代碼變得簡(jiǎn)單且靈活。

責(zé)任編輯:華軒 來(lái)源: web前端開(kāi)發(fā)
相關(guān)推薦

2025-02-24 11:16:20

2009-08-11 15:51:08

C#運(yùn)算符算術(shù)運(yùn)算符

2009-08-12 15:20:18

C#賦值運(yùn)算符復(fù)合賦值運(yùn)算符

2009-06-21 13:48:05

ShellLinux運(yùn)算符

2009-08-12 15:02:49

C#賦值運(yùn)算符簡(jiǎn)單賦值運(yùn)算符

2023-04-10 08:58:13

C#關(guān)系運(yùn)算符

2017-05-11 16:38:07

javascript邏輯運(yùn)算符

2013-08-15 16:48:39

.Net基礎(chǔ)

2021-12-15 10:25:57

C++運(yùn)算符重載

2009-08-12 09:30:10

C#??運(yùn)算符

2016-10-14 14:04:34

JAVA語(yǔ)法main

2009-11-18 09:02:55

PHP運(yùn)算符

2020-06-18 10:26:43

JavaScript開(kāi)發(fā)技術(shù)

2009-11-26 11:12:07

PHP運(yùn)算符

2009-08-12 14:49:33

C#移位運(yùn)算符

2009-07-09 17:40:26

Java運(yùn)算符

2009-12-08 10:00:36

PHP比較運(yùn)算符

2009-08-12 10:47:03

C#運(yùn)算符重載

2025-02-07 00:12:34

C#編程as

2020-12-10 08:11:52

typeof instanceofJS
點(diǎn)贊
收藏

51CTO技術(shù)棧公眾號(hào)