Array --JavaScript內置物件
描述
可以用一個變數存盤多種資料型別的Array物件,Array不是關聯陣列,不能使用字串作為索引訪問陣列元素,需要使用非負整數的下標訪問陣列中的元素,
和物件的某些特征很相似,例如:屬性訪問器一半相似,衍生出的使用 .call() 或者 .apply() 將陣列方法賦予物件,
較為常用的幾個方法
有的是通過改變原陣列,又或是回傳一個新陣列的形式,方便記憶可以劃分為:增刪改查,排序,遍歷,資料和資料集功能,
陳舊的:
此區域為增刪區域
\1. push() - 在陣列末尾添加一個或多個元素,并回傳新的長度,
\2. pop() - 洗掉并回傳陣列的最后一個元素,
\3. shift() - 洗掉并回傳陣列的第一個元素,
\4. unshift() - 在陣列的開頭添加一個或多個元素,并回傳新的長度,
此區域為修改區域(合并)
\5. splice() - 通過洗掉或替換現有元素或者原地添加新的元素來修改陣列,并以陣列形式回傳被修改的內容,
\6. slice() - 回傳一個新的陣列物件,這一物件是一個由 begin 和 end 決定的原陣列的淺拷貝,
\7. concat() - 回傳一個由當前陣列和其它若干個陣列或者若干個非陣列值組合而成的新陣列,
\8. join() - 將陣列(或一個類陣列物件)的所有元素連接成一個字串并回傳這個字串,
此區域為排序查找
\9. reverse() - 顛倒陣列中元素的順序,
\10. sort() - 對陣列的元素進行排序,
\11. indexOf() - 回傳在陣列中可以找到一個給定元素的第一個索引,如果不存在,則回傳-1,
\12. lastIndexOf() - 回傳一個指定的元素在陣列中最后出現的位置,如果不存在,則回傳-1,
此區域為遍歷
\13. forEach() - 對陣列的每個元素執行一次提供的函式,
\14. map() - 創建一個新陣列,其結果是該陣列中的每個元素都呼叫一個提供的函式后回傳的結果,
\15. filter() - 創建一個新陣列, 其包含通過所提供函式實作的測驗的所有元素,
\16. reduce() - 對陣列中的所有元素執行一個由您提供的reducer函式(升序執行),將其結果匯總
新穎的:
此區域為資料和資料集功能
at() - 通過下標訪問陣列元素,區別于直接用方括號訪問,可以使用負數訪問,
flat() - 將陣列扁平化,深度為1,通過傳遞一個數字引數修改深度,
flatMap() - flat() 和 map() 的結合,先扁平(深度1)再遍歷,
Array.from() - 類似陣列或可迭代物件創建一個新的,淺拷貝的陣列實體,例如字串,map和set
Array.of() - 創建一個陣列,區別于直接使用 Array() 創建陣列,括號內的內容是陣列的實際資料,假如你想創建一個長度為7的陣列應該使用 Array(7) 而不是 Array.of(7) ,因為后者會創建一個[7]的陣列,
entries() - 回傳一個Array迭代器物件,
Array.length
array.length 改變length屬性會發生的情況,假如length小于陣列最大的下標,會將length之后的元素清除,
陣列的長度跟許多方法是掛鉤的,例如 entries() 方法,會通過獲取陣列長度訪問每個整數索引,可以簡單的通過 .call() 方法驗證:
const arrayLike = {
length: 3,
0: "a",
1: "b",
2: "c",
};
for (const entry of Array.prototype.entries.call(arrayLike)) {
console.log(entry);
}
// [ 0, 'a' ]
// [ 1, 'b' ]
// [ 2, 'c' ]
可以以此倆想到樓下的通用陣列方法,只訪問 length 屬性和索引訪問陣列元素,
空槽和陣列方法
可以使用 Array(n) 創建一個長度為n的空槽陣列,
對于空槽而言,許多陣列方法都會照顧一下,例如 concat() 方法就會將空槽省去,亦或是將空槽視為 undefined 例如你能想到的 values()
陣列遍歷
forEach() 和 for...in 兩者在特殊情況下的不同效果
for...in可能會迭代物件的原型鏈上的屬性,而array.forEach不會迭代陣列的原型鏈上的屬性,此外,array.forEach可以使用break和continue陳述句來控制迭代,而for...in不能,
const arr1 = [1, 2, 3];
arr1.name = "shit"
arr1.forEach((i) => {
console.log(i);
}); // 1, 2, 3
for (const i in arr1) {
console.log(arr1[i]);
}; // 1, 2, 3, shit
陣列復制
深拷貝,淺拷貝 主要比較物件的參考是否一致,例如物件和陣列這類資料型別可以想象成保存的是指向資料的地址,淺拷貝的本質是兩個陣列或者物件中的資料指向了同一個目標,而深拷貝則是兩個完全不同的資料指向,
自帶的一個淺拷貝 slice() ,
簡單的完成一個深拷貝可以使用 JSON 提供的 stringify 和 parse 方法,通過轉成 JSON 物件再轉回陣列的方式,
通用陣列方法
指陣列的不訪問陣列物件的任何內部資料,只訪問 length 屬性和索引訪問陣列元素,可以使用call方法在類陣列物件上呼叫,
const arrayLike = {
0: "a",
1: "b",
length: 2,
};
console.log(Array.prototype.join.call(arrayLike, "+")); // 'a+b'
由此來看,陣列和物件的相似性還是蠻大的,又或者是較簡單的資料形式,提供的簡單方法能夠讓開發者更便捷的對資料集進行操作,
轉載請註明出處,本文鏈接:https://www.uj5u.com/qiye/548524.html
標籤:其他
上一篇:前端設計模式——享元模式
