es6展開運算子

2021-08-26 15:22:01 字數 1004 閱讀 9271

展開運算子

在es6中用...來表示展開運算子，它可以將陣列方法或者物件進行展開。先來看乙個例子它是如何使用的。

const arr1 = [1, 2, 3];


const arr2 = [...arr1, 10, 20, 30];


這樣，arr2 就變成了[1, 2, 3, 10, 20, 30];
arr1中的值完全轉殖到了arr2中（arr1改變arr2中還是最初的值）。當然，展開物件資料也是可以得到類似的結果

const obj1 = 


const obj2 = 


結果類似於 const obj2 = object.assign({}, obj1, )
展開運算子還常常運用在解析結構之中，例如我們在raect封裝元件的時候常常不確定props到底還有多少資料會傳進來，就會利用展開運算子來處理剩餘的資料。

這種方式在react中十分常用


const props = 


props 設定了基礎資料，後續資料根據展開運算子植入


const  = props;


console.log(others)


然後再利用暫開運算子傳遞給下乙個元素，再以後封裝react元件時會大量使用到這種方式，正在學習react的同學一定要搞懂這種使用方式
展開運算子還用在函式的引數中，來表示函式的不定參。只有放在最後才能作為函式的不定參，否則會報錯。

// 所有引數之和


const add = (a, b, ...more) => 


console.log(add(1, 23, 1, 2, 3, 4, 5)) // 39
展開運算子的運用可以大大提高我們的**效率，但是在剛開始使用的時候比較繞腦，掌握好了用起來還是非常爽的，記住這些使用場景，平時在用的時候可以刻意多運用就行了。

es6 展開運算子

展開運算子不能用在物件當中，只能在可遍歷物件中使用 iterables iterables的實現是依靠 symbol.iterator 函式，目前只有array,set,string內建 symbol.iterator 方法，不過es7草案中已經加入了物件展開運算子。可用展開運算子展開陣列，解構陣列...

es6 展開運算子

好記性不如爛筆頭，在學習的過程中，越來越明白這句話的含義 es6的展開運算子使用三個點來表示 使用展開運算子的前提 物件具有 iterator 遍歷器介面 比如陣列，怎麼判斷乙個物件是否具有iterator 遍歷器介面呢，我們檢視物件是否有symbol symbol.iterator 屬性就可以了 ...

ES6 展開運算子

es5 的寫法 function f x,y,z var args 0,1,2 es6 的寫法 function f x,y,z var args 0,1,2 f args 其實就是把陣列的每個資料拆開然後放進去 let arr autumn wscats 析構陣列 let y autumn,y a...