数组的方法

今天来总结一下数组的方法

valueOf()方法返回数组本身
toString()方法返回数组的每一项的字符串形式拼接而成以逗号隔开。
alert()要接收字符串参数，所以会调用toString()方法。
join()方法：使用不同的分隔符来构建这个字符串。

var color=["1","2","3"]
color.join("|")
"1|2|3"

• 栈方法

LIFO（后进先出），插入和移除全部在栈顶。
插入push(),向数组的末端添加项，接收任意数量的参数，返回当前数组的长度。
移除pop()，从数组末尾移除最后一项，放回移除的项。

• 队列方法

FIFO（先进先出），在列表的后端插入，前端移除。
前端移除shift()，移除数组的第一项并返回该项。
前端添加unshift()，在数组的前端添加项。

• 排序方法

反转数组项的顺序：reverse()
sort():sort()方法会调用每个数组项toString()的转型方法，然后比较得到的字符串。即使数组中的每一项都是数值，sort()方法比较的也是字符串。
若想用它来进行数字的升序降序排列，可以利用arr.sort(compare)，其中compare是自定义函数。
升序

function comapre(value1,value2){
if(value1<value2){
return -1;
}else if(value1>value2){
return 1;
}else{
return 0;
 }
}

对于数值类型或者valueOf()方法会返回数值类型的对象类型，可以使用更简单的比较函数：
function compare(value1,value2){
return value2-value1;
}

• 操作方法

concat()：该方法基于当前数组中的所有项新建一个当前数组的副本，然后将接收到的参数添加到数组末尾，返回新构建的数组。参数不一定是数组，也可以是其他类型的值，都会被添加到数组末尾。

var color=["1","2"];
var color2=color.concat(3,[4,"5"]);//["1", "2", 3, 4, "5"]

slice():基于当前数组的一个或多个项新建一个数组，该方法接受两个参数，要返回项的起始和结束位置，不会影响原始数组。
splice():该方法可以实现：
删除（传入两个参数，要删除的第一项和项数）；
插入（传入三个参数，起始项，要删除的项数（0），要插入的项）；
替换（传入三个参数，起始项，要删除的项数，要插入的热议数量项）。
注意：该方法返回的是数组中删除的项，如果没有删除返回空数组，并且会改变原数组。

var color=["red","yellow","blue"];
var removed=color.splice(0,1);
alert(color);//yellow,blue
alert(removed);//red

• 位置方法

indexOf()和lastindexOf()，返回要查找的项在数组中的位置。

• 迭代方法

每个方法都接收2个参数，要运行的函数和该函数的作用域对象，传入方法中的函数接收3个参数，即数组项的值，该项在数组中的位置及数组对象本身。
every():传入的函数对数组的每一项都返回true，则返回true。
some():传入的函数对数组的任一一项都返回true，则返回true。
filter():对数组中的每一项执行传入的函数，返回该函数会返回true的项。
map()：对数组中的每一项执行函数，并将每一项的返回结果组成数组。
forEach()：对数组中的每一项执行函数，该方法没有返回值。

var ages = [32, 33, 16, 40];

function checkAdult(age) {
    return age >= 18;
}

function myFunction() {
    document.getElementById("demo").innerHTML = ages.every(checkAdult);
}

<button onclick="numbers.forEach(myFunction)">点我</button>
<p id="demo"></p>
 
<script>
demoP = document.getElementById("demo");
var numbers = [4, 9, 16, 25];
 
function myFunction(item, index) {
    demoP.innerHTML = demoP.innerHTML + "index[" + index + "]: " + item + "<br>"; 
}
</script>

• 迭代方法

reduce()和reduceRight():
迭代数组的所有项，得到最终的返回值。

数组的扩展

• Array.from()

Array.from():将类似数组的对象和可遍历的对象转为真正的数组。

let arraylike={
"0":"a",
"1":"b",
"2":"c",
length:3
};

ES5写法：[].slice.call(arraylike);//["a","b","c"]
ES6写法：Array.from(arraylike);//["a","b","c"]
DOM操作返回的NodeList集合以及arguments对象也是类似数组的对象，可以用这两种方法将其转为真正的数组。

Array.from(document.querySelectorAll('p'))

• Array.of()

Array.of():将一组值转为数组。

Array.of(1,2,3);//[1,2,3]

数组赋值

在JS中，变量是值传递，而数组是引用传递。

举例如下：

//变量的赋值传递
var a = 2;    //变量
var b = a;
a = 3;
alert(b);    //结果b=2

//数组的赋值传递
var a = [1,2,3];    //数组
var b = a;
b [0] = 5;
alert(a);     //结果a=[5,2,3]

以上是比较常见的简单JS语法，但在面试时可能会遇到一些更加细腻并且容易出错的问题。

var a=[1,2,3]; //数组
var b=a;
a=[4,5,6]; //改变的是引用
alert(b);  //结果[1,2,3]

应该有很多同学会这样想：因为数组是引用类型，应该是传递的是引用，所以 b也是[4,5,6]，于是错了。正确答案是b=[1,2,3]。这是为什么吗？
首先强调一点概念：
数组名存放的内容是地址。
现在来详细的解读上面的程序：
var a= [1,2,3]; //定义一个数组并赋值，此时a 指向[1，2，3]数组对象。

var b = a; //因为a是数组名，表示的是地址。将a的地址付给b，此时b也指向[1,2,3]数组对象。
a = [4,5,6]; //此时a指向数组对象[4，5，6],改变的是a的指向对象，并没有改变[1,2,3]数组对象本身。
看到这里，之前有疑惑的同学应该豁然开朗了吧。，再补充一题让大家更充分的理解：

var a = [1,2,3];
var b = a;
a.pop(); //pop()方法 ：删除数组对象的最后一个元素  这里是直接改变的数组对象[1,2,3]
alert(b);  //结果b=[1,2]