陣列都有哪些方法
forEach
forEach()
會遍歷陣列, 迴圈體內沒有返回值,forEach()
迴圈不會改變原來陣列的內容,forEach()
有三個引數, 第一個引數是當前元素, 第二個引數是當前元素的索引, 第三個引數是當前元素所屬的陣列.
let array = [1, 2, 3, 4];
array.forEach((item, index, arr) => {
console.log(item);
});
forEach()
的用法大概就是這樣的, 不過不知道各位發沒發現一個問題,forEach()
不能跳出迴圈, 我說的跳出迴圈是跳出整個迴圈而不是跳出當前的迴圈, 口說無憑, 直接上程式碼.
let array = [1, 2, 3, 4, 5];
array.forEach((item) => {
if (item > 2) {
return;
}
console.log(item);
});
各位, 上面的程式碼會輸出啥呢?
答案是: 1 2
這時候有人就會說了, 這不是跳出迴圈了嗎, 其實並不是, 它仍然把陣列挨個遍歷了一遍, 把輸出換個位置我們就會發現了.
let array = [1, 2, 3, 4, 5];
array.forEach((item) => {
console.log(item);
if (item > 2) {
return;
}
});
這回怎麼樣, 輸出了 1 2 3 4 5吧.
看過了上面兩段程式碼之後, 不難發現, 在forEach()
迴圈體裡寫return, 只是能跳出當前迴圈去執行下一次迴圈,並不能跳出整個迴圈.
再說說什麼叫forEach()
迴圈沒有返回值, 這個問題在看過接下來的map迴圈之後就會明白了.
map
map()
的主要作用, 其實是建立一個新的陣列,map()
的引數和forEach()
是一樣的, 這裡就不在多說了, 直接上例子.
let array = [1, 2, 3, 4 ,5];
let temp = array.map((item, index, arr) => {
return item + 1;
});
console.log(temp);
console.log(array);
猜猜輸出的temp
和arr
的值都是什麼
temp: [2, 3 ,4, 5, 6]
arr: [1, 2, 3, 4, 5]
各位, 到這裡應該明白map()
和forEach()
有什麼區別了吧, 使用map()遍歷陣列, 可以返回一個新陣列, 並且不會改變原數組裡的內容.
當然了,map()
也可以這麼用, 直接把數組裡的元素都轉成字串.
let temp = array.map(String);
filter
接下來再說說filter()
,filter()
引數和forEach()
也是一樣的,filter()
主要是過濾的, 用來過濾陣列中不滿足條件的元素, 把滿足條件的元素放到新的數組裡, 並且不會改變原陣列.
怎麼用呢, 直接上程式碼.
let array = [1, 2, 3, 4, 5];
let temp = array.filter((item, index, arr) => {
return item > 3;
});
console.log(temp);
console.log(array);
會輸出什麼呢,temp
是4, 5,array
沒有變化, 清晰明瞭吧, 是不是比用for
迴圈硬寫方便多了.
every
every()
我就不解釋入參了, 都一樣的, 主要說說every()
的作用, 它會遍歷陣列, 在迴圈體內寫條件, 如果每一項都是true
, 就會返回true
, 只要有一個是false
, 就會返回false
, 下面看看例項程式碼.
let array = [1, 2, 3, 4, 5];
let bo = array.every((item, index, arr) => {
return item > 2;
});
console.log(bo);
這個輸出不用我說了吧, 肯定是false
啊, 不用再解釋了吧.
some
some()
又是做什麼的吶, 同樣, 遍歷陣列的每一項, 然後根據迴圈體內的條件去判斷, 只要有一個是true
, 就會停止迴圈.
let array = [1, 2, 3, 4, 5];
array.some((item, index, arr) => {
console.log(item);
return item > 3;
});
根據輸出的item, 我們可以知道一共迴圈了多少次.
reduce
reduce()
, 官方說明: 接收一個函式作為累加器, 陣列中每個值(從左到右)開始縮減, 最終為一個值. 看完這句話, 心裡莫名的想說一句 臥槽, '這什麼玩意'. 其實說白了,reduce()
接收的那個函式就是回撥函式, 回撥函式呼叫數組裡的每一個元素, 直到迴圈結束.reduce()
跟其他幾個方法不一樣, 它有4個引數, 按順序分別是 上一次的值, 當前的值, 當前值的索引, 陣列. 引數介紹完畢, 直接看例子.
假如, 有一個數組, 裡面的元素都是數字, 現在要計算數字的和, 正常情況就直接迴圈陣列, 然後弄箇中間變數挨個加了吧, 但是用了reduce()
就省事兒多了
let array = [1, 2, 3, 4, 5];
let total = array.reduce((a, b) => {
return a + b;
});
console.log(total); // 15
查詢:
arr.indexOf('楊',2) 第二個引數表示從哪裡開始,返回下標,找不到返回-1
arr.lastIndexOf(‘楊’,2)第二個引數表上從哪裡開始返回下標找不到返回-1
追加:
arr.push()往後追加並返回新陣列長度
arr.unshift()往前追加並返回新陣列長度
刪除:
arr.shift()刪除第一個並返回刪除的那個值
arr.pop()刪除最後一個並返回刪除的值
排序:
arr.sort(function(a,b)){return a-b} 排序判斷長度
arr.reverse()陣列翻轉
轉字串:
arr.join(連線符)陣列轉字串預設以逗號連結
新增刪除替換:
arr.splice(從哪裡開始,刪除幾個,新增的東西)刪除時返回刪除的元素組成的新陣列
連線:
arr.concat(1,2,3)陣列連線返回新陣列
陣列擷取
arr.slice(1,2)返回截圖的陣列左包右不包
split(分割符)並轉成陣列
arguments的作用
是js中的一個內建物件,有長度有下標,接受所有引數有屬於偽類陣列