本篇文章給大家分享的是有關(guān)javascript數(shù)組有哪些操作方法，小編覺得挺實(shí)用的，因此分享給大家學(xué)習(xí)，希望大家閱讀完這篇文章后可以有所收獲，話不多說，跟著小編一起來看看吧。
成都創(chuàng)新互聯(lián)專注于奎屯企業(yè)網(wǎng)站建設(shè),成都響應(yīng)式網(wǎng)站建設(shè)公司,商城網(wǎng)站建設(shè)?？途W(wǎng)站建設(shè)公司,為奎屯等地區(qū)提供建站服務(wù)。全流程按需定制網(wǎng)站，專業(yè)設(shè)計(jì)，全程項(xiàng)目跟蹤，成都創(chuàng)新互聯(lián)專業(yè)和態(tài)度為您提供的服務(wù)
ECMAScript為操作已經(jīng)包含在數(shù)組中的項(xiàng)提供了很多方法。這里本人總結(jié)一下自己對這些方法的理解，如此之多的方法中，我首先已是否會(huì)改變原數(shù)組做為分類標(biāo)準(zhǔn)，逐個(gè)解釋一下每一個(gè)方法。
使用方法：array.concat(array2,array3,...,arrayX)
返回值： 返回一個(gè)新的數(shù)組
concat()方法用于連接兩個(gè)或多個(gè)數(shù)組。該方法不會(huì)改變現(xiàn)有的數(shù)組，僅會(huì)返回被連接數(shù)組的一個(gè)副本。
在沒有傳遞參數(shù)的情況下，它只是復(fù)制當(dāng)前數(shù)組并返回副本；如果傳遞的值不是數(shù)組，這些值就會(huì)簡單地添加到結(jié)果數(shù)組的末尾。
var arr1 = [1,2,3]; var arr2 = arr1.concat(4,[5,6]); console.log(arr1); // [ 1, 2, 3 ] console.log(arr2); // [ 1, 2, 3, 4, 5, 6 ]
使用方法：array.join(separator)
返回值： 返回一個(gè)字符串
join()方法用于把數(shù)組中的所有元素放入一個(gè)字符串。元素是通過指定的分隔符進(jìn)行分隔的，默認(rèn)使用','號分割，不改變原數(shù)組。
var arr1 = [1,2,3]; var arr2 = arr1.join(); console.log(arr1); // [ 1, 2, 3 ] console.log(arr2); // 1,2,3
之前接觸過一個(gè)功能是需要生成多個(gè)連續(xù)的*，一開始是直接使用for循環(huán)可以做到，后面了解了join()方法后，發(fā)現(xiàn)其實(shí)一句話就可以弄好了。
重慶分公司
重慶分公司
var arr3 = "";
for(let i = 0; i < 15; i ++) {
arr3 = arr3 + "*";
}
console.log(arr3); // ***************
var arr4 = new Array(16).join("*");
console.log(arr4); // ***************使用方法：array.slice(start, end)
返回值： 返回一個(gè)新的數(shù)組，包含從 start 到 end （不包括該元素）的 arrayObject 中的元素
slice()接受一或兩個(gè)參數(shù)，即要返回項(xiàng)的起始和結(jié)束位置。
在只有一個(gè)參數(shù)的情況下，slice()方法返回從該參數(shù)指定位置到當(dāng)前數(shù)組末尾的所有項(xiàng)；
如果有兩個(gè)參數(shù)，改方法返回起始和結(jié)束位置之間的項(xiàng)——但不包括結(jié)束位置的項(xiàng)。
如果參數(shù)為負(fù)數(shù)，規(guī)定從數(shù)組尾部開始算起的位置。也就是說，-1 指最后一個(gè)元素，-2 指倒數(shù)第二個(gè)元素，以此類推。
var arr1 = [1,2,3,4,5,6]; var arr2 = arr1.slice(1); var arr3 = arr1.slice(2,4); var arr4 = arr1.slice(-4,-2); // 等價(jià)于 arr1.slice(2,4); console.log(arr1); // [ 1, 2, 3, 4, 5, 6 ] console.log(arr2); // [ 2, 3, 4, 5, 6 ] console.log(arr3); // [ 3, 4 ] console.log(arr4); // [ 3, 4 ]
對于偽數(shù)組轉(zhuǎn)換為標(biāo)準(zhǔn)數(shù)據(jù)就用到了這個(gè)方法
Array.prototype.slice.call(arguments)
使用方法：array.some(function(currentValue,index,arr),thisValue)
返回值： 布爾值
或 ==> some()對數(shù)組中的每一項(xiàng)運(yùn)行給定的函數(shù)，如果該函數(shù)對任一項(xiàng)返回true，剩余的元素不會(huì)再執(zhí)行檢測；如果沒有滿足條件的元素，則返回false。
function compare(item, index, arr){
return item > 10;
}
[2, 5, 8, 1, 4].some(compare); // false
[20, 5, 8, 1, 4].some(compare); // true使用方法：array.every(function(currentValue,index,arr),thisValue)
返回值： 布爾值
和 ==> every()對數(shù)組中的每一項(xiàng)運(yùn)行給定的函數(shù)，如果該函數(shù)對每一項(xiàng)返回true，剩余的元素不會(huì)再執(zhí)行檢測；如果其中有一個(gè)沒有滿足條件的元素，則返回false。
function compare(item, index, arr){
return item > 10;
}
[20, 50, 80, 11, 40].every(compare); // true
[20, 50, 80, 10, 40].every(compare); // false使用方法：array.filter(function(currentValue,index,arr), thisValue)
返回值： 返回?cái)?shù)組
filter()方法創(chuàng)建一個(gè)新的數(shù)組，新數(shù)組中的元素是通過檢查指定數(shù)組中符合條件的所有元素。
對數(shù)組的每一項(xiàng)都運(yùn)行給定的函數(shù)，返回結(jié)果為true的項(xiàng)組成的數(shù)組。
function filterArr(item, index, arr){
return item > 4;
}
[2, 5, 8, 1, 4].filter(filterArr); // [5,8]使用方法：array.map(function(currentValue,index,arr), thisValue)
返回值： 返回?cái)?shù)組
map()方法返回一個(gè)新數(shù)組，數(shù)組中的元素為原始數(shù)組元素調(diào)用函數(shù)處理后的值。
function mapArr(item, index, arr){
return item * 4;
}
[2, 5, 8, 1, 4].map(mapArr); // [8,20,32,4,16]經(jīng)常筆試和面試都會(huì)考到的一道題 ——實(shí)現(xiàn)一個(gè)map數(shù)組方法，以下是本人自己寫的一個(gè)方法
var arr = [2, 4, 8, 6, 1];
Array.prototype.myMap = function (fn, thisValue) {
var arr = this,
len = arr.length,
tmp = 0,
result = [];
thisValue = thisValue || null;
for (var i = 0; i < len; i++) {
var item = arr[i],
index = i;
tmp = fn.call(thisValue, item, index, arr);
result.push(tmp);
}
return result
}
function mapArr(item, index, arr) {
return item * 4;
}
arr.myMap(mapArr) // [8, 16, 32, 24, 4]使用方法：array.forEach(function(currentValue, index, arr), thisValue)
返回值： undefined
forEach() 方法用于調(diào)用數(shù)組的每個(gè)元素，并將元素傳遞給回調(diào)函數(shù)。這個(gè)方法沒有返回值。
本質(zhì)上與使用for循環(huán)迭代數(shù)組一樣。
var items = [1, 2, 4, 7, 3];
var copy = [];
items.forEach(function(item,index){
copy.push(item*index);
})
console.log(items); // [ 1, 2, 4, 7, 3 ]
console.log(copy); // [ 0, 2, 8, 21, 12 ]使用方法：array.reduce(function(total, currentValue, currentIndex, arr), initialValue)
返回值： 返回計(jì)算結(jié)果
| 參數(shù) | 描述 |
|---|---|
function(total,currentValue, index,arr) | 必需。用于執(zhí)行每個(gè)數(shù)組元素的函數(shù)。 |
initialValue | 可選。傳遞給函數(shù)的初始值 |
函數(shù)參數(shù)
| 參數(shù) | 描述 |
|---|---|
total | 必需。初始值, 或者計(jì)算結(jié)束后的返回值。 |
currentValue | 必需。當(dāng)前元素 |
currentIndex | 可選。當(dāng)前元素的索引 |
arr | 可選。當(dāng)前元素所屬的數(shù)組對象。 |
這兩個(gè)方法都會(huì)迭代數(shù)組的所有項(xiàng)，然后構(gòu)建一個(gè)最終返回的值。其中，reduce()方法中數(shù)組的第一項(xiàng)開始，逐個(gè)遍歷到最后；而reduceRight()則從數(shù)組的最后一項(xiàng)開始，向前遍歷到第一項(xiàng)。
如果沒有設(shè)置initialValue，total的值為數(shù)組第一項(xiàng)，currentValue為數(shù)組第二項(xiàng)。
如果設(shè)置了initialValue，則total的值就是initialValue，currentValue為數(shù)組第一項(xiàng)。
var numbers = [65, 44, 12, 4];
function getSum(total,currentValue, index,arr) {
return total + currentValue;
}
var res = numbers.reduce(getSum);
console.log(numbers); // [ 65, 44, 12, 4 ]
console.log(res); // 125
var numbers = [65, 44, 12, 4];
function getSum(total,currentValue, index,arr) {
return total + currentValue;
}
var res = numbers.reduce(getSum, 10); // 初始值設(shè)置為10，所以最終結(jié)果也相應(yīng)的加10
console.log(res); // 135具體reduce()方法用得好是能起到很大的作用的，對于批量修改從后臺獲取的數(shù)據(jù)十分有用，可以參考JS進(jìn)階篇--JS數(shù)組reduce()方法詳解及高級技巧
使用方法：array.push(item1, item2, ..., itemX)
返回值： 返回新數(shù)組的長度
push() 方法可向數(shù)組的末尾添加一個(gè)或多個(gè)元素，并返回新的長度。
var arr= [65, 44, 12, 4]; var arr1 = arr.push(2,5); console.log(arr); // [ 65, 44, 12, 4, 2, 5 ] console.log(arr1); // 6
使用方法：array.pop()
返回值： 數(shù)組原來的最后一個(gè)元素的值（移除的元素）
pop()方法用于刪除并返回?cái)?shù)組的最后一個(gè)元素。返回最后一個(gè)元素，會(huì)改變原數(shù)組。
var arr = [65, 44, 12, 4]; var arr1 = arr.pop(); console.log(arr); // [ 65, 44, 12 ] console.log(arr1); // 4
使用方法：array.unshift(item1,item2, ..., itemX)
返回值： 返回新數(shù)組的長度
unshift() 方法可向數(shù)組的開頭添加一個(gè)或更多元素，并返回新的長度。返回新長度，改變原數(shù)組。
var arr = [65, 44, 12, 4]; var arr1 = arr.unshift(1); console.log(arr); // [ 1, 65, 44, 12, 4 ] console.log(arr1); // 5
使用方法：array.shift()
返回值： 數(shù)組原來的第一個(gè)元素的值（移除的元素）
shift() 方法用于把數(shù)組的第一個(gè)元素從其中刪除，并返回第一個(gè)元素的值。返回第一個(gè)元素，改變原數(shù)組。
var arr = [65, 44, 12, 4]; var arr1 = arr.shift(); console.log(arr); // [ 44, 12, 4 ] console.log(arr1); // 65
使用方法：array.sort(sortfunction)
返回值： 返回排序后的數(shù)組（默認(rèn)升序）
sort() 法用于對數(shù)組的元素進(jìn)行排序。
排序順序可以是字母或數(shù)字，并按升序或降序。
默認(rèn)排序順序?yàn)榘醋帜干颉?/p>
P.S 由于排序是按照 Unicode code 位置排序，所以在排序數(shù)字的時(shí)候，會(huì)出現(xiàn)"10"在"5"的前面，所以使用數(shù)字排序，你必須通過一個(gè)函數(shù)作為參數(shù)來調(diào)用。
var values = [0, 1, 5, 10, 15];
values.sort();
console.log(values); // [ 0, 1, 10, 15, 5 ]
values.sort(function(a, b){
return a - b;
})
console.log(values); // [0, 1, 5, 10, 15 ]使用方法：array.reverse()
返回值： 返回顛倒后的數(shù)組
reverse() 方法用于顛倒數(shù)組中元素的順序。返回的是顛倒后的數(shù)組，會(huì)改變原數(shù)組。
var values = [0, 1, 5, 10, 15]; values.reverse(); console.log(values); // [ 15, 10, 5, 1, 0 ]
使用方法：array.fill(value, start, end)
返回值： 返回新的被替換的數(shù)組
fill()方法用于將一個(gè)固定值替換數(shù)組的元素。
| 參數(shù) | 描述 |
|---|---|
| value | 必需。填充的值。 |
| start | 可選。開始填充位置。 |
| end | 可選。停止填充位置(不包含) (默認(rèn)為 array.length) |
var values = [0, 1, 5, 10, 15]; values.fill(2); console.log(values); // [ 2, 2, 2, 2, 2 ] values = [0, 1, 5, 10, 15]; values.fill(2,3,4); console.log(values); // [ 0, 1, 5, 2, 15 ]
使用方法：array.splice(index,howmany,item1,.....,itemX)
返回值： 如果從 arrayObject 中刪除了元素，則返回的是含有被刪除的元素的數(shù)組
splice()有多種用法：
1、刪除: 可以刪除任意數(shù)量的項(xiàng)，只需要指定2個(gè)參數(shù)：要?jiǎng)h除的第一項(xiàng)的位置和要?jiǎng)h除的項(xiàng)數(shù)。splice(0,2) // 會(huì)刪除數(shù)組中前兩項(xiàng)
2、插入: 可以向指定位置插入任意數(shù)量的項(xiàng)，只需提供3個(gè)參數(shù)：起始位置、0（要?jiǎng)h除的項(xiàng)數(shù)）和要插入的項(xiàng)。如果要插入多個(gè)項(xiàng)，可以再傳入第四、第五，以至任意多個(gè)項(xiàng)。splice(2,0,1,4) // 會(huì)從數(shù)組位置2的地方插入1和4
3、替換: 可以向指定位置插入任意數(shù)量的項(xiàng)，且同時(shí)刪除任意數(shù)量的項(xiàng)，只需提供3個(gè)參數(shù)：起始位置、要?jiǎng)h除的項(xiàng)數(shù)和要插入的項(xiàng)。插入的項(xiàng)不必與刪除的項(xiàng)數(shù)相等。splice(2,3,1,4) // 會(huì)從數(shù)組位置2刪除兩項(xiàng)，然后再從位置2的地方插入1和4
// 刪除 var values = [4,8,0,3,7]; var remove = values.splice(3,1); console.log(values); // [ 4, 8, 0, 7 ] console.log(remove); // [ 3 ] 刪除第四項(xiàng) // 插入 remove = values.splice(2,0,1,2); console.log(values); // [ 4, 8, 1, 2, 0, 7 ] console.log(remove); // [] 從位置2開始插入兩項(xiàng)，由于沒有刪除所有返回空函數(shù) // 替換 remove = values.splice(2,2,6,9,10); console.log(values); // [ 4, 8, 6, 9, 10, 0, 7 ] console.log(remove); // [ 1, 2 ] 從位置2開始刪除兩項(xiàng)，同時(shí)插入三項(xiàng)
以上就是javascript數(shù)組有哪些操作方法，小編相信有部分知識點(diǎn)可能是我們?nèi)粘９ぷ鲿?huì)見到或用到的。希望你能通過這篇文章學(xué)到更多知識。更多詳情敬請關(guān)注創(chuàng)新互聯(lián)行業(yè)資訊頻道。
