數(shù)組總共有22種方法咽白，本文將其分為對(duì)象繼承方法、數(shù)組轉(zhuǎn)換方法鸟缕、棧和隊(duì)列方法晶框、數(shù)組排序方法、數(shù)組拼接方法懂从、創(chuàng)建子數(shù)組方法授段、數(shù)組刪改方法、數(shù)組位置方法番甩、數(shù)組歸并方法和數(shù)組迭代方法共10類來(lái)進(jìn)行詳細(xì)介紹

對(duì)象繼承方法

數(shù)組是一種特殊的對(duì)象畴蒲，繼承了對(duì)象Object的toString()、toLocaleString()和valueOf()方法 【toString()】toString()方法返回由數(shù)組中每個(gè)值的字符串形式拼接而成的一個(gè)以逗號(hào)分隔的字符串 [注意]該方法的返回值與不使用任何參數(shù)調(diào)用join()方法返回的字符串相同

[1,2,3].toString();//'1,2,3'
['a','b','c'].toString();//'a,b,c'
[1,[2,'c']].toString();//'1,2,c'

由于alert()要接收字符串參數(shù)对室，它會(huì)在后臺(tái)調(diào)用toString()方法模燥，會(huì)得到與toString()方法相同的結(jié)果

alert([1,2,3]);//'1,2,3'

【toLocaleString()】toLocaleString()是toString()方法的本地化版本，它經(jīng)常也會(huì)返回與toString()方法相同的值掩宜，但也不總是如此蔫骂。因?yàn)椋{(diào)用元素的是toLocaleString()方法將每個(gè)數(shù)組元素轉(zhuǎn)化為字符串

var person1 = {
    toLocaleString: function(){
        return 'Nikolaos';
    },
    toString: function(){
        return 'Nicholas';
    }
};
var person2 = {
    toLocaleString: function(){
        return 'Grigorios';
    },
    toString: function(){
        return 'Greg';
    }
};
var people = [person1,person2];
console.log(people.toString());//'Nicholas,Greg'
console.log(people.toLocaleString());//'Nikolaos,Grigorios'

如果數(shù)組中的某一項(xiàng)的值是null或者undefined牺汤，則該值在toLocaleString()和toString()方法返回的結(jié)果中以空字符串表示

var colors = [1,undefined,2,null,3];
console.log(colors.toString());//'1,,2,,3'
console.log(colors.toLocaleString());//'1,,2,,3'

【valueOf()】valueOf()方法返回?cái)?shù)組對(duì)象本身

var a = [1, 2, 3];
console.log(a.valueOf());// [1, 2, 3]
console.log(a.valueOf() instanceof Array);//true

數(shù)組轉(zhuǎn)換方法

【join()】Array.join()方法是String.split()方法的逆向操作辽旋，后者是將字符串分割成若干塊來(lái)創(chuàng)建一個(gè)數(shù)組 數(shù)組繼承的toLocaleString()和toString()方法，在默認(rèn)情況下都會(huì)以逗號(hào)分隔的字符形式返回?cái)?shù)組項(xiàng)檐迟；而join()方法可以使用不同的分隔符來(lái)構(gòu)建這個(gè)字符串补胚，join()方法只接收一個(gè)參數(shù)，用作分隔符的字符串追迟，然后返回包含所有數(shù)組項(xiàng)的字符串 如果不給join()方法傳入任何值溶其，則使用逗號(hào)作為分隔符

var a = [1,2,3];
console.log(a.join());//'1,2,3'
console.log(a.join(' '));//'1 2 3'
console.log(a.join(''));//'123'

var b = new Array(10);
b.join('-');//'---------'，9個(gè)連字符組成的字符串

若join()方法的參數(shù)是undefined敦间，標(biāo)準(zhǔn)瀏覽器以逗號(hào)為分隔符返回字符串瓶逃，而IE7-瀏覽器以’undefined’為分隔符返回字符串

//標(biāo)準(zhǔn)瀏覽器為'1,2,3';IE7-瀏覽器為'1undefined2undefined3'
var a = [1,2,3];
console.log(a.join(undefined));

如果數(shù)組中的某一項(xiàng)的值是null或者undefined，則該值在join()方法返回的結(jié)果中以空字符串表示

var colors = [1,undefined,2,null,3];
console.log(colors.join());//'1,,2,,3'

該方法也可以用于類數(shù)組對(duì)象上

console.log(Array.prototype.join.call('hello', '-'));// "h-e-l-l-o"
var obj = { 0: 'a', 1: 'b', length: 2 };
console.log(Array.prototype.join.call(obj, '-'));// 'a-b'

[注意]若對(duì)象沒(méi)有l(wèi)ength屬性廓块，就不是類數(shù)組厢绝，也就不能調(diào)用數(shù)組的方法

var obj = { 0: 'a', 1: 'b' };
console.log(typeof Array.prototype.join.call(obj, '-'));//''

棧和隊(duì)列方法

push()和pop()方法允許將數(shù)組當(dāng)作棧來(lái)使用。unshift()和shift()方法的行為非常類似于push()和pop()带猴，不一樣的是前者是在數(shù)組的頭部而非尾部進(jìn)行元素的插入和刪除操作

棧是一種LIFO(Last-First-Out昔汉，后進(jìn)先出)的數(shù)據(jù)結(jié)構(gòu)，也就是最新添加的項(xiàng)最早被移除拴清。而棧中項(xiàng)的插入(叫做推入)和移除(叫做彈出)靶病，只發(fā)生在一個(gè)位置——棧的頂部。javascript為數(shù)組專門提供了push()和pop()方法贷掖，以便實(shí)現(xiàn)類似棧的行為

隊(duì)列數(shù)據(jù)結(jié)構(gòu)的訪問(wèn)規(guī)則是FIFO(first-in-first-out嫡秕，先進(jìn)先出)。隊(duì)列在列表的末端添加項(xiàng)苹威，從列表的前端移除項(xiàng)昆咽。結(jié)合使用shift()和push()方法，可以像使用隊(duì)列一樣使用數(shù)組

【push()】

push()方法可以接收任意數(shù)量的參數(shù)牙甫，把它們逐個(gè)添加到數(shù)組末尾掷酗，并返回修改后數(shù)組的長(zhǎng)度。所以窟哺，該數(shù)組會(huì)改變?cè)瓟?shù)組

var a = [];
console.log(a,a.push(1));//[1] 1
console.log(a,a.push('a'));//[1,'a'] 2
console.log(a,a.push(true, {}));//[1,'a',true,{}] 4
console.log(a,a.push([5,6]));//[1,'a',true,{},[5,6]] 5

如果需要合并兩個(gè)數(shù)組泻轰，可以使用apply方法

var a = [1, 2, 3];
var b = [4, 5, 6];
console.log(a,Array.prototype.push.apply(a, b));//[1,2,3,4,5,6] 6

[注意]如果使用call方法，則會(huì)把數(shù)組b整體看成一個(gè)參數(shù)

var a = [1, 2, 3];
var b = [4, 5, 6];
console.log(a,Array.prototype.push.call(a, b));//[1,2,3,[4,5,6]] 4

push()方法也可以向?qū)ο笾刑砑釉厍夜欤砑雍蟮膶?duì)象變成類數(shù)組對(duì)象浮声，即新加入元素的鍵對(duì)應(yīng)數(shù)組的索引虚婿，并且對(duì)象有一個(gè)length屬性

var obj = {a: 1};
console.log(obj,[].push.call(obj, 2));// {a:1, 0:2, length: 1}
console.log(obj,[].push.call(obj, [3]));// {a:1, 0:2, 1:[3], length: 2}

【pop()】

pop()方法從數(shù)組末尾移除最后一項(xiàng)，減少數(shù)組的length值泳挥，然后返回移除的項(xiàng)然痊。所以，該數(shù)組會(huì)改變?cè)瓟?shù)組

var a = ['a', 'b', 'c'];
console.log(a,a.pop()); // ['a', 'b'] 'c'

對(duì)空數(shù)組使用pop()方法屉符，不會(huì)報(bào)錯(cuò)剧浸，而是返回undefined

var a = [];
console.log(a,a.pop()); // [] undefined

【shift()】

shift()方法移除數(shù)組中的第一個(gè)項(xiàng)并返回該項(xiàng)，同時(shí)數(shù)組的長(zhǎng)度減1矗钟。所以唆香，該數(shù)組會(huì)改變?cè)瓟?shù)組

var a = ['a', 'b', 'c'];
console.log(a,a.shift());//['b', 'c'] 'a'

對(duì)空數(shù)組使用shift()方法，不會(huì)報(bào)錯(cuò)吨艇，而是返回undefined

var a = [];
console.log(a,a.shift());// [] undefined

【unshift()】

unshift()方法在數(shù)組前端添加任意個(gè)項(xiàng)并返回新數(shù)組長(zhǎng)度躬它。所以，該數(shù)組會(huì)改變?cè)瓟?shù)組

var a = ['a', 'b', 'c'];
console.log(a,a.unshift('x')); //['x', 'a', 'b', 'c'] 4

當(dāng)使用多個(gè)參數(shù)調(diào)用unshift()時(shí)秸应，參數(shù)是一次性插入的而非一次一個(gè)地插入虑凛。這意味著最終的數(shù)組中插入的元素的順序和它們?cè)趨?shù)列表中的順序一致

var a = ['a', 'b', 'c'];
console.log(a,a.unshift('x','y','z')); //['x','y','z','a', 'b', 'c'] 6

[注意]在IE7-瀏覽器中，unshift()方法返回的總是undefined

//標(biāo)準(zhǔn)瀏覽器下软啼，返回[1] 1桑谍；而IE7-瀏覽器下，返回[1] undefined
var a = [];
console.log(a,a.unshift(1));

數(shù)組排序方法

數(shù)組中存在兩個(gè)可以直接用來(lái)重排序的方法: reverse()和sort()

【reverse()】

reverse()方法用于反轉(zhuǎn)數(shù)組的順序祸挪，返回經(jīng)過(guò)排序之后的數(shù)組锣披；而原數(shù)組順序也發(fā)生改變

var array = [1,2,4,3,5];
console.log(array,array.reverse());//[5,3,4,2,1] [5,3,4,2,1]
var array = ['str',true,3];
console.log(array,array.reverse());//[3,true,'str'] [3,true,'str']

【sort()】

默認(rèn)情況下，sort()方法按字符串升序排列數(shù)組項(xiàng)贿条，sort方法會(huì)調(diào)用每個(gè)數(shù)組項(xiàng)的toString()方法雹仿，然后比較得到的字符串排序，返回經(jīng)過(guò)排序之后的數(shù)組整以，而原數(shù)組順序也發(fā)生改變

var array = [1,2,4,3,5];
console.log(array,array.sort());//[1,2,3,4,5] [1,2,3,4,5]
var array = ['3str',3,2,'2'];
console.log(array,array.sort());//[2, "2", 3, "3str"] [2, "2", 3, "3str"]
var array = [1,5,10,50];
console.log(array,array.sort());//[1, 10, 5, 50] [1, 10, 5, 50]

如果數(shù)組包含undefined元素胧辽，它們會(huì)被排到數(shù)組的尾部

var array = ['3',3,undefined,2,'2'];
console.log(array,array.sort());//["2", 2, "3", 3, undefined] ["2", 2, "3", 3, undefined]

sort()方法可以接受一個(gè)比較函數(shù)作為參數(shù)，以便指定哪個(gè)值在哪個(gè)值的前面公黑。比較函數(shù)接收兩個(gè)參數(shù)邑商，如果第一個(gè)參數(shù)應(yīng)該位于第二個(gè)參數(shù)之前則返回一個(gè)負(fù)數(shù)，如果兩個(gè)參數(shù)相等則返回0凡蚜，如果第一個(gè)參數(shù)應(yīng)該位于第二個(gè)參數(shù)之后則返回一個(gè)正數(shù)

function compare(value1,value2){
    if(value1 < value2){
        return -1;
    }else if(value1 > value2){
        return 1;
    }else{
        return 0;
    }
}
var array = ['5px',50,1,10];
//當(dāng)數(shù)字與字符串比較大小時(shí)人断，字符串'5px'會(huì)被轉(zhuǎn)換成NaN，這樣結(jié)果就是false
console.log(array.sort(compare));//["5px",1, 10, 50]

對(duì)于數(shù)值類型或valueOf()方法會(huì)返回?cái)?shù)值類型的對(duì)象類型朝蜘，比較函數(shù)可以簡(jiǎn)化

function compare(value1,value2){
    return value1 - value2;
}
var array = ['5px',50,1,10];
console.log(array.sort(compare));//["5px",1,10,50]
var array = [5,50,1,10];
console.log(array.sort(compare));//[1,5,10,50]

如果對(duì)一個(gè)字符串?dāng)?shù)組執(zhí)行不區(qū)分大小寫的字母表排序恶迈，比較函數(shù)首先將參數(shù)轉(zhuǎn)化為小寫字符串再開(kāi)始比較

a = ['ant','Bug','cat','Dog'];
a.sort();//['Bug','Dog','ant','cat'];
a.sort(function(s,t){
    var a = s.toLowerCase();
    var b = t.toLowerCase();
    if(a < b)return -1;
    if(a > b)return 1;
    return 0;
});//['ant','bug','cat','dog']

【tips】使用sort()方法創(chuàng)建一個(gè)隨機(jī)數(shù)組

function compare(){
    return Math.random() - 0.5;
}
var array = [1,2,3,4,5];
console.log(array.sort(compare));//[2,1,5,4,3]

數(shù)組拼接方法

【concat()】

concat()方法基于當(dāng)前數(shù)組中的所有項(xiàng)創(chuàng)建一個(gè)新數(shù)組，先創(chuàng)建當(dāng)前數(shù)組一個(gè)副本谱醇，然后將接收到的參數(shù)添加到這個(gè)副本的末尾暇仲，最后返回新構(gòu)建的數(shù)組步做。所以concat()不影響原數(shù)組

如果不給concat()方法傳遞參數(shù)時(shí)，它只是復(fù)制當(dāng)前的數(shù)組奈附；如果參數(shù)是一個(gè)或多個(gè)數(shù)組辆床，則該方法會(huì)將這些數(shù)組中的每一項(xiàng)都添加到結(jié)果數(shù)組中；如果傳遞的值不是數(shù)組桅狠，這些值就會(huì)被簡(jiǎn)單地添加到結(jié)果數(shù)組的末尾

var numbers = [1,2];
console.log(numbers,numbers.concat(3,4));//[1,2] [1,2,3,4]
console.log(numbers,numbers.concat([5,4,3],[3,4,5],1,2));//[1,2] [1,2,5,4,3,3,4,5,1,2]
console.log(numbers,numbers.concat(4,[5,[6,7]]));//[1,2] [1,2,4,5,[6,7]]

如果不提供參數(shù)，concat()方法返回當(dāng)前數(shù)組的一個(gè)淺拷貝轿秧。所謂“淺拷貝”中跌，指的是如果數(shù)組成員包括復(fù)合類型的值（比如對(duì)象），則新數(shù)組拷貝的是該值的引用

//該方法實(shí)際只復(fù)制了數(shù)組的第一維菇篡，數(shù)組第一維存放的是第二維的引用漩符，而第二維才是實(shí)際存放他們的內(nèi)容

var numbers = [1,2];
var newNumbers = numbers.concat();
console.log(numbers,newNumbers);//[1,2] [1,2]
numbers[0] = 0;
console.log(numbers,newNumbers);//[0,2] [1,2]

var numbers = [[1,2]];
var newNumbers = numbers.concat();
console.log(numbers,newNumbers);//[[1,2]] [[1,2]]
numbers[0][0] = 0;
console.log(numbers,newNumbers);//[[0,2]] [[0,2]]

concat()方法也可以用于將對(duì)象合并為數(shù)組，但是必須借助call()方法

var newArray = Array.prototype.concat.call({ a: 1 }, { b: 2 })
console.log(newArray);// [{ a: 1 }, { b: 2 }]
console.log(newArray[0].a);//1

創(chuàng)建子數(shù)組方法

** 【slice()】**

slice()方法基于當(dāng)前數(shù)組中的一個(gè)或多個(gè)項(xiàng)創(chuàng)建一個(gè)新數(shù)組驱还，接受一個(gè)或兩個(gè)參數(shù)嗜暴，即要返回項(xiàng)的起始和結(jié)束位置，最后返回新數(shù)組议蟆，所以slice()不影響原數(shù)組

slice(start,end)方法需要兩個(gè)參數(shù)start和end闷沥，返回這個(gè)數(shù)組中從start位置到(但不包含)end位置的一個(gè)子數(shù)組；如果end為undefined或不存在咐容，則返回從start位置到數(shù)組結(jié)尾的所有項(xiàng)

如果start是負(fù)數(shù)舆逃，則start = max(length + start,0)

如果end是負(fù)數(shù)，則end = max(length + end,0)

start和end無(wú)法交換位置

如果沒(méi)有參數(shù)戳粒，則返回原數(shù)組

var numbers = [1,2,3,4,5];
console.log(numbers.slice(2));//[3,4,5]
console.log(numbers.slice(2,undefined));//[3,4,5]
console.log(numbers.slice(2,3));//[3]
console.log(numbers.slice(2,1));//[]

console.log(numbers.slice(-3));//-3+5=2 -> [3,4,5]
console.log(numbers.slice(-8));//max(5 + -8,0)=0 -> [1,2,3,4,5]

console.log(numbers.slice(0,-3));//-3+5=2 -> [1,2]
console.log(numbers.slice(-2,-1));//-2+5=3;-1+5=4; -> [4]

如果不提供參數(shù)路狮，slice()方法返回當(dāng)前數(shù)組的一個(gè)淺拷貝

//該方法實(shí)際只復(fù)制了數(shù)組的第一維，數(shù)組第一維存放的是第二維的引用蔚约，而第二維才是實(shí)際存放他們的內(nèi)容

var numbers = [1,2];
var newNumbers = numbers.slice();
console.log(numbers,newNumbers);//[1,2] [1,2]
numbers[0] = 0;
console.log(numbers,newNumbers);//[0,2] [1,2]

var numbers = [[1,2]];
var newNumbers = numbers.slice();
console.log(numbers,newNumbers);//[[1,2]] [[1,2]]
numbers[0][0] = 0;
console.log(numbers,newNumbers);//[[0,2]] [[0,2]]

slice()方法涉及到Number()轉(zhuǎn)型函數(shù)的隱式類型轉(zhuǎn)換奄妨，當(dāng)start被轉(zhuǎn)換為NaN時(shí)，相當(dāng)于start = 0苹祟；當(dāng)end被轉(zhuǎn)換為NaN時(shí)(end為undefined除外)砸抛，則輸出空數(shù)組

var numbers = [1,2,3,4,5];
console.log(numbers.slice(NaN));//[1,2,3,4,5]
console.log(numbers.slice(0,NaN));//[]
console.log(numbers.slice(true,[3]));//[2,3]
console.log(numbers.slice(null,undefined));//[1,2,3,4,5]
console.log(numbers.slice({}));//[1,2,3,4,5]
console.log(numbers.slice('2',[5]));//[3,4,5]

可以使用slice()方法將類數(shù)組對(duì)象變成真正的數(shù)組

var arr = Array.prototype.slice.call(arrayLike);

Array.prototype.slice.call({ 0: 'a', 1: 'b', length: 2 })// ['a', 'b']
Array.prototype.slice.call(document.querySelectorAll("div"));
Array.prototype.slice.call(arguments);

數(shù)組刪改方法

【splice()】

splice()和slice()擁有非常相似的名字，但它們的功能卻有本質(zhì)的區(qū)別苔咪。splice()方法用于刪除原數(shù)組的一部分成員锰悼，并可以在被刪除的位置添加入新的數(shù)組成員，該方法會(huì)改變?cè)瓟?shù)組

splice()返回一個(gè)由刪除元素組成的數(shù)組团赏，或者如果沒(méi)有刪除元素就返回一個(gè)空數(shù)組

splice()的第一個(gè)參數(shù)start指定了插入或刪除的起始位置箕般。如果start是負(fù)數(shù)，則start = max(length + start,0)舔清；如果start是NaN丝里，則相當(dāng)于start = 0

如果只提供一個(gè)元素曲初，相當(dāng)于將原數(shù)組在指定位置拆分成兩個(gè)數(shù)組

var a = [1,2,3,4,5,6,7,8];
console.log(a,a.splice());// [1,2,3,4,5,6,7,8] []
var a = [1,2,3,4,5,6,7,8];
console.log(a,a.splice(4));// [1,2,3,4] [5,6,7,8]
var a = [1,2,3,4,5,6,7,8];
console.log(a,a.splice(-4));//-4+8=4; [1,2,3,4] [5,6,7,8]
var a = [1,2,3,4,5,6,7,8];
console.log(a,a.splice(-9));//max(-9+8,0)=0 [] [1,2,3,4,5,6,7,8]
var a = [1,2,3,4,5,6,7,8];
console.log(a,a.splice(NaN));//[] [1,2,3,4,5,6,7,8]

第二個(gè)參數(shù)number指定了應(yīng)該從數(shù)組中刪除的元素的個(gè)數(shù)。如果省略第二個(gè)參數(shù)杯聚，從起始點(diǎn)開(kāi)始到數(shù)組結(jié)尾的所有元素都將被刪除臼婆。如果number是負(fù)數(shù)或NaN或undefined，則number=0幌绍，因此不刪除元素

var a = [1,2,3,4,5,6,7,8];
console.log(a,a.splice(0,2));// [3,4,5,6,7,8] [1,2]
var a = [1,2,3,4,5,6,7,8];
console.log(a,a.splice(10,2));// [1,2,3,4,5,6,7,8] []
var a = [1,2,3,4,5,6,7,8];
console.log(a,a.splice(1,100));// [1] [2,3,4,5,6,7,8]
var a = [1,2,3,4,5,6,7,8];
console.log(a,a.splice(1,-5));//[1,2,3,4,5,6,7,8] []
var a = [1,2,3,4,5,6,7,8];
console.log(a,a.splice(1,NaN));//[1,2,3,4,5,6,7,8] []
var a = [1,2,3,4,5,6,7,8];
console.log(a,a.splice(1,undefined));//[1,2,3,4,5,6,7,8] []

如果后面還有更多的參數(shù)颁褂，則表示這些就是要被插入數(shù)組的新元素

var a = [1,2,3,4,5];
console.log(a,a.splice(2,0,'a','b'));//[1,2,'a','b',3,4,5] []
console.log(a,a.splice(2,2,[1,2],3));//[1,2,[1,2],3,3,4,5] ['a','b']

數(shù)組位置方法

ES5為數(shù)組實(shí)例添加了兩個(gè)位置方法：indexOf()、lastIndexOf()

【indexOf()】

indexOf(search,start)方法接收search和start兩個(gè)參數(shù)傀广，返回search首次出現(xiàn)的位置颁独，如果沒(méi)有找到則返回-1

search參數(shù)表示要搜索的項(xiàng)；使用嚴(yán)格相等運(yùn)算符（===）進(jìn)行比較

var arr = [1,2,3,'1','2','3'];
console.log(arr.indexOf('2'));//4
console.log(arr.indexOf(3));//2
console.log(arr.indexOf(0));//-1

start參數(shù)表示該搜索的開(kāi)始位置伪冰，該方法會(huì)隱式調(diào)用Number()轉(zhuǎn)型函數(shù)誓酒，將start非數(shù)字值(undefined除外)轉(zhuǎn)換為數(shù)字。若忽略該參數(shù)或該參數(shù)為undefined或NaN時(shí)贮聂，start = 0

var arr = ['a','b','c','d','e','a','b'];
console.log(arr.indexOf('a',undefined));//0
console.log(arr.indexOf('a',NaN));//0
console.log(arr.indexOf('a',1));//5
console.log(arr.indexOf('a',true));//5
console.log(arr.indexOf('a',-1));//max(0,-1+7)=6; -1
console.log(arr.indexOf('a',-5));//max(0,-5+7)=2; 5
console.log(arr.indexOf('a',-50));//max(0,-50+7)=0; 0
var person = {name: 'Nicholas'};
var people = [{name: 'Nicholas'}];
var morePeople = [person];
alert(people.indexOf(person));//-1,因?yàn)閜erson和people[0]雖然值相同靠柑，但是是兩個(gè)引用
alert(morePeople.indexOf(person));//0，因?yàn)閜erson和morepeople[0]是同一個(gè)引用
alert(morePeople.indexOf({name: 'Nicholas'}));//-1,因?yàn)椴皇峭粋€(gè)引用
indexOf()方法兼容寫法

if (typeof Array.prototype.indexOf != "function") {
  Array.prototype.indexOf = function (searchElement, fromIndex) {
    var index = -1;
    fromIndex = fromIndex * 1 || 0;
    for (var k = 0, length = this.length; k < length; k++) {
      if (k >= fromIndex && this[k] === searchElement) {
          index = k;
          break;
      }
    }
    return index;
  };
}

【lastIndexOf()】

與indexOf()不同吓懈，lastIndexOf()從右向左查找

lastIndexOf(search,start)方法接收search和start兩個(gè)參數(shù)歼冰，返回search第一次出現(xiàn)的位置，如果沒(méi)有找到則返回-1

search參數(shù)表示要搜索的項(xiàng)骄瓣；使用嚴(yán)格相等運(yùn)算符（===）進(jìn)行比較

var arr = [1,2,3,'1','2','3'];
console.log(arr.lastIndexOf('2'));//4
console.log(arr.lastIndexOf(3));//2
console.log(arr.lastIndexOf(0));//-1
start表示該搜索的開(kāi)始位置停巷，該方法會(huì)隱式調(diào)用Number()轉(zhuǎn)型函數(shù)，將start非數(shù)字值(undefined除外)轉(zhuǎn)換為數(shù)榕栏。若忽略該參數(shù)或該參數(shù)為undefined或NaN時(shí)畔勤，start = 0

與字符串的lastIndexOf()方法不同，當(dāng)search方法為負(fù)數(shù)時(shí)扒磁，search = max(0,length+search)

var arr = ['a','b','c','d','e','a','b'];
console.log(arr.lastIndexOf('b'));//6
console.log(arr.lastIndexOf('b',undefined));//-1
console.log(arr.lastIndexOf('a',undefined));//0
console.log(arr.lastIndexOf('b',NaN));//-1
console.log(arr.lastIndexOf('b',1));//1
console.log(arr.lastIndexOf('b',-1));//max(0,-1+7)=6; 6
console.log(arr.lastIndexOf('b',-5));//max(0,-5+7)=2; 1
console.log(arr.lastIndexOf('b',-50));//max(0,-50+7)=0; -1

【tips】返回滿足條件的項(xiàng)的所有索引值

可以通過(guò)循環(huán)調(diào)用indexOf()或lastIndexOf()來(lái)找到所有匹配的項(xiàng)

function allIndexOf(array,value){
    var result = [];
    var pos = array.indexOf(value);
    if(pos === -1){
        return -1;
    }
    while(pos > -1){
        result.push(pos);
        pos = array.indexOf(value,pos+1);
    }
    return result;
}
var array = [1,2,3,3,2,1];
console.log(allIndexOf(array,1));//[0,5]

lastIndexOf()方法兼容寫法

if (typeof Array.prototype.lastIndexOf != "function") {
  Array.prototype.lastIndexOf = function (searchElement, fromIndex) {
    var index = -1, length = this.length;
    fromIndex = fromIndex * 1 || length - 1;
    for (var k = length - 1; k > -1; k-=1) {
        if (k <= fromIndex && this[k] === searchElement) {
            index = k;
            break;
        }
    }
    return index;
  };
}

數(shù)組歸并方法

數(shù)組歸并方法包括reduce()和reduceRight()方法兩種庆揪，它們使用指定的函數(shù)將數(shù)組元素進(jìn)行組合，生成單個(gè)值妨托。這在函數(shù)式編程中是常見(jiàn)的操作缸榛，也可以稱為“注入”和“折疊”

【reduce()】

reduce()方法需要兩個(gè)參數(shù)。第一個(gè)是執(zhí)行化簡(jiǎn)操作的函數(shù)兰伤∧诳牛化簡(jiǎn)函數(shù)的任務(wù)就是用某種方法把兩個(gè)值組合或化簡(jiǎn)為一個(gè)值，并返回化簡(jiǎn)后的值

化簡(jiǎn)函數(shù)接受四個(gè)參數(shù)敦腔，分別是：

【1】初始變量均澳，默認(rèn)為數(shù)組的第一個(gè)元素值。函數(shù)第一次執(zhí)行后的返回值作為函數(shù)第二次執(zhí)行的初始變量，依次類推

【2】當(dāng)前變量找前，如果指定了第二個(gè)參數(shù)糟袁，則該變量為數(shù)組的第一個(gè)元素的值，否則躺盛，為第二個(gè)元素的值

【3】當(dāng)前變量對(duì)應(yīng)的元素在數(shù)組中的索引(從0開(kāi)始)

【4】原數(shù)組對(duì)象

化簡(jiǎn)函數(shù)的這四個(gè)參數(shù)之中项戴，只有前兩個(gè)是必須的，后兩個(gè)則是可選的

values.reduce(function(prev, cur, index, array){
   //todo
});

reduce()方法第二個(gè)(可選)的參數(shù)是一個(gè)傳遞給函數(shù)的初始值

var a = [1,2,3,4,5];
var sum = a.reduce(function(x,y){return x+y},0);//數(shù)組求和
var product = a.reduce(function(x,y){return x*y},1);//數(shù)組求積
var max = a.reduce(function(x,y){return (x>y)?x:y;});//求最大值
[1, 2, 3, 4, 5].reduce(function(prev, cur){
    console.log(prev, cur)
    return prev+ cur;
});
// 1 2
// 3 3
// 6 4
// 10 5
//最后結(jié)果：15
[1, 2, 3, 4, 5].reduce(function(prev, cur){
    console.log(prev, cur);
    return prev + cur;
},0);
// 0 1
// 1 2
// 3 3
// 6 4
// 10 5
//最后結(jié)果：15

[注意]reduce()方法的返回結(jié)果類型和傳入的初始值相同

[1, 2, 3, 4, 5].reduce(function(prev, cur){
    console.log(prev.sum, cur);
    prev.sum = prev.sum + cur;
    return prev;
},{sum:0});
//0 1
//1 2
//3 3
//6 4
//10 5
//Object {sum: 15}

利用reduce()方法槽惫，可以寫一個(gè)數(shù)組求和的sum方法

Array.prototype.sum = function (){
    return this.reduce(function (prev, cur){
        return prev + cur;
    })
};
[3,4,5,6,10].sum();// 28

由于reduce方法依次處理每個(gè)元素周叮，所以實(shí)際上還可以用它來(lái)搜索某個(gè)元素。比如界斜，找出長(zhǎng)度最長(zhǎng)的數(shù)組元素

function findLongest(entries) {
  return entries.reduce(function (prev, cur) {
    return cur.length > prev.length ? cur : prev;
  }, '');
}
console.log(findLongest([1,2,3,'ab',4,'bcd',5,6785,4]));//'bcd'

可以利用reduce()方法则吟，實(shí)現(xiàn)二維數(shù)組的扁平化

var matrix = [
  [1, 2],
  [3, 4],
  [5, 6]
];
// 二維數(shù)組扁平化
var flatten = matrix.reduce(function (prev, cur) {
  return prev.concat(cur);
});
console.log(flatten); // [1, 2, 3, 4, 5, 6]

在空數(shù)組上，不帶初始值參數(shù)調(diào)用reduce()將導(dǎo)致類型錯(cuò)誤異常锄蹂。如果調(diào)用它的時(shí)候只有一個(gè)值——數(shù)組只有一個(gè)元素并且沒(méi)有指定初始值，或者有一個(gè)空數(shù)組并且指定一個(gè)初始值——reduce()只是簡(jiǎn)單地返回那個(gè)值而不會(huì)調(diào)用化簡(jiǎn)函數(shù)

var arr = [];
arr.reduce(function(){});//Uncaught TypeError: Reduce of empty array with no initial value

var arr = [];
arr.reduce(function(){},1);//1

reduce()方法兼容寫法

if (typeof Array.prototype.reduce != "function") {
  Array.prototype.reduce = function (callback, initialValue ) {
     var previous = initialValue, k = 0, length = this.length;
     if (typeof initialValue === "undefined") {
        previous = this[0];
        k = 1;
     }
    if (typeof callback === "function") {
      for (k; k < length; k++) {
         this.hasOwnProperty(k) && (previous = callback(previous, this[k], k, this));
      }
    }
    return previous;
  };
}

【reduceRight()】

reduceRight()的工作原理和reduce()一樣水慨，不同的是它按照數(shù)組索引從高到低（從右到左）處理數(shù)組得糜，而不是從低到高

var values = [1,2,3,4,5];
var sum = values.reduceRight(function(prev, cur, index, array){
    console.log(prev,cur);
    return prev + cur;
});
console.log(sum);
//5 4
//9 3
//12 2
//14 1
//15

reduceRight()方法兼容寫法

if (typeof Array.prototype.reduceRight != "function") {
  Array.prototype.reduceRight = function (callback, initialValue ) {
    var length = this.length, k = length - 1, previous = initialValue;
    if (typeof initialValue === "undefined") {
        previous = this[length - 1];
        k--;
    }
    if (typeof callback === "function") {
       for (k; k > -1; k-=1) {          
          this.hasOwnProperty(k) && (previous = callback(previous, this[k], k, this));
       }
    }
    return previous;
  };
}

數(shù)組迭代方法

ECMAScript5為數(shù)組定義了5個(gè)迭代方法。每個(gè)方法都接收兩個(gè)參數(shù)：要在每一項(xiàng)上運(yùn)行的函數(shù)和（可選的）運(yùn)行該函數(shù)的作用域?qū)ο蟆绊憈his的值晰洒。傳入這些方法中的函數(shù)會(huì)接收三個(gè)參數(shù)：數(shù)組項(xiàng)的值朝抖、該項(xiàng)在數(shù)組中的位置和數(shù)組對(duì)象本身。根據(jù)使用的方法不同谍珊，這個(gè)函數(shù)執(zhí)行后的返回值可能會(huì)也可能不會(huì)影響訪問(wèn)的返回值

function(item,index,array){
    //todo
}

【map()】

map()方法對(duì)數(shù)組的每一項(xiàng)運(yùn)行給定函數(shù)治宣，返回每次函數(shù)調(diào)用的結(jié)果組成的數(shù)組

//f是array的每一個(gè)元素調(diào)用的函數(shù)。它的返回值成為返回?cái)?shù)組的元素砌滞；o是f調(diào)用時(shí)的可選this值

array.map(f,o);
[1,2,3].map(function(item,index,arr){return item*item});//[1,4,9]
[1,2,3].map(function(item,index,arr){return item*index});//[0,2,6]

map()方法還可以接受第二個(gè)參數(shù)侮邀，表示回調(diào)函數(shù)執(zhí)行時(shí)this所指向的對(duì)象

var arr = ['a','b','c'];
[1,2].map(function(item,index,arr){return this[item]},arr);//['b','c']

在實(shí)際使用的時(shí)候，可以利用map()方法方便獲得對(duì)象數(shù)組中的特定屬性值

var users = [{name:'t1',email:'t1@qq.com'},{name:'t2',email:'t2@qq.com'},{name:'t3',email:'t3@qq.com'}];
console.log(users.map(function(item,index,arr){return item.email}));//["t1@qq.com", "t2@qq.com", "t3@qq.com"]

map()方法還可以用于類數(shù)組對(duì)象

Array.prototype.map.call('abc',function(item,index,arr){return item.toUpperCase()});//["A", "B", "C"]

對(duì)于稀疏數(shù)組贝润，map()方法不會(huì)在實(shí)際上不存在元素的序號(hào)上調(diào)用函數(shù)

var a = [1,,3];
console.log(a.map(function(item,index,arr){return item*2;}));//[2, 2: 6]

map()方法兼容寫法

if (typeof Array.prototype.map != "function") {
  Array.prototype.map = function (fn, context) {
    var arr = [];
    if (typeof fn === "function") {
      for (var k = 0, length = this.length; k < length; k++) {      
         arr.push(fn.call(context, this[k], k, this));
      }
    }
    return arr;
  };
}

【forEach()】

forEach()方法對(duì)數(shù)組中的每一項(xiàng)運(yùn)行給定函數(shù)绊茧，這個(gè)方法沒(méi)有返回值。本質(zhì)上與for循環(huán)迭代數(shù)組一樣打掘。如果需要有返回值华畏，一般使用map方法

[1,2,3,4].forEach(function(item,index,arr){
    console.log(item)
});
//1
//2
//3
//4

類似于如下的for循環(huán)

var array = [1, 2, 3, 4];
for (var k = 0, length = array.length; k < length; k++) {
    console.log(array[k]);
}

使用forEach()方法實(shí)現(xiàn)簡(jiǎn)單的加法

var sum = 0;
[1, 2, 3, 4].forEach(function (item, index, array) {
    sum += item;
});
console.log(sum);//10

forEach()方法除了接受一個(gè)必須的回調(diào)函數(shù)參數(shù)，第二個(gè)參數(shù)還可以接受一個(gè)可選的上下文參數(shù)(改變回調(diào)函數(shù)里面的this指向)

var out = [];
[1, 2, 3].forEach(function(elem){
  this.push(elem * elem);
}, out);
console.log(out);// [1, 4, 9]

第二個(gè)參數(shù)對(duì)于多層this非常有用尊蚁，因?yàn)槎鄬觮his通常指向是不一致的亡笑，可以使用forEach()方法的第二個(gè)參數(shù)固定this

var obj = {
  name: '張三',
  times: [1, 2, 3],
  print: function () {
  //該this指向obj
      console.log(this);
    this.times.forEach(function (n) {
    //該this指向window
      console.log(this);
    });
  }
};
obj.print();
var obj = {
  name: '張三',
  times: [1, 2, 3],
  print: function () {
  //該this指向obj
      console.log(this);
    this.times.forEach(function (n) {
    //該this同樣指向obj
      console.log(this);
    },this);
  }
};
obj.print();

forEach()循環(huán)可以用于類數(shù)組對(duì)象

var str = 'abc';
Array.prototype.forEach.call(str, function(item, index, array) {
  console.log( item + ':' + index);
});
//a:0
//b:1
//c:2

與for循環(huán)不同，對(duì)于稀疏數(shù)組横朋，forEach()方法不會(huì)在實(shí)際上不存在元素的序號(hào)上調(diào)用函數(shù)

var a = [1,2,3];
delete a[1];
for(var i = 0; i < a.length; i++){
    console.log(a[i]);
}
//1
//undefined
//3
a.forEach(function(item,index,arr){console.log(item)});
//1
//3

forEach()方法無(wú)法在所有元素都傳遞給調(diào)用的函數(shù)之前終止遍歷仑乌。也就是說(shuō)，沒(méi)有像for循環(huán)中使用的相應(yīng)的break語(yǔ)句。如果要提前終止绝骚，必須把forEach()方法放在一個(gè)try塊中耐版，并能拋出一個(gè)異常

for(var i = 0; i < 5; i++){
    if(i == 2) break;
}
console.log(i);//2
var a = [1,2,3,4,5];
console.log(a.forEach(function(item,index,arr){
    if(index == 2) break;//Uncaught SyntaxError: Illegal break statement
}));
var a = [1,2,3,4,5];
a.forEach(function(item,index,arr){
    try{
      if(item == 2) throw new Error;    
    }catch(e){
        console.log(item);
    }
});

forEach()方法兼容寫法

if(typeof Array.prototype.forEach != 'function'){
    Array.prototype.forEach = function(fn,context){
        for(var k = 0,length = this.length; k < length; k++){
            if(typeof fn === 'function' && Object.prototype.hasOwnProperty.call(this,k)){
                fn.call(context,this[k],k,this);
            }
        }
    }
}

【filter()】

filter()方法對(duì)數(shù)組中的每一項(xiàng)運(yùn)行給定函數(shù)，返回該函數(shù)會(huì)返回true的項(xiàng)組成的數(shù)組压汪。該方法常用于查詢符合條件的所有數(shù)組項(xiàng)

[1, 2, 3, 4, 5].filter(function (elem) {
  return (elem > 3);
});// [4, 5]    

[0, 1, 'a', false].filter(Boolean);// [1, "a"]

[1, 2, 3, 4, 5].filter(function (elem, index, arr) {
  return index % 2 === 0;
});// [1, 3, 5]

filter()方法還可以接受第二個(gè)參數(shù)粪牲，指定測(cè)試函數(shù)所在的上下文對(duì)象(this對(duì)象)

var Obj = function () {
  this.MAX = 3;
};
var myFilter = function (item) {
  if (item > this.MAX) {
    return true;
  }
};
var arr = [2, 8, 3, 4, 1, 3, 2, 9];
arr.filter(myFilter, new Obj());// [8, 4, 9]

filter()會(huì)跳過(guò)稀疏數(shù)組中缺少的元素，它的返回?cái)?shù)組總是稠密的止剖，所以可以壓縮稀疏數(shù)組的空缺

var a = [1,2,,,,3,,,,4];
console.log(a.length);//10
var dense = a.filter(function(){return true;})
console.log(dense,dense.length);//[1,2,3,4] 4

如果要壓縮空缺并刪除undefined和null元素腺阳，可以這樣使用filter()方法

var a = [1,2,,undefined,,3,,null,,4];
console.log(a.length);//10
var dense = a.filter(function(item){return item!= undefined;})
console.log(dense,dense.length);//[1,2,3,4] 4

filter()方法兼容寫法

if (typeof Array.prototype.filter != "function") {
  Array.prototype.filter = function (fn, context) {
    var arr = [];
    if (typeof fn === "function") {
       for (var k = 0, length = this.length; k < length; k++) {
          fn.call(context, this[k], k, this) && arr.push(this[k]);
       }
    }
    return arr;
  };
}

【some()】

some()方法對(duì)數(shù)組中的每一項(xiàng)運(yùn)行給定函數(shù)，如果該函數(shù)對(duì)任一項(xiàng)返回true穿香，則返回true亭引。并且當(dāng)且僅當(dāng)數(shù)值中的所有元素調(diào)用判定函數(shù)都返回false，它才返回false

a = [1,2,3,4,5];
a.some(function(elem, index, arr){return elem%2===0;})//true
a.some(isNaN);//false

在空數(shù)組上調(diào)用some()方法會(huì)返回false

[].some(function(){});//false

some()方法兼容寫法

if (typeof Array.prototype.some != "function") {
  Array.prototype.some = function (fn, context) {
    var passed = false;
    if (typeof fn === "function") {
         for (var k = 0, length = this.length; k < length; k++) {
          if (passed === true) break;
          passed = !!fn.call(context, this[k], k, this);
      }
    }
    return passed;
  };
}

【every()】

every()方法對(duì)數(shù)組中的每一項(xiàng)運(yùn)行給定函數(shù)皮获，如果該函數(shù)對(duì)每一項(xiàng)都返回true焙蚓，則返回true；只要有一項(xiàng)返回false洒宝，則返回false

a = [1,2,3,4,5];
a.every(function(elem, index, arr){elem < 10;})//true
a.every(function(elem, index, arr){return elem%2 ===0;});//false

在空數(shù)組上調(diào)用every()方法會(huì)返回true

[].every(function(){});//true

every()方法兼容寫法

if (typeof Array.prototype.every != "function") {
  Array.prototype.every = function (fn, context) {
    var passed = true;
    if (typeof fn === "function") {
       for (var k = 0, length = this.length; k < length; k++) {
          if (passed === false) break;
          passed = !!fn.call(context, this[k], k, this);
      }
    }
    return passed;
  };
}

總結(jié)

javascript數(shù)組方法特意定義為通用的购公，因此它們不僅應(yīng)用在真正的數(shù)組而且在類數(shù)組對(duì)象上都能正確工作。這22種方法中雁歌，除了toString()和toLocaleString()以外的所有方法都是通用的

可以改變?cè)瓟?shù)組的方法總共有7種：包括unshift()宏浩、shift()、push()靠瞎、pop()這4種棧和隊(duì)列方法比庄，reverse()和sort()這2種數(shù)組排列方法，數(shù)組刪改方法splice()