js 数组常用方法

零碎知识点：
① 当给子元素设置了绝对或者固定定位且父元素设置了overflow:hidden，若不给父元素设置高/宽，会出现子元素隐藏的现象
② 火狐浏览器只有在页面加载完成后，才可以获取到offsetHeight

一、 数组的常用方法

1. 定义数组

1. 除数字外其余赋值都为新建分组的第一个值，且该分组的长度为1（eg:var arr = new Array("{"id":1}")//arr的长度为1，且索引为0的元素为{"id":1}）
2. 数组实际上继承于object类，故其类型为object类型。因此可以给数组的元素赋任意类型的值

定义	说明
var arr = new Array(1)	代表生成的arr数组的长度为1
var arr = new Array(1,2)	代表生成的arr数组的长度为2，且有两个元素
var arr = new Array("1")	代表生成的arr数组的长度为1，且有一个元素，该元素为"1"

①
②

2. 合并数组:arr.concat(arr2)——>返回新数组，不改变原数组

var a=[1,2,3,4]
var b=["1","2","3"]
a.concat(b);//结果为：[1,2,3,4,"1","2","3"]

3. 数组的过滤：arr.filter(function(val,index,arr){})——>返回新数组，不改变原数组,有返回值，可对每个元素执行操作

① 该方法的参数为一个回调函数，该方法执行的结果是回调函数筛选后的返回值拼凑起来的新数组。
② 当回调函数的返回值为index/val/arr时，filter方法的执行结果都为相关val拼凑起来的新数组
③ 如果在回调函数中没有进行条件筛选，若返回val/arr，则结果为数组本身，若返回index,则会过滤到索引0对应的数

/*对元素进行操作*/
var arr = [1,2,3,4]
function e(val,index,arr){
	if(val%2==0){
	return arr;//return index或return val
}
}
/*也可通过arr[index]获取到val*/
function e  (val,index,arr) {
        if (arr[index] % 2 == 0) {
            return val;//无论是返回val index还是arr，结果都为[2,4]
        }
console.log(arr.filter(e));//上述三种返回结果都为[2,4]

/*不能对数组本身进行操作*/
var a=[1,2,3,4]
function e  (val,index,arr) {
        arr[index] = -val;
        return arr；
    }
    console.log(a.filter(e));//结果依旧为arr本身:[1,2,3,4]
    console.log(a);//[-1.,-2,-3,-4]

4. 数组的遍历:arr.forEach(function(val,index,arr){})——>无返回值，改变原数组，可在回调函数中对数组直接进行处理。、

无论回调函数有没有返回值，打印出a.forEach的结果都为undefined

var a=[1,2,3,4]
 console.log(a.forEach(function (val, index, arr) {
        arr[index] = -arr[index];
    }));
    console.log(a);//[-1,-2,-3,-4]

5. 遍历数组，并映射成一个新的数组：arr.map(function(val,index,arr){})——>有返回值，是否改变原数组与回调函数对谁操作有关

① map方法每次遍历都会得到一个值，而不是在遍历完arr后再赋值的
② map方法的执行结果为回调函数每一次遍历所得值所组成得新数组。（如果返回index，则最终结果是由index组成得新数组，类似的，返回数组，结果是数组组成得新数组）
③ map方法对各个元素进行操作，不改变数组
④ map方法对数组进行操作，改变数组

 var  a=[6,4,3,4];
 var b=a.map(function (val, index, arr) {
            // return val*val;//相当于将每个元素都翻倍
        if(index==0){
            val = 9;
        }else{
            val = arr[index-1]
        }
        return val;
    })
    console.log(b,a);// [9, 6, 4, 3]     [6, 4, 3, 4]

 var  a=[6,4,3,4];;
 var b = a.map(function(val,index,arr){
	 arr[index] = -arr[index]
        return val;
})
console.log(b,a);//[6, 4, 3, 4] [-6, -4, -3, -4]

6. 累加器：arr.reduce(function(total,current,index){},default)——>有返回值，对原数组不改变

① total初始值为arr数组索引为0对应得值/default
② current代表当前值，index代表当前索引（index和current是相配的）

 console.log(b.reduce(function (totle, current, index) {
        console.log(totle,current);
        return totle *= current;
    },3));//当给函数传入初始值时，total便为初始值，不再是数组索引0对应的值

reduce和map

① map函数是将传入的函数依次作用域序列的每个元素，每个元素都是独自被函数处理的
② reduce函数是将传入的函数作用再序列的第一个元素得到结果后，把这个结果继续与下一个元素作用。

7. 数组的截取：arr.slice(startIndex,endIndex)——>截取startIndex-endIndex-1,对原数组不影响

var  a=[6,4,3,4];;
console.log(a.slice(1, 3));//[4,3]
    console.log(a);//[6,4,3,4]

8. 数组的截断:arr.splice(startIndex,num)——>从startIndex开始，截断num个元素，最终数组变为截断后其余元素组成的数组

splice方法的执行结果为截断部分组成的数组，与阶段后的原数组不同

var  a=[6,4,3,4];;
	 console.log(a.splice(0, 3));//[6,3,4]
    console.log(a);//[4]

9. 数组的追加：arr.push(ele)——>向后追加；arr.unshift(ele)——>向前追加

返回结果为数组的长度

var  a=[6,4,3,4];;
console.log(a.push(9);)//5
   console.log(a);//[6,4,3,4,9]
a.unshift(2);
console.log(a);//[2,6,4,3,4,9]

10. 数组的删除：arr.shift()——>删除第一个元素；arr.pop()——>删除最后一个元素

返回结果为删除的值

var  a=[6,4,3,4];;
console.log(a.pop);//4
console.log(a);//[6,4,3]
a.shift();
console.log(a);//[4,3]

11. 翻转数组:arr.reverse() ——>对原数组有影响

12. 排序：arr.sort(function(n1,n2)(return n1-n2))=arr.sort()——>默认为从小到大，对原数组有影响

从大到小排：arr.sort(function(n1,n2){return n2-n1})

var  a=[6,4,3,4];
arr.sort();//[3,4,4,6]
arr.sort(function(n1,n2{return n2-n1}));//[6,4,4,3]

13. 检测数组：arr.some(function(val,inedx,arr){})——>返回值为true/false

var b=[1,2,3,4]
 console.log(b.some(function (val, index, arr) {
        return val == 1;
    }));//true