詳解JS數(shù)組方法
一、會修改原數(shù)組
1.push():
(在數(shù)組結(jié)尾處)向數(shù)組添加一個新的元素
push() 方法返回新數(shù)組的長度
var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.push("Kiwi");
2.pop():
方法從數(shù)組中刪除最后一個元素
可以接收pop()的返回值,是被彈出的值"Mango"
var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.push("Kiwi");
3.shift():
刪除首個數(shù)組元素
可以接收刪除的值
var fruits = ["Banana", "Orange", "Apple", "Mango"]; fruits.shift();
4.unshift():
(在開頭)向數(shù)組添加新元素
返回新數(shù)組的長度。
var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.unshift("Lemon");
5.splice():
用于向數(shù)組添加新項
第一個參數(shù)(2)定義了應(yīng)添加新元素的位置(拼接)。
第二個參數(shù)(0)定義應(yīng)刪除多少元素。
其余參數(shù)(“Lemon”,“Kiwi”)定義要添加的新元素。
splice() 方法返回一個包含已刪除項的數(shù)組
也可以通過設(shè)置參數(shù)來刪除數(shù)組中元素
var fruits = ["Banana", "Orange", "Apple", "Mango"]; fruits.splice(2, 0, "Lemon", "Kiwi"); //["Banana","Orange","Lemon","Kiwi","Apple","Mango"] var fruits = ["Banana", "Orange", "Apple", "Mango"]; fruits.splice(0, 1); //["Orange", "Apple", "Mango"]
6.sort():
以字母順序?qū)?shù)組進(jìn)行排序
如果是對數(shù)字進(jìn)行排序,則需要注意。 "25" 大于 "100",因為 "2" 大于 "1"。我們通過一個比值函數(shù)來修正此問題。
sort()也可以通過修改比較函數(shù)來排序?qū)ο髷?shù)組
var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.sort();
var points = [40, 100, 1, 5, 25, 10];
points.sort(function(a, b){return a - b});//升序
points.sort(function(a, b){return b - a});//降序
points.sort((a, b)=>{return b - a});//箭頭函數(shù)
var cars = [
{type:"Volvo", year:2016},
{type:"Saab", year:2001},
{type:"BMW", year:2010}
]
cars.sort(function(a, b){return a.year - b.year});//比較年份(數(shù)字)
cars.sort(function(a, b){//比較類型(字符串)
var x = a.type.toLowerCase();
var y = b.type.toLowerCase();
if (x < y) {return -1;}
if (x > y) {return 1;}
return 0;
});
7.reverse():
反轉(zhuǎn)數(shù)組中的元素
var fruits = ["Banana", "Orange", "Apple", "Mango"]; fruits.reverse();
二、不修改原數(shù)組
1.toString():
把數(shù)組轉(zhuǎn)換為數(shù)組值(逗號分隔)的字符串。
var fruits = ["Banana", "Orange", "Apple", "Mango"] console.log(fruits.toString()) //Banana,Orange,Apple,Mango
2.join():
可將所有數(shù)組元素結(jié)合為一個字符串。
它的行為類似 toString(),但是還可以規(guī)定分隔符
var fruits = ["Banana", "Orange", "Apple", "Mango"]
console.log(fruits.join(" * "))
//Banana * Orange * Apple * Mango
3.concat():
通過合并(連接)現(xiàn)有數(shù)組來創(chuàng)建一個新數(shù)組??梢赃B接多個
var myGirls = ["Cecilie", "Lone"]; var myBoys = ["Emil", "Tobias", "Linus"]; var myChildren = myGirls.concat(myBoys); // 連接 myGirls 和 myBoys var arr1 = ["Cecilie", "Lone"]; var arr2 = ["Emil", "Tobias", "Linus"]; var arr3 = ["Robin", "Morgan"]; var myChildren = arr1.concat(arr2, arr3); // 將arr1、arr2 與 arr3 連接在一起
4.slice() :
方法用數(shù)組的某個片段切出新數(shù)組。
var fruits = ["Banana", "Orange", "Lemon", "Apple", "Mango"]; var citrus = fruits.slice(1);//從第一個到最后 //["Orange", "Lemon", "Apple", "Mango"] var fruits = ["Banana", "Orange", "Lemon", "Apple", "Mango"]; var citrus = fruits.slice(1,3);//從第一個到第三個(不包括3) //["Orange", "Lemon"]
5.map():
將數(shù)組中的每個元素調(diào)用一個提供的函數(shù),結(jié)果作為一個新的數(shù)組返回,并沒有改變原來的數(shù)組
let arr = [1, 2, 3, 4, 5] let newArr = arr.map(x => x*2)//簡寫的箭頭函數(shù) //arr= [1, 2, 3, 4, 5] 原數(shù)組保持不變 //newArr = [2, 4, 6, 8, 10] 返回新數(shù)組
6.forEach():
將數(shù)組中的每個元素執(zhí)行提供的函數(shù),沒有返回值,注意和map方法區(qū)分
let arr = [1, 2, 3, 4, 5]
arr.forEach(x => {
console.log(2*x)
//return x*2 返回值沒有用,此函數(shù)沒有返回值
})
7.filter():
此方法是將所有元素進(jìn)行判斷,將滿足條件的元素作為一個新的數(shù)組返回。函數(shù)里面寫的是條件?。。?/p>
let arr = [1, 2, 3, 4, 5]
let newArr = arr.filter(value => value >= 3 )
//或者
let newArr = arr.filter(function(value) {return value >= 3} )
console.log(newArr)
//[3,4,5]
8.every():
此方法是將所有元素進(jìn)行判斷返回一個布爾值,如果所有元素都滿足判斷條件,則返回true,否則為false
let arr = [1, 2, 3, 4, 5] const isLessThan4 = value => value < 4 const isLessThan6 => value => value < 6 arr.every(isLessThan4 ) //false arr.every(isLessThan6 ) //true
9.some():
此方法是將所有元素進(jìn)行判斷返回一個布爾值,如果存在元素滿足判斷條件,則返回true,若所有元素都不滿足判斷條件,則返回false
let arr= [1, 2, 3, 4, 5] const isLessThan4 = value => value < 4 const isLessThan6 = value => value > 6 arr.some(isLessThan4 ) //true arr.some(isLessThan6 ) //false
10.reduce():
此方法是所有元素調(diào)用返回函數(shù),返回值為最后結(jié)果,傳入的值必須是函數(shù)類型
let arr = [1, 2, 3, 4, 5] const add = (a, b) => a + b let sum = arr.reduce(add) console.log(sum) //sum = 15 相當(dāng)于累加的效果 //與之相對應(yīng)的還有一個 Array.reduceRight() 方法,區(qū)別是這個是從右向左操作的
總結(jié)
本篇文章就到這里了,希望能夠給你帶來幫助,也希望您能夠多多關(guān)注腳本之家的更多內(nèi)容!
相關(guān)文章
vue使用vue-quill-editor富文本編輯器且將圖片上傳到服務(wù)器的功能
這篇文章主要介紹了vue使用vue-quill-editor富文本編輯器且將圖片上傳到服務(wù)器的功能,本文通過實例代碼給大家介紹的非常詳細(xì),對大家的學(xué)習(xí)或工作具有一定的參考借鑒價值,需要的朋友可以參考下2021-01-01
JavaScript學(xué)習(xí)筆記之取值函數(shù)getter與取值函數(shù)setter詳解
這篇文章主要介紹了JavaScript取值函數(shù)getter與取值函數(shù)setter,文中通過示例代碼介紹的非常詳細(xì),對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值,需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2022-08-08
javaScript事件學(xué)習(xí)小結(jié)(四)event的公共成員(屬性和方法)
這篇文章主要介紹了javaScript事件學(xué)習(xí)小結(jié)(四)event的公共成員(屬性和方法)的相關(guān)資料,非常不錯,具有參考借鑒價值,需要的朋友可以參考下2016-06-06
微信小程序?qū)崿F(xiàn)指定顯示行數(shù)多余文字去掉用省略號代替
這篇文章主要介紹了微信小程序?qū)崿F(xiàn)指定顯示行數(shù)多余文字去掉用省略號代替的方法,需要的朋友可以參考下2018-07-07

