JavaScript基础（5）—— 数组

不念不忘少年蓝@ 2021-10-01 07:00 343阅读 0赞

我们都知道typeof(Array)的计算值是object，在JavaScript中，数组一般是一组连续的索引和值，而对象往往是一组不确定的属性和值，他们的本质区别在于属性值是否连续（注意：数组元素也可以是不连续的，如稀疏数组）。在编程中，一组拥有连续索引值的对象有许多好处：首先在使用数组的时候用户无需关心属性名，因为索引值是连续自增的整数。其次，用户在访问数组的时候可以轻松实现遍历，这一点for循环就可以做到。而对于JavaScript引擎而言，数组对象在创建的时候会被分配一组连续的可扩展的内存，由于内存分配的连续性，数组能更快的完成索引，也就是说，数组往往比对象拥有更好的访问性能。

综上所述，数组是对象的一种特殊形式。那么为什么数组的概念，需要单独拎出来呐？个人认为：在任何编程语言中，数组都是不可或缺的数据类型之一，JavaScript也不例外，当我们使用数组直接量创建数组对象的时候，会从Array.prototype中继承很多有用的数组操作方法，这些操作方法让数组真正的和对象区别开来。

### 1.创建数组 ###

创建数组的方法主要有两种，一种是数组直接量，另外一种就是调用构造函数创建数组，如下

let arr = [] //创建一个空数组
    let arr2 = new Array(10) //第一个参数指定创建数组的长度，但是数组中没有存储值

需要注意的是，arr2只是一个指定长度的数组（arr.length :10），该数组中没有存储任何值，甚至数组的索引值都没有定义。

### 2.数组的读写 ###

数组的读写方式和对象的相同。需要注意的是以下几种特殊情况：

1.你不能通过点(.)运算符访问数组元素，因为整数值不能作为点运算符的计算值，因此我们需要通过方括号(\[\])访问数组元素。

2.数组的索引值一般从0开始，但并不是绝对的，a\[-1\] = 1会创建一个名为-1的属性值，尽量不要这样做。

3.数组作为对象，可以从原型中继承元素，数组可以定义元素的getter和setter方法。

### 3.稀疏数组 ###

稀疏数组就是数组的length属性大于元素的个数。可以直接通过构造函数来创建一个稀疏数组。

let arr = new Array(5) //创建一个length值为5，数组元素为0的元素

除了构造函数，对象直接量也可以完成稀疏数组的创建。

let a = []
    a[1000] = 0 //length为1001，但是只有一个元素

上面这两种方法比较常规，除此之外，你还可以用delete操作符来产生稀疏数组。这里不过多介绍。在创建稀疏数组的时候需要注意以下两种情况。

let arr1 = [,,,] // [undefined,undefined,undefined]
    let arr2 = new Array(3) // 该数组没有任何元素
    0 in arr1 //true
    0 in arr2 //false

### 4.数组的长度 ###

每个数组都有一个length属性，就是这个属性区别于常规的JavaScript对象。数组的length属性是支持手动设置的。

如果你设置数组的length属性值大于其当前的长度，那么它会在尾部创建一个空的区域。

如果你设置数组的length属性值小于其当前的长度，那么他会把那些索引值大于或等于n的元素从数组中删除。可以理解为，length就是数组的最大索引值，如果数组元素的索引值大于length值，那他将不能被索引到，也就是“被删除了”。

由于修改数组的length值会产生一些意想不到的情况，因此我们可以利用Object.defineProperty()让数组的length变成只读属性。

let arr = [1,2]
    Object.defineProperty(arr,'length',{writable:false})

### 5.数组的常用方法 ###

在文章的开头，我就提到了，数组和对象最大的区别就是，数组继承自Array.prototype,而对象继承自Object.prototype，数组从Array对象中继承了许多操作函数，下面我们先来罗列一下一些常用的函数，你可以在后面找到每种函数的具体用法和参数解释。

<-- 数组元素的添加 -->
    arr.push(val)   //在数组的尾部添加一个值，返回该元素，并修改数组本身
    arr.unshift(val)  //在数组的头部添加一个值，返回该元素，并修改数组本身
    arr.splice(1,0,2) //第一个参数指定了插入(删除)元素的起始位置，第二个参数指定了个数
    //第二个之后的参数数量为任意个，指定了需要插入到数组中的元素
    
    <-- 数组元素的删除 -->
    arr.pop() //删除数组的最后一个元素，返回该元素，并修改数组本身
    arr.shift() //删除数组头部的元素，返回该元素，并修改数组本身
    arr.splice(1,2) //表示删除元素的从第‘1’个开始，到第‘2’个结束,也就是删除了第二个和第三个元素
    arr.slice(2,3) //两个参数指截取数组开始和结束的字段，
    //如果第二个值是负整数，则代表倒数第几个元素，如果第二个值缺省，则代表到最后一个元素
    //该方法返回截取的片段，并且不会修改调用的数组
    
    <-- 数组元素的排序 -->
    arr.sort((a,b)=>{return (a-b)}) //默认按字母表顺序排，a-b从小到大排，b-a从大到小
    
    <-- 数组元素的遍历 -->
    arr.forEach((item)=>{}) //该方法会自动过滤掉空值
    arr.map((item)=>{return item+1}) //该方法会返回一个新的数组，并不会修改原数组
    arr.fiter((item)=>{return item!==1})//该方法会返回一个索引值符合回调函数判断的新数组
    
    <-- 数组元素的逻辑判定 --> 
    arr.every((item)=>{return item===1})//判定数组中的每个元素是否符合回调函数里的判断，返回一个布尔值，遇到false就终止循环
    arr.some((item)=>{return item===1})//判定数组中是否有元素符合回调函数里的判断，返回一个布尔值，遇到true就终止循环
    
    <-- 连接两个数组 -->
    arr.concat([1,2,3]) //该方法返回一个新数组，对原数组没有影响，所以需要一个新的数组接收值
    
    <-- 数组转字符串 -->
    arr.join('/') //括号内指定元素之间的分隔符，默认是逗号，该方法是String.split()的逆向操作
    
    <-- 数组元素倒序 -->
    arr.reverse() //该方法把数组中的元素颠倒，如果面试考这个，可以直接写
    
    <-- 数组元素的组合 -->
    arr.reduce((total,current)=>{
        return total+current
    },0)
    //reduce本意是缩小，减少，却经常被拿来做加法运算，后面我会详细介绍这个方法
    
    <-- 数组元素的查询 -->
    arr.find((item)=>{return item===1}) //查找到第一个符合条件的值，并返回该值
    arr.indexOf((item)=>{return item===1}) //查找到第一个符合条件的值，并返回索引值