下面以var arr = ['x', 'u', 'e', 'y', 'i', 'n', 'g']為例
修改器方法:
修改器方法會(huì)改變?cè)瓟?shù)組
1. arr.pop() && arr.push()
會(huì)改變?cè)瓟?shù)組
arr.pop()刪除數(shù)組最后一個(gè)元素,并返回這個(gè)元素
arr.pop() // "g"
arr.push()在數(shù)組末尾增加一個(gè)元素,返回?cái)?shù)組的新長(zhǎng)度
arr.push('l') // 8
arr // ["x", "u", "e", "y", "i", "n", "g", "l"]
2. arr.shift() && arr.unshift()
arr.shift() 刪除數(shù)組開頭第一個(gè)元素,并返回這個(gè)元素
arr.shift() // "x"
arr.unshift() 在數(shù)組開頭增加一個(gè)元素,返回?cái)?shù)組新長(zhǎng)度。
arr.unshift('l') // 8
arr // ["l", "x", "u", "e", "y", "i", "n", "g"]
3. arr.reverse()
會(huì)改變?cè)瓟?shù)組
數(shù)組倒序,返回倒序后的數(shù)組
arr.reverse() // ["g", "n", "i", "y", "e", "u", "x"]
4. arr.sort() || arr.sort(compareFunction)
對(duì)數(shù)組進(jìn)行排序,并返回排好序的當(dāng)前數(shù)組。(寫得這么拗口是為了強(qiáng)調(diào)是原數(shù)組的順序改變)
.sort()使用的是就地排序算法,且不一定穩(wěn)定。
(就地排序意思是直接在原數(shù)組上排序。穩(wěn)定指的是兩個(gè)相等的元素排好序后前后順序不變)
默認(rèn)排序順序是根據(jù)字符串Unicode碼點(diǎn)。
這意味著:
var scores = [1, 10, 21, 2];
scores.sort(); // [1, 10, 2, 21]
// 10在2之前,因?yàn)樵?Unicode 指針順序中"10"在"2"之前
不過(guò).sort()可以接受一個(gè)函數(shù)作為參數(shù),自己指定排序規(guī)則:
var scores = [1, 10, 21, 2];
scores.sort(function (a, b) { // 從小到大排序
return a - b
}) // [ 1, 2, 10, 21 ]
函數(shù)compareFunction 的規(guī)則如下:
- 如果 compareFunction(a, b) 小于 0 ,那么 a 會(huì)被排列到 b 之前;
- 如果 compareFunction(a, b) 等于 0 , a 和 b 的相對(duì)位置不變。
備注: ECMAScript 標(biāo)準(zhǔn)并不保證這一行為,而且也不是所有瀏覽器都會(huì)遵守(例如 Mozilla 在 2003 年之前的版本); - 如果 compareFunction(a, b) 大于 0 , b 會(huì)被排列到 a 之前。
- compareFunction(a, b) 必須總是對(duì)相同的輸入返回相同的比較結(jié)果,否則排序的結(jié)果將是不確定的。
5. arr.splice(start, deleteCount, item1, item2, ...)
修改數(shù)組,從start開始,刪除deleteCount個(gè)元素,再插入后面的item1, item2, ...
// 從下標(biāo)0開始,刪除一個(gè)元素,并插入‘X'
arr.splice(0, 1, 'X') // ["x"]
arr // ["X", "u", "e", "y", "i", "n", "g"]
訪問(wèn)方法:
訪問(wèn)方法不會(huì)改變?cè)瓟?shù)組,一般都是返回一個(gè)新數(shù)組
1. arr1.concat(arr2)
合并arr1和arr2
var arr1 = ["x", "u", "e"]
var arr2 = ["y", "i", "n", "g"]
arr1.concat(arr2) // ["x", "u", "e", "y", "i", "n", "g"]
2. arr.includes(searchElement, fromIndex)
從fromIndex開始查找searchElement,找到了返回true,找不到返回false
fromIndex可省略,默認(rèn)從下標(biāo)0開始找。
arr.includes('u') // true
arr.includes('u', 2) // false
3. arr.join(separator)
數(shù)組合并成一個(gè)字符串,每一個(gè)元素用separator隔開。
separator可省略,默認(rèn)為,
arr.join() // "x,u,e,y,i,n,g"
arr.join('') // "xueying"
4. arr.slice(begin, end)
抽取數(shù)組在[begin,end)區(qū)間內(nèi)的元素,返回一個(gè)新數(shù)組。
arr.slice(0, 3) // ["x", "u", "e"]
5. arr.toString()
arr.toString() // "x,u,e,y,i,n,g"
6. arr.indexOf(searchElement[, fromIndex = 0])
返回searchElement的下標(biāo),沒(méi)有則返回 -1
可以指定fromIndex表示從哪個(gè)下標(biāo)開始查找,默認(rèn)為下標(biāo)0
arr.indexOf('u') // 1
arr.indexOf('u', 2) // -1
7. arr.lastIndexOf(searchElement[, fromIndex = arr.length - 1])
找到數(shù)組中最后一個(gè)和searchElement相等的元素的下標(biāo)。
可以指定fromIndex表示從哪個(gè)下標(biāo)開始查找,默認(rèn)從數(shù)組最后一個(gè)元素開始。
var arr = ["x", "u", "l", "e", "y", "i", "n", "g", "l"]
arr.lastIndexOf('l') // 8
迭代方法
1. arr.forEach()
語(yǔ)法:
array.forEach(callback(currentValue, index, array){
//do something
}, thisArg)
對(duì)數(shù)組每一個(gè)元素執(zhí)行callback函數(shù)。
callback函數(shù)接收3個(gè)參數(shù):
-
currentValue:當(dāng)前元素的值 -
index: 當(dāng)前元素的下標(biāo) -
array:原數(shù)組
thisArg:可選,用作callback函數(shù)的this值。
var arr = ['x', 'u', 'e', 'y', 'i', 'n', 'g']
arr.forEach((element, index, array) => console.log('arr[' + index + '] = ' + element))
/*
arr[0] = x
arr[1] = u
arr[2] = e
arr[3] = y
arr[4] = i
arr[5] = n
arr[6] = g
*/
2. arr.every(callback[, thisArg]) && arr.some(callback[, thisArg])
arr.every(callback[, thisArg])
測(cè)試數(shù)組的 所有 元素是否都通過(guò)了callback函數(shù)的測(cè)試。
全部通過(guò)返回true ,否則返回false
thisArg指定this值。
// 格式和forEach方法沒(méi)區(qū)別
var arr = ['x', 'u', 'e', 'y', 'i', 'n', 'g']
console.log(arr.every((element, index, array) => element === element.toLowerCase())) // 數(shù)組中的元素是否都為小寫
// true
arr.some(callback[, thisArg])
測(cè)試數(shù)組的 某些 元素是否全部通過(guò)了callback函數(shù)的測(cè)試。
// 語(yǔ)法和forEach方法沒(méi)區(qū)別
var arr = ['X', 'u', 'e', 'y', 'i', 'n', 'g'] // 第一個(gè)元素大寫
console.log(arr.some((element, index, array) => element === element.toLowerCase())) // 數(shù)組中是否有小寫的元素
// true
3. arr.filter(callback[, thisArg])
過(guò)濾器,創(chuàng)建一個(gè)新數(shù)組, 其包含通過(guò)所提供函數(shù)實(shí)現(xiàn)的測(cè)試的所有元素
語(yǔ)法還是跟forEach方法沒(méi)區(qū)別。
var arr = ['X', 'u', 'e', 'y', 'i', 'n', 'g'] // 第一個(gè)元素大寫
console.log(arr.filter((element, index, array) => element === element.toLowerCase()))
// [ 'u', 'e', 'y', 'i', 'n', 'g' ]
4. arr.find(callback[, thisArg]) && arr.findIndex(callback[, thisArg])
arr.find(callback[, thisArg])
語(yǔ)法同上。
返回?cái)?shù)組中第一個(gè)滿足callback函數(shù)的元素的值。否則返回 undefined。
var arr = ['X', 'u', 'e', 'y', 'i', 'n', 'g'] // 第一個(gè)元素大寫
console.log(arr.find((element, index, array) => element === element.toLowerCase()))
// "u"
arr.findIndex(callback[, thisArg])
語(yǔ)法同上。
返回?cái)?shù)組中第一個(gè)滿足callback函數(shù)的元素的索引。否則返回-1。
var arr = ['X', 'u', 'e', 'y', 'i', 'n', 'g'] // 第一個(gè)元素大寫
console.log(arr.findIndex((element, index, array) => element === element.toLowerCase()))
// 1
5. arr.entries()
(迭代器)返回一個(gè)新的Array Iterator對(duì)象,該對(duì)象包含數(shù)組中每個(gè)索引的鍵/值對(duì)。
跟Python中迭代器一樣,用.next()訪問(wèn)下一鍵值對(duì)。
var iterator = arr.entries();
iterator.next() // {value: Array(2), done: false} done表示迭代是否已經(jīng)完成
iterator.next().value // [1, "u"]
6. arr.keys() && arr.values()
arr.keys()
返回一個(gè)新的Array迭代器,它包含數(shù)組中每個(gè)索引的鍵。
var iterator = arr.keys();
iterator.next() // {value: 0, done: false}
iterator.next().value // 1
// 不斷next直到最后一個(gè)
console.log(iterator.next()) // {value: undefined, done: true}
arr.values()
返回一個(gè)新的 Array Iterator 對(duì)象,它包含數(shù)組每個(gè)索引的值。
PS: Chrome 未實(shí)現(xiàn),F(xiàn)irefox未實(shí)現(xiàn),Edge已實(shí)現(xiàn)。
Chrome 及Firefox可以用"arrSymbol.iterator"方法來(lái)代替values()方法。
var arr = [1,2,3,4,5]
var i = arr[Symbol.iterator]()
i.next() // {value: 1, done: false}
i.next() // {value: 2, done: false}
7. arr.map(callback)
創(chuàng)建一個(gè)新數(shù)組,其結(jié)果是該數(shù)組中的每個(gè)元素都調(diào)用callback函數(shù)后返回的結(jié)果。
語(yǔ)法:
arr.map(function callback(currentValue, index, array) {
// Return element for new_array
}[, thisArg])
例子:
arr.map((element, index, array) => element.toUpperCase()) // ["X", "U", "E", "Y", "I", "N", "G"]
8. arr.reduce(callback[, initialValue])
累加器, 數(shù)組中的每個(gè)元素(從左到右)應(yīng)用一個(gè)函數(shù),將其減少為單個(gè)值。
callback函數(shù)接收4個(gè)參數(shù):
-
accumulator:累加器累加回調(diào)的返回值; 它是上一次調(diào)用回調(diào)時(shí)返回的累積值,或initialValue -
currentValue:數(shù)組中正在處理的元素 -
currentIndex:數(shù)組中正在處理的當(dāng)前元素的索引。 -
array:原數(shù)組
initialValue:用作第一個(gè)調(diào)用 callback的第一個(gè)參數(shù)的值。 如果沒(méi)有提供初始值,則將使用數(shù)組中的第一個(gè)元素。 在沒(méi)有初始值的空數(shù)組上調(diào)用 reduce 將報(bào)錯(cuò)。
回調(diào)函數(shù)第一次執(zhí)行時(shí),accumulator 和currentValue的取值有兩種情況:
- 調(diào)用reduce時(shí)提供initialValue,accumulator取值為initialValue,currentValue取數(shù)組中的第一個(gè)值。
- 沒(méi)有提供 initialValue,accumulator取數(shù)組中的第一個(gè)值,currentValue取數(shù)組中的第二個(gè)值。
// 取最大值
var arr = [1, 2, 3, 4, 5, 6]
console.log(arr.reduce((accumulator, currentValue) => Math.max(accumulator, currentValue)))
// 6
// 連接數(shù)組的元素
var arr = ['x', 'u', 'e', 'y', 'i', 'n', 'g']
console.log(arr.reduce((accumulator, currentValue) => accumulator.concat(currentValue)))
// xueying