陣列中常用的方法總結
棧方法:都會改變原陣列
新增:push,unshift
刪除:shift,pop
1.push()後增
push()方法可以向陣列後新增一個新的元素,並返回新陣列的長度。
末尾新增,返回長度,改變原陣列
var a = [1,2,3]
var b = a.push(4)
console.log(a) // [1,2,3,4]
console.log(b) // 4
2.unshift()前增
unshift()可以向陣列前新增一個或多個元素,並返回新的長度
首部新增,返回長度,改變原陣列
var a = [1,2,3]
var b = a.unshift(4,9)
console.log(a) // [4,9,1,2,3]
console.log(b) // 5
3.pop()後刪
pop()用於刪除並返回最後一個元素
尾部刪除,返回被刪除的元素,改變原陣列
var a = [1,2,3]
var b = a.pop()
console.log(a) // [1,2]
console.log(b) // 3
4.shift()前刪
shift()用於刪除並返回首個元素
刪除首個元素,返回被刪除的元素,改變原陣列
5.splice()修改刪除
splice(index,length,add1,add2…,addn)表示從index開始刪除length個元素,並從index開始新增元素1~n,放回被刪除的元素組成的陣列。
對陣列進行刪除修改,返回被刪除的元素組成的陣列,改變原陣列
var a = [1,2,3]
var b = a.splice(1,1,3,[2,3,4],5)
console.log(a) // [1,3,[2,3,4],5,3]
console.log(b) // [2]
6.concat()拼接
concat()方法用來合併兩個或多個陣列
合併兩個或多個陣列,返回新陣列,不會改變原陣列
var a = [1,2,3]
var b = [4,5]
var c = a.concat(b)
console.log(a) // [1,2,3]
console.log(b) // [4,5]
console.log(c) // [1,2,3,4,5]
7.slice()剪下
slice(startIndex,endIndex)返回從startIndex開始(包括),到endIndex(不包括)之間的原屬組成的陣列
返回新陣列,不改變原陣列
var a = [1,2,3]
var b = a.slice(0,1)
// 不填引數則表示剪下整個陣列
var c = a.slice()
console.log(a) // [1,2,3]
console.log(b) // [1]
console.log(c) // [1,2,3]
console.log(a===c) // false // 注意 a !== c
// 負數表示從後往前數
var d = a.slice(-1,-2)
console.log(d) // [] 從左向右擷取,所以說為[]
var e = a.slice(-1)
console.log(e) // [3]
8.join()
join()方法用來將陣列轉換為字串
不改變原陣列,返回轉換後的字串
var a = [1,2,3,4,5]
console.log(a.join(',')) // 1,2,3,4,5
console.log(a) // [1,2,3,4,5]
9.sort()排序
字母的話按照ascii碼排序
改變原陣列,返回排序後的陣列
var a = ['a','b','d','c']
console.log(a.sort()) // ['a','b','c','d']
console.log(a) // ['a','b','c','d']
10.reverse()顛倒順序
reverse()方法用於顛倒陣列中元素的順序
返回的是顛倒後的陣列,會改變原陣列。
var a = [1,3,2,7,6]
console.log(a.reverse()) // [6,7,2,3,1]
console.log(a) // [6,7,2,3,1]
11.indexOf()和lastIndexOf()
indexOf(某元素,startIndex)從startIndex開始,查詢某元素在陣列中的位置,若存在則返回第一個位置的下標,否則返回-1
lastIndexOf(某元素,startIndex)和indexOf()相同,區別在於從尾部向首部查詢
不會改變原陣列,返回找到的index,否則返回-1
若不使用下標,則一般通過includes()方法代替indexOf()
var a = [1,2,4,3,4,5]
console.log(a.indexOf(4)) // 2
console.log(a.indexOf(4,3)) // 4
12.filer()過濾
filer()方法返回陣列中滿足條件的元素組成的新陣列,原陣列不變
filer()的引數是一個方法
var a = [1,2,3,4,11]
// 第一個引數為一個方法,有三個引數,current:當前值 index:當前值下標 array:這個陣列物件
var b = a.filter(function(current,index,array){
return current < 10
})
console.log(b) // [1,2,3,4]
console.log(a) // [1,2,3,4,11]
13.map()格式化陣列
map()方法根據需求格式化原陣列,返回格式化的陣列。原陣列不變
var a = [1,2,3,4,5]
// 引數同filter方法
var b = a.map(function(current,index,array){
return current + 1
})
console.log(b) // [2,3,4,5,6]
console.log(a) // [1,2,3,4,5]
14.every()
對陣列的每一項都執行給定的函式,若每一項都返回true,則返回true
var a = [1,2,3,4,5]
var b = a.every(function(current,index,array){
return current < 6
})
var c = a.every(function(current,index,array){
return current < 3
})
console.log(b) // true
console.log(c) // false
15.some()
對陣列的每一項都執行給定的函式,若存在一項或多項返回true,則返回true
var a = [1,2,3,4,5]
var b = a.some(function(current,index,array){
return current > 4
})
var c = a.some(function(current,index,array){
return current > 5
})
console.log(b) // true
console.log(c) // false
16.forEach陣列遍歷
遍歷整個陣列,中途不能中斷
var arr = ['a','b','c']
var copy = []
arr.forEach(function(item){
copy.push(item)
})
console.log(copy)
es6中新增的方法
1.find()
找到陣列中第一次滿足條件的元素,並返回,若找不到則返回undefined.不改變原陣列
和filter()方法的區別在於:filter返回值是所有滿足條件的元素組成的陣列,
一般在需要使用找到的元素時,用find()方法
var a = [1,2,3,4]
// b在下面需要使用,則一般用find
var b = a.find(function(ele,index,array){
return ele == 1
})
var c = 3
var d = b + c
console.log(a) // [1,2,3,4]
console.log(b) // 1
console.log(d) // 4
// 若只需判斷元素是否存在
// 若果是簡單陣列(非物件陣列),則一般使用Array.includes(value)方法
// 如果為物件陣列,則可以使用Array.some()方法
var a = [1,2,3]
console.log(a.includes(1)) // true
var a = [{"name": "xiaoming" },{"name": "xiaohong"}]
console.log(a.some(function(ele){
return ele.name == 'xiaoming'
})) // true
2.findIndex()方法
findIndex()的作用同indexOf(),返回第一個滿足條件的下標,並停止尋找。
區別是findIndex() 的引數為一個回撥函式,且一般用於物件陣列
var a = [1,2,3,4]
var b = a.findIndex(function(ele,index,array){
return ele === 2
})
var c = a.indexOf(2)
console.log(a) // [1,2,3,4]
console.log(b) // 1
console.log(c) // 1
3.includes()
includes()方法,返回一個布林值。 引數是一個value,一般用於簡單陣列。
對於複雜陣列,則可以使用some()方法替代includes()方法
var a = [1,2,3]
console.log(a.includes(1)) // true
4.Array.isArray()方法
用來判斷一個元素是否為陣列
Array.isArray([]) // true
Array.isArray({}) // false
相關文章
- js中陣列常用方法總結JS陣列
- js陣列常用方法總結JS陣列
- JS 陣列中常用方法總結JS陣列
- js與jquery常用陣列方法總結JSjQuery陣列
- JS常用陣列方法總結筆記JS陣列筆記
- JavaScript陣列方法總結(中)JavaScript陣列
- 陣列的三種宣告方式總結、多維陣列的遍歷、Arrays類的常用方法總結陣列
- JS陣列方法總結JS陣列
- javascript陣列方法總結JavaScript陣列
- 所有陣列的方法(api)總結陣列API
- 陣列的常用方法陣列
- 陣列常用的方法陣列
- JS-陣列方法總結JS陣列
- JS中字串和陣列的常用方法JS字串陣列
- 陣列常用方法陣列
- 常用陣列方法陣列
- 總結一些常用的陣列函式陣列函式
- JavaScript陣列去重方法總結JavaScript陣列
- 遍歷物件和陣列的方法總結物件陣列
- js常用陣列方法JS陣列
- 常用陣列方法梳理陣列
- 陣列常用物件方法陣列物件
- javascript陣列常用方法JavaScript陣列
- 判斷是否為陣列的 JavaScript 方法總結陣列JavaScript
- JavaScript 陣列 常用方法(二)JavaScript陣列
- 陣列常用方法補充陣列
- 關於ES5陣列方法總結陣列
- 紅寶書總結-js陣列的相關方法JS陣列
- 陣列常用函式彙總陣列函式
- JavaScript陣列 幾個常用方法JavaScript陣列
- 字串和陣列常用方法整理字串陣列
- 陣列常用方法的簡單封裝陣列封裝
- js 陣列的方法小結JS陣列
- JS實現陣列去重方法總結(六種方法)JS陣列
- 常用的幾個陣列方法與數學方法陣列
- JS陣列API總結JS陣列API
- JS中陣列遍歷方法foreach,filter,some,every,map方法介紹與總結JS陣列Filter
- JavaScript基礎總結(三)——陣列總結JavaScript陣列