es6常用陣列操作及技巧彙總

2021-08-20 03:55:44 字數 3173 閱讀 5451

const array = [1,2].concat(['a', 'b'], ['name']);

// [1, 2, "a", "b", "name"]

// callback定義如下: element:當前元素值;index:當前元素下標; array:當前陣列

function callback(element, index, array)

// callback定義如下,三個引數: element:當前元素值;index:當前元素下標; array:當前陣列

function callback(element, index, array)

const filtered = [1, 2, 3].filter(element => element > 1);

// filtered: [2, 3];

const finded = [1, 2, 3].find(element => element > 1);

// finded: 2

const findindex = [1, 2, 3].findindex(element => element > 1);

// findindex: 1

[1, 2, 3].includes(2, 2);

// false

[2, 9, 7, 8, 9].indexof(9);

// 1

[1, 2, 3]

.join(';');

// "1;2;3"

const maped = [, ].map(item => item.name + 'c');

// maped: ['aac', 'bbc'];

[1, 2, 3].pop();

// 3

const shifted = ['one', 'two', 'three'].shift();

// shifted: 'one'

const arr = [1, 2, 3];

const length = arr.push(4, 5);

// arr: [1, 2, 3, 4, 5]; length: 5

const vegetables = ['parsnip', 'potato'];

const morevegs = ['celery', 'beetroot'];

// 將第二個陣列融合進第乙個陣列

// 相當於 vegetables.push('celery', 'beetroot');

或者// vegetables: ['parsnip', 'potato', 'celery', 'beetroot']

const total = [0, 1, 2, 3].reduce((sum, value) => , 0);

// total is 6

const flattened = [[0, 1], [2, 3], [4, 5]].reduce((a, b) => , );

// flattened is [0, 1, 2, 3, 4, 5]

// initialvalue累加器初始值, callback函式定義:

function

callback(accumulator, currentvalue, currentindex, array)

accumulator代表累加器的值,初始化時,如果initialvalue有值,則accumulator初始化的值為initialvalue,整個迴圈從第乙個元素開始;initialvalue無值,則accumulator初始化的

值為陣列第乙個元素的值,currentvalue為陣列第二個元素的值,整個迴圈從第二個元素開始。initialvalue的資料型別可以是任意型別,不需要跟原陣列內的元素值型別一致。

const newarray = [, , ].reduce((arr, element) =>

return arr; // 必須有return,因為return的返回值會被賦給新的累加器,否則累加器的值會為undefined。

}, );

// newarray is ["bb", "cc"];

上面**的同等寫法:

const newarray = [, , ].filter(element => element.age >= 2).map(item => item.name);

// newarray is ["bb", "cc"];

對於reduce的特殊用法,其實類似於省略了乙個變數初始化步驟,然後通過每次的callback的返回修改該變數,最後返回最終變數值的過程,類似於乙個變數宣告 + 乙個foreach執行過程。

const newarray = ;

[, , ].foreach(item =>

});

['one', 'two', 'three'].reverse();

// ['three', 'two', 'one'],原陣列被翻轉

const newarray = ['zero', 'one', 'two', 'three'].slice(1, 3);

// newarray: ['one', 'two'];

[2, 5, 8, 1, 4].some(item => item > 6);

// true

[1, 8, 5].sort((a, b) => );

// [1, 5, 8]

const myfish = ['angel', 'clown', 'mandarin', 'sturgeon'];

const deleted = myfish.splice(2, 0, 'drum'); // 在索引為2的位置插入'drum'

// myfish 變為 ["angel", "clown", "drum", "mandarin", "sturgeon"],deleted為

ES6 陣列操作

1 push 尾端插入,返回陣列長度let arr 1,hello true console.log arr.push 22 4 console.log arr,arr 1,hello true,22 console.log arr.push false,123 6 console.log arr,...

ES6陣列小技巧

交換變數 a,b b,a o.a,o.b o.b,o.a 生成剩餘陣列 const a,rest asdf a a rest s d f const arr 1,2,3 const arrclone arr 物件也可以這樣淺拷貝 const obj const objclone 淺拷貝 拷貝的值改變...

ES6陣列基本操作

es6合併陣列 方法1 es6中 let arr4 arr1,arr2,arr3 方法2 es5中 arr1.concat arr2,arr3 注意 這兩種方法都是淺拷貝,使用的時候需要注意 方法3ary1.push ary2 陣列的常用方法 例項方法 find let ary let target...