JavaScript 中“...” 的多種用途及代碼實(shí)例
一、擴(kuò)展運(yùn)算符(Spread Operator)
用于數(shù)組:可以將一個數(shù)組展開為另一個數(shù)組的元素。例如:
const arr1 = [1, 2, 3]; const arr2 = [4, 5, 6]; const combinedArray = [...arr1,...arr2]; console.log(combinedArray); // [1, 2, 3, 4, 5, 6]
可以在函數(shù)調(diào)用中展開數(shù)組參數(shù),使得函數(shù)可以接受任意數(shù)量的參數(shù)。例如:
function sum(a, b, c) { return a + b + c; } const numbers = [1, 2, 3]; console.log(sum(...numbers)); // 6
用于對象:可以復(fù)制對象的屬性到另一個對象。例如:
const obj1 = { a: 1, b: 2 }; const obj2 = { c: 3,...obj1 }; console.log(obj2); // { c: 3, a: 1, b: 2 }
二、剩余參數(shù)(Rest Parameters)
在函數(shù)定義中,“...” 可以用來收集多個參數(shù)到一個數(shù)組中。例如:
function addNumbers(...numbers) { return numbers.reduce((sum, num) => sum + num, 0); } console.log(addNumbers(1, 2, 3, 4, 5)); // 15
在這個函數(shù)中,“numbers” 是一個包含所有傳入?yún)?shù)的數(shù)組??梢允褂脭?shù)組的方法如 “reduce” 來處理這些參數(shù)。
三、實(shí)際代碼實(shí)例
this.data.orderList .filter(item => item.quantity > 0) .map(item => ({ ...item, ticket_des: '' // 直接將ticket_des設(shè)置為空字符串 }));
在這段 JavaScript 代碼中,...item
是擴(kuò)展運(yùn)算符的用法。
這里是在對數(shù)組進(jìn)行map
操作時,將原數(shù)組中的每個元素(這里是對象item
)進(jìn)行擴(kuò)展,并添加一個新的屬性ticket_des
且設(shè)置為空字符串,從而創(chuàng)建一個新的對象。
這種用法可以避免手動逐個復(fù)制對象的已有屬性,使得代碼更加簡潔和易于維護(hù)。例如,如果原對象item
有屬性a
、b
、c
,使用...item
后,新對象會自動包含這些屬性,然后再加上新設(shè)置的ticket_des
屬性。
到此這篇關(guān)于JavaScript 中“...” 的多種用途的文章就介紹到這了,更多相關(guān)js “...” 的多種用途內(nèi)容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家!
相關(guān)文章
JSON.parse處理非標(biāo)準(zhǔn)Json數(shù)據(jù)出錯的解決
這篇文章主要介紹了JSON.parse處理非標(biāo)準(zhǔn)Json數(shù)據(jù)出錯的解決,具有很好的參考價值,希望對大家有所幫助。如有錯誤或未考慮完全的地方,望不吝賜教2022-09-09微信小程序如何實(shí)現(xiàn)radio單選框單擊打勾和取消
這篇文章主要介紹了微信小程序如何實(shí)現(xiàn)radio單選框單擊打勾和取消,文中通過示例代碼介紹的非常詳細(xì),對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值,需要的朋友可以參考下2020-01-01如何用js實(shí)現(xiàn)鼠標(biāo)向上滾動時浮動導(dǎo)航
今天給大家介紹一下使用JavaScript判斷鼠標(biāo)滑輪是不是向上滾動,當(dāng)向上滾動的時候,導(dǎo)航條浮動在頂部位置。示例代碼如下。2016-07-07HTML Table 空白單元格補(bǔ)全的簡單實(shí)現(xiàn)
下面小編就為大家?guī)硪黄狧TML Table 空白單元格補(bǔ)全的簡單實(shí)現(xiàn)。小編覺得挺不錯的,現(xiàn)在就分享給大家,也給大家做個參考。一起跟隨小編過來看看吧2016-10-10