javascript数组

约定不等于承诺〃 2022-09-08 00:11 173阅读 0赞

### 文章目录 ###

*  数组
 *   *   *   *   *  使用字面量创建数组
         *  添加元素
         *  删除
         *  数组的提取slice
         *  数组连接的方法
         *   *   *  concat方法
                 *  join方法
         *  reverse数组翻转
         *  数组遍历
         *   *   *  循环+下标
                 *  forEach
                 *  map()
         *  filter()过滤
         *  reduce()
         *  排序sort()
         *  二维数组

# 数组 #

数组：内置对象中的一种

作用：用来存储一组数据， 解决多个数据存储的问题

数组添加数据：数组中添加的数据也被称为数组中的原始

语法： var 变量 = new Array();

使用typeof检查数据类型时， 返回object，说明数组也是一种对象

普通对象使用属性名来操作数据，数组使用下标索引来操作数据

数组也可以理解为带下标索引的对象

索引：习惯上我们从0开始操作数据

数组名称(数组标识符)\[索引\] = 值;

访问数组中的数据：数组标识符\[下标\]

我们大多数时候都是操作数组中的元素，不操作数组本身

如果读取不存在的下标，js不会报错，输出undefined。

数组的length

1.  对于连续数组，使用length可以获取数组元素的个数，length是数组对象的属性。
2.  对于非连续数组，使用length-1可以获取数组下标的最大值
3.  数组的大小可以动态变化
4.  非连续数组，下标没有对应的数据，为undefined，浪费资源，尽量少创建。

如果修改数组的length大于原来的长度，则添加空元素补齐长度个数。

如果修改数组的length小于原来的长度，则删除超出设置长度的数据。

##### 使用字面量创建数组 #####

//使用字面量创建数组
    var arr = [];
    console.log(typeof arr); //object
            
    //创建数组同时添加元素
    var arr2 = [10,20,30,40];
    console.log(arr2);//[10,20,30,40]

### 添加元素 ###

1.  push
    
    数组的末尾添加一个或多个元素
    
    返回新数组的长度
2.  unshift
    
    数组的开头添加一个或多个元素
    
    返回新数组的长度
    
    元素会动态调整索引位置

### 删除 ###

1.  pop()

删除数组中最后一个元素

返回删除的元素

数组的大小变化

1.  shift()
    
    删除数组中开头的元素
    
    返回删除的元素
    
    数组的大小变化， 会动态调整数组下标
2.  splice()

参数：

*  传递一个参数
    
    如果是0，表示全部删除，
    
    如果非0，表示保留元素个数，从下标0开始。
 *  传递两个参数
    
    删除效果
    
    第一个参数：开始的下标
    
    第二个参数：删除的个数
 *  传递三个以上参数
    
    替换
    
    第一个参数：开始的下标
    
    第二个参数：删除的个数
    
    之后的参数：添加的数据
    
    如果前两个参数为0，则只添加

arr.splice(0,1,"tom-x","tom-y");

### 数组的提取slice ###

从数组中提取指定的元素

参数：

start：开始位置下标。

end：结束位置下标。

半闭半开区间，左闭右开。

原数组不变，提取的元素放入新数组中，即便是提取一个元素也放入数组中。

end下标可以省略，表示从开始到结束。

end下标可以为负值，则表示结束下标从后向前计数。

var arr = ["tom-01","tom-02","tom-03","tom-04","tom-05"];
    
    //获取数组中的前两个元素
    var res = arr(0,2);//从下标0开始，到下标为2结束。
    console.log(arr);//原数组不变
    console.log(res);//返回提取的元素，放入新数组中。
    
    res = arr.slice(3);//从下标3开始到结束
    res = arr.slice(1,-2);//从以开始，到数组结束向前两个元素结束

### 数组连接的方法 ###

##### concat方法 #####

var arr = ["tom-01","tom-02","tom-03"];
    var arr2 = ["tom-x","tom-y","tom-z"];
    var arr3 = ["a","b","c"];
    //连接两个或多个数组，并返回新数组，原数组没影响
    var newArr = arr.concat(arr2,arr3);
    console.log(newArr);
    newArr = arr.concat(arr2,"ABC","xyz");//连接多个数组+字符串

##### join方法 #####

将数组中的元素使用指定的连接符进行连接，并以字符串的形式返回，该方式对原数组没影响。

默认使用逗号作为连接符号，也可指定字符串作为参数，参数为连接符号

var arr = ["tom-01","tom-02","tom-03"];
    var res = arr.join();
    console.log(res);

### reverse数组翻转 ###

reverse()翻转数组中的元素

原数组中的元素位置会被改变

var arr = ["tom-01","tom-02","tom-03"];
    arr.reverse();
    console.log(arr);

### 数组遍历 ###

##### 循环+下标 #####

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

##### forEach #####

遍历数组中的元素或下标

forEach需要调用自定义函数，参数就是我们传递的自定义函数

自定义函数调用的次数等于数组中元素的个数（非undefined）

forEach执行过程中会自动给自定义函数的参数赋值

形参含义：value，第一个位置，数组中的元素

index，第二个位置，数组的下标

arr，数组的本身

核心功能为遍历

arr.forEach(function(value,index,arr){
        
        console.log(value + "----" + index + "-----" + arr);
    });
    //数组元素的length = function函数执行的次数

##### map() #####

通过制定的函数处理数组中的每一个元素，并返回处理的结果

需要传递自定义函数

map调用自定义函数的次数等于元素的个数

核心：遍历数组中的每一个元素，根据逻辑进行加工处理后并返回

var arr = [1,2,3,4,5,6];
    var res = arr.map(function(value,index){
        
        console.log(value,index);
        return value*2
    })
    console.log(res);//2,4,6,8,10,12

### filter()过滤 ###

根据自定义函数，过滤数组中的元素，返回新的数组，原数组不变

条件为true元素返回，false元素过滤

var arr = [10,11,12,13,14,15,16];
    var res arr.filter(function(){
        
        return value % 2 == 0;
    })//10,12,14，16

### reduce() ###

total:初始值为数组中的第一个元素，其余为每次return返回的值

value：每执行一次，放入非第一个元素的所有值

返回return的结果

var arr = [10,11,12,13,14,15,16];
    res = arr.reduce(function(total,value){
        
        return total + value;
    })

### 排序sort() ###

对原数组进行排序，默认按照unicode编码进行排序

即使使用数字也会使用unicode编码进行排序，因此数字排序不准确

var arr = ['a','c','d','b'];
    arr.sort();
    console.log(arr);//["a","b","c","d"]

如果想倒叙，可以先排序再反转

sort使用自定义排序规则，可以指定一个函数来设置排序规则。

var a = ['3','4'];
    arr.sort(function(){
        
        
    })

### 二维数组 ###

二位数组可以理解为数组中的元素也是一个数组。

var arr = [
        [3,8,5],
        [2,6],
        [2,1,3,5]
    ];
    console.log(arr.length);//3
    console.log(arr[1].length);//2

遍历二维数组

var str = '';
    for (var i = 0 ; i < arr.length; i++){
        
        for(var j = 0 ; j< arr[i].length; i++){
        
            str += arr[i][j] + "\t";
        }
        str += "\n";
    }
    cosnole.log(str);