Javascript中的数组

数组的作用

 var arr = [23, 32, 4, 56, 176, 887, 9, 0, 54];

使用数组中的值 数组[下标] 或者 数组[索引]
数组.length表示数组的长度

for循环最最常用的用途就是循环数组

for (var i = 0; i < arr.length; i++) {
    console.log(arr[i])
}

一，数组的方法（es5之前）

数组的方法指的是数组本身具备的一些功能性函数
可以实现一些不同的功能
数组的基本操作 头增、头删、尾增、尾删

1.头增方法 unshift

unshift头增的主要功能：向数组的头部增加1个或者多个成员 返回值是数组的长度 会改变原数组

var arr = ["4"];
var length = arr.unshift("aaaaa4", "4", "55", "66");
console.log(length)//5
console.log(arr)//(5) ["aaaaa4", "4", "55", "66", "4"]

2.头删方法 shift

它不需要参数 默认从数组的头部移除一项 会改变原数组 返回值是被移除的项

    var arr = [0,1,2,3,4,5]
    var arr1 = arr.shift()
    console.log(arr)//[1, 2, 3, 4, 5]
    console.log(arr1) //0

3.尾增方法push

push 的主要功能： 向数组的尾部增加一个或多个成员 返回值是数组的长度 会改变原数组

var length1 = arr.push(1, 2, 3);
console.log(length1);   

4.尾删方法pop

它不需要参数 默认从数组的尾部移除一项 会改变原数组 返回值是被移除的项

var result1 = arr.pop();  
console.log(result1);

5.concat 合并 ，

不会改变原数组

var arr = [0,1,2,3,4,5]
var arr1 = arr.concat ("a,b,c",66)
console.log(arr)//[0, 1, 2, 3, 4, 5]
console.log(arr1)//[0, 1, 2, 3, 4, 5, "a,b,c", 66]

6.slice 截取

第一种用法：接收两个参数 第一个表示截取的开始 第二个表示截取的结束 不包含第二个位置的成员

var arr1 = arr.slice(-3, 7);

第二种用法： 接收1个参数 该参数表示截取的开始 默认截取到末尾 该参数也可以是负数

var arr2 = arr.slice(-5);

第三种用法： 不接受参数 表示整个数组都复制

var arr3 = arr.slice();

7.splice 操作

用于操作数组：增加、删除、替换
第一个参数表示操作位置 第二个参数表示删除几项数组成员 第三个参数包括往后的参数表示新增的成员
当只有第一个参数的时候 表示从该位置开始删除 删除到最后
不加参数，全部都删除

var arr = [1, 2, 3, 4, 5, 6, 7];
var arr1 = arr.splice(2, 2, 8, 9); // 把3和 4 删掉 替换为8 9
var arr1 = arr.splice(4); 

8.sort 排序

9.reverse 逆序

var arr = [4, 45, 456,2, 1, 12,  23, 123, 234];
arr.reverse();
console.log(arr);//[234, 123, 23, 12, 1, 2, 456, 45, 4]

10.indexOf 查找

该方法接收一个参数 返回该参数在数组中的下标顺序 如果找得到 就返回下标数字 如果找不到 则返回 -1，用全等

var arr = ["a", "b", "c", "小沈阳", "d"];
var idx = arr.indexOf("小沈阳");
var idx1 = arr.indexOf("小沈阳2");
console.log("小沈阳在数组中排名第" + idx);// 3
console.log("小沈阳2在数组中排名第" + idx1);// -1

11.join 转为字符串

join方法接收一个参数 表示间隔符号 返回值是以该间隔符号作为拼接符号组成的一个字符串 参数默认为","

12.toString 转为字符串 不需要参数

当作默认的join即可

二，数组的方法（es5新增）

所有的方法都分两种：静态方法、普通方法

静态方法：构造函数所具备的方法
var arr = new Array();
Array.xxx() 这就是一个静态方法
普通方法：数组、对象等对象具备的方法
arr.xxx() 这就是普通方法
ES5中增加的数组静态方法

1.Array.isArray(target)判断对象是不是数组

    var obj = {
        a: 1,
        b: {
            c: 1
        },
        d: {
            e: {
                f: {
                    
                }
            }
        }
    }

    var arr = [1, 2, 3, 4];

    function deepCopy(target) {
        // 定义一个变量
        var copyTarget = null;
        // 因为当前函数既能够要复制对象也要能够复制数组 所以先判定target是对象还是数组
        if (Array.isArray(target)) {
            copyTarget = [];
            for (var i = 0; i < target.length; i++) {
                if (typeof target[i] === "object" && target[i] != null) {
                    copyTarget[i] = deepCopy(target[i])
                } else {
                    copyTarget[i] = target[i];
                }
            }
        } else {
            copyTarget = {};
            for (var i in target) {
                if (typeof target[i] === "object" && target[i] != null) {
                    copyTarget[i] = deepCopy(target[i])
                } else {
                    copyTarget[i] = target[i];
                }
            }
        }
        return copyTarget
    }

在定义一个变量时，如果暂时无法确定类型 要给一个初始值
推荐的写法： 如果该变量 将来要存储的是数字 则初始化为0 如果是字符串 则初始化为空字符串 如果初始化为布尔值 则false 如果是引用类型 则null

2.，arr.forEach()，该方法是迭代器（循环）

接收一个函数作为参数 该函数有3个形参
函数会执行数组的长度次
第一个参数是数组的成员
第二个参数是数组的索引
第三个参数是数组本身

	var arr = ["a", "b", "c", "d"];
    arr.forEach(function(value, index, arr) {
        console.log(value, index, arr, this)
    }, {a: 1});

this返回的是{a: 1}这个对象

3.arr.map() 该方法是一个映射方法 会根据原数组生成一个新数组

  var arr = ["a", "b", "c", "d"];
    var arr1 = arr.map(function(value, index, arr) {
        return value + 1;
    });
    console.log(arr1);

4.arr.filter() 该方法用于过滤数组 会根据条件过滤

接收一个函数作为参数 如果该函数在执行的过程中返回真 则对应的元素会被过滤到一个新数组中

var arr = ["2019", "2020", "2021", "1999", "1978"];
// 将成员中带1的过滤出来 形成新数组
var arr1 = arr.filter(function(value) {
    return value.indexOf("1") != -1 ;
});
console.log(arr1);

5.arr.some()

断言方法 参数是函数 会根据函数的条件进行判定 函数也会执行多次 当函数的返回值为真 停止循环 并some返回真 如果循环结束都为假 some才返回假

var arr = [45, 67, 99, 444, 43, 567];
var bool = arr.some(function(value) {
    return value < 44;
});
console.log(bool)

6.arr.every() 断言方法

参数是函数 会根据函数的条件进行判定 函数也会执行多次 当函数的返回值为真 才会进行下一次循环 一旦函数返回值为假 停止循环 every的结果为false 函数的每一次结果都为真时 every的结果为true

   var arr = [45, 67, 99, 444, 43, 567]
   var bool = arr.every(function(value) {
       return typeof value === "number";
   })
   console.log(bool);
        

7.arr.fill() 填充方法

参数是3个值 第一个参数表示 要填充的成员 第二个参数表示填充的起始位置(默认值为0) 第三个参数表示填充的结束位置(默认值为数组的长度)

var arr = [1, 2, 3, 4, 5, 6, 7, 8, 9];
arr.fill("good", 3, 7);
arr.fill("good", 3);
arr.fill(5);
//该方法会改变原数组

8.arr.reduce() 循环方法

参数是一个函数 函数有4个参数 1 上一次的函数返回值 2 成员 3 索引 4 原数组 循环次数为数组的长度-1次
reduce的返回值是 最后一次的函数返回值

   var arr = [45, 67, 99, 444, 43, 567];
   var result = arr.reduce(function(prev, value) {
       console.log(prev, value)
       return prev + value;
   });
   console.log(result);

9.arr.reduceRight()

与reduce的区别就是 reduce是从左向右循环 本方法是从右向左循环

   var arr = [45, 67, 99, 444, 43, 567];
   var result = arr.reduceRight(function(prev, value) {
       console.log(prev, value)
       return prev + value;
   });
   console.log(result);

三，数组的方法（es6新增）

数组在ES6中增加了3个普通方法

1.find

接收一个函数作为参数
该函数有3个形参
第一个是成员
第二个是下标
第三个是原数组
该函数返回值如果为真 则find方法返回对应的成员
如果循环结束 没有任何一个成员符合条件 则find方法返回undefined

let arr = ["东邪", "西毒", "南帝", "北丐", "中神通"];
let item = arr.find(function (value, index, arr) {
    return value.length === 4;
});

2.findIndex

与find使用方式一致 如果有符合条件的成员 则返回该成员的下标 如果没有 则返回 -1

let arr = ["东邪", "西毒", "南帝", "北丐", "中神通"];
let idx = arr.findIndex(function (value, index, arr) {
    return value.length === 2;
});
console.log(idx)

3.copyWithin

接收3个参数 第一个表示粘贴的开始位置 第二个表示复制的开始位置 第三个表示复制的结束位置(不包含该位置)
该函数的作用： 从第二个参数位置开始复制 复制到第三个参数位置 将复制的内容替换到第一个参数位置 并依次向后替换
该方法会改变原数组 但是不会改变原数组的长度

let arr = [1, 2, 3, 4, 5, 6, 7, 8, 9];
arr.copyWithin(8, 1, 7)

4.静态方法Array.of 该方法用于创建数组

该方法用于创建数组
它解决了 new Array时 传递一个参数并且是数字时所产生的问题

let arr = new Array(4);
let arr1 = Array.of(4);
console.log(arr);
console.log(arr1);

5.Array.from 该方法用于将类数组对象(伪数组)

var obj = {
    0: 1,
    1: 2,
    2: 3,
    length: 3
}
let arr = Array.from(obj);
console.log(arr);