基本方法
isArray() 判斷數組
isArray() 方法用於判斷是否是數組(有兼容性)
語法:Array.isArray(arr)
返回值:是數組,返回true。不是數組,返回false。
if (Array.isArray([1,2,3])) {
// true
} else {
// false
}
toString() 轉字符串
toString() 方法可把數組轉換為字符串,並返回結果。
語法:array.toString()
返回值:字符串
var arr = ['a','s','d']
var str = arr.toString()
console.log(str) // a,s,d
join() 分割
join() 方法用於把數組中的所有元素放入一個字符串。
語法:array.join(separator)
separator:可選。分割符,默認英文逗號。
返回值:字符串
var arr = ['a','s','d']
var str = arr.join()
console.log(str) // a,s,d
pop() 刪除數組最后一項
pop() 方法用於刪除並返回數組的最后一個元素。
語法:arrayObject.pop()
返回值:數組長度減1,並返回刪除的元素的值。如果是空數組,返回undefined。
var arr = ['a','s','d']
var str = arr.pop()
console.log(str) // d
console.log(arr) // a,s
push() 數組尾部添加元素
push() 方法可向數組的末尾添加一個或多個元素,並返回新的長度。
語法:arrayObject.push(newelement1,newelement2,....,newelementX)
newelement1:必需。要添加到數組的第一個元素。
newelement2:可選。要添加到數組的第二個元素。
newelementX:可選。可添加多個元素。
返回值:新的長度
var arr = ['a','s','d']
var len = arr.push('f')
console.log(len) // 4
console.log(arr) // a,s,d,f
shift() 刪除數組第一項
shift() 方法用於刪除並返回數組的第一個元素。
語法:arrayObject.shift()
返回值:數組長度減1,並返回刪除的元素的值。如果是空數組,返回undefined。
var arr = ['a','s','d']
var str = arr.shift()
console.log(str) // a
console.log(arr) // s,d
unshift() 數組開頭添加元素
unshift() 方法可向數組的開頭添加一個或多個元素,並返回新的長度。
語法:arrayObject.unshift(newelement1,newelement2,....,newelementX)
newelement1:必需。要添加到數組的第一個元素。
newelement2:可選。要添加到數組的第二個元素。
newelementX:可選。可添加多個元素。
返回值:新的長度
var arr = ['a','s','d']
var len = arr.unshift('f')
console.log(len) // 4
console.log(arr) // f,a,s,d
reverse() 顛倒數組
reverse() 方法用於顛倒數組中元素的順序。
返回值:排序的原數組。
var arr = ['a','s','d']
arr.reverse()
console.log(arr) // d,s,a
sort() 排序
sort() 方法用於對數組的元素進行排序。
語法:arrayObject.sort(sortby)
sortby:可選。規定排序順序,必須是函數。默認按字母編碼順序排序。
返回值:排序的原數組。
var arr = ['a','c','d','b']
arr.sort()
console.log(arr) // a,b,c,d
concat() 合並數組
concat() 方法用於合並兩個或多個數組。
語法:arrayObject.concat(arrayX,arrayX,......,arrayX)
arrayX:必需。該參數可以是具體的值,可以是數組對象,也可以是任意多個。
返回值:返回一個新的數組。不會改變原數組。
var arr1 = ['a','b']
var arr2 = ['c','d']
var arr3 = arr1.concat(arr2)
console.log(arr1) // a,b
console.log(arr2) // c,d
console.log(arr3) // a,b,c,d
slice() 提取
slice() 方法可從已有的數組中返回選定的元素。
語法:arrayObject.slice(start,end)
start:必需。規定從何處開始選取(包含)。
end:可選。規定從何處結束選取(不包含)。
返回值:返回一個新的數組。不會改變原數組。
var arr = ['a','b','c','d','e']
var newArr = arr.slice(1,3)
console.log(arr) // a,b,c,d,e
console.log(newArr) // b,c
splice() 添加、刪除、替換
splice() 方法用於添加、刪除、替換數組元素,返回被刪除的項目。
語法:arrayObject.splice(index,howmany,item1,.....,itemX)
index:必需。整數,規定添加/刪除項目的位置。
howmany:必需。要刪除的項目數量。如果設置為 0,則不會刪除項目。
item1,.....,itemX:可選。向數組添加/替換的新項目。
返回值:刪除的數組。
// 刪除元素
var arr = ['a','b','c','d','e']
arr.splice(2,1)
console.log(arr) // a,b,d,e
// 刪除元素 替換新元素
var arr = ['a','b','c','d','e']
var del = arr.splice(1,1,'f')
console.log(arr) // a,f,c,d,e
console.log(del) // b
// 添加新的元素
var arr = ['a','b','c','d','e']
arr.splice(1,0,'f')
console.log(arr) // a,f,b,c,d,e
indexOf() 查找首次位置
indexOf() 方法可返回一個指定元素在數組中第一次出現的位置。
語法:Array.indexOf(item,start)
item:必須。查找的元素。
start:可選的整數參數。規定在數組中開始檢索的位置。
返回值:元素在數組中的位置,如果沒有搜索到則返回 -1。
var arr = ['a','c','b','c','e']
var index = arr.indexOf('c')
console.log(index) // 1
lastIndexOf() 查找最后位置
lastIndexOf() 方法可返回一個指定元素在數組中最后出現的位置,從后向前查找。
語法:Array.lastIndexOf(item,start)
item:必須。查找的元素。
start:可選的整數參數。規定在數組中開始檢索的位置。
返回值:元素在數組中的位置,如果沒有搜索到則返回 -1。
var arr = ['a','c','b','c','e']
var index = arr.lastIndexOf('c')
console.log(index) // 3
迭代數組的5種方法
every()
every()方法用於判斷數組中是否每個元素都滿足條件。
語法:Array.every(function(item,index,array) { return 條件 })
item:必須。當前元素的值。
index:當前元素的索引。
array:當前元素的數組對象。
返回值:只有都滿足才返回true,只要有一項不滿足返回false。
var arr = [1,2,3,4,5,6]
var res = arr.every(item => {
return item > 2
})
console.log(res) // false
some()
some()用於判斷數組中是否有至少一個元素滿足條件。
語法:Array.some(function(item,index,array) { return 條件 })
item:必須。當前元素的值。
index:當前元素的索引。
array:當前元素的數組對象。
返回值:只要有一個滿足就返回true,只有都不滿足才返回false。
var arr = [1,2,3,4,5,6]
var res = arr.some(item => {
return item > 5
})
console.log(res) // true
filter()
filter()方法用於對數組進行過濾。
語法:Array.filter(function(item, index, array) { return 條件 })
item:必須。當前元素的值。
index:當前元素的索引。
array:當前元素的數組對象。
返回值:返回符合條件的新數組,不會改變原數組。
var arr = [1,2,3,4,5,6]
var res = arr.filter(item => {
return item > 3
})
console.log(res) // [4,5,6]
map()
map()方法返回一個新數組,數組中的元素為原始數組元素調用函數處理后的值。
語法:Array.map(function(item, index, array) { return 條件 })
item:必須。當前元素的值。
index:當前元素的索引。
array:當前元素的數組對象。
返回值:返回新的數組,不會改變原數組。
var arr = [1,2,3,4]
var res = arr.map(item => {
if (item == 3) {
return item * 2
}
return item
})
console.log(res) // [1,2,6,4]
forEach()
forEach() 方法用於調用數組的每個元素,並將元素傳遞給回調函數。
語法:Array.forEach(function(item, index, array) { return 條件 })
item:必須。當前元素的值。
index:當前元素的索引。
array:當前元素的數組對象。
沒有返回值:如果是空數組,item為undifined。
var arr = [1,2,3,4]
var sum = 0
arr.forEach(item => {
sum += item
})
console.log(sum) // 10
reduce()
reduce() 方法接收一個函數作為累加器,數組中的每個值(從左到右)開始縮減,最終計算為一個值。
reduce() 可以作為一個高階函數,用於函數的 compose。
語法:Array.reduce(function(total, iten, index, array) { return total }, initialValue)
total:必須。計算結束后的返回值。初始值為initialValue。
item:必須。當前元素的值。
index:當前元素的索引。
array:當前元素的數組對象。
initialValue:傳遞給函數的初始值。
返回值:返回計算結果。
// 計算數組項總和
var arr = [1,2,3,4]
var sum = arr.reduce((total,item) => {
return total + item
},0)
console.log(sum) // 10
// 計算數組項最大值
var arr = [1,2,3,4]
var max = arr.reduce((total,item) => {
return Math.max(total, item)
})
console.log(max) // 4
// 數組去重
var arr = [1,2,3,2,1,4]
var newArr = arr.reduce((total,item) => {
total.indexOf(item) === -1 && total.push(item)
return total
},[])
console.log(newArr) // [1,2,3,4]
ES6 新增數組方法
fill()
fill() 方法用於將一個固定值替換數組的元素。
語法:Array.fill(value, start, end)
value:必需。填充的值。
start:可選。開始填充位置。
end:可選。停止填充位置。
返回值:被填充的原數組。
var arr = ['a','b','c','d']
arr.fill('e',1,3)
console.log(arr) // ['a','e','e','d']
find()
find()方法用於查找並返回符合條件的第一個數組項。
語法:Array.find(function(item, index, array) { return 條件 })
item:必須。當前元素的值。
index:當前元素的索引。
array:當前元素的數組對象。
返回值:返回符合條件的第一個數組元素值,沒有符合條件返回 undefined。
var arr = ['a','b','c','d']
var str = arr.find(item => {
return item == 'c'
})
console.log(str) // c
findIndex()
findIndex()方法用於查找並返回符合條件的第一個數組項的位置。
語法:Array.findIndex(function(item, index, array) { return 條件 })
item:必須。當前元素的值。
index:當前元素的索引。
array:當前元素的數組對象。
返回值:返回符合條件的第一個數組元素值,沒有符合條件返回 -1。
var arr = ['a','b','c','d']
var index = arr.findIndex(item => {
return item == 'c'
})
console.log(index) // 2
ES7 新增數組方法
includes()
includes() 方法用來判斷一個數組是否包含一個指定的值。
語法:Array.includes(searchElement, fromIndex)
searchElement:必須。需要查找的元素值。
fromIndex:可選。從該索引處開始查找 searchElement。
返回值:包含返回true,不包含返回false。
var arr = ['a','b','c','d']
var res = arr.includes('b')
console.log(res) // true