JS系列 · 数组(一)

302 阅读4分钟

概念

数组: 将多个元素按照一定顺序排列放到一个集合中,那么这个集合称之为数组。

特性: 数组是一组有序数据的集合。 数组内部可以存放多个数据,数组的元素可以为任何类型的数据(包括数组,函数等)。 并且数组的长度可以动态调整。

类型

数组的类型: object

数组是一种特殊类型的对象。在 JavaScript 中对数组使用 typeof 运算符会返回 "object"

声明

数组的定义:创建数组 最简单的方式就是数组字面量方式。

数组的字面量:[]

将数组的字面量赋值给一个变量,方便后期对数组进行操作。

数组中数据存放在 [] 内部,如果需要存放多个数据,数据之间用 , 隔开。最后一个数据之后不需要加逗号。

创建数组

方法一

语法:

var array-name = [item1, item2, ...];

创建空数组

    // 创建空数组
    var arr = [];

创建数组

    // 创建数组
    var arr = [1, 2, 3, 4, 5];

数组内部可以空格和折行。声明可以横跨多行。

    // 可以换行
    var arr = [
        1, 2,
        3, 4, 5
    ];

数组的元素可以为任何类型的数据

    // 数组中可以存放任意类型的数据
    var arr = [1, "string", true, null, undefined, [1, 2, 3]];

方法二

使用 JavaScript 关键词 new

    // 使用 new 关键字创建数组
    var cars = new Array("Saab", "Volvo", "BMW");
    console.log(cars);

以上两个例子效果完全一样。无需使用 new Array()

出于简洁、可读性和执行速度的考虑,请使用第一种方法(数组文本方法)。


访问数组

数组可以通过 index下标索引值)获取数组中对应的某一项数据,也可以更改某一项的值。

index: 数组的索引是从0开始,按照正整数顺序排序:0,1,2,3,4···

调用数据: 使用变量名加 [index] 方式。 array-name[index]


    var arr2 = [1, "string", true, null, undefined, [1, 2, 3]];
    // 通过下标index为 2 获取数组中具体的某一项数据
    console.log(arr2[2]); // true

访问第一项数组元素


    var arr3 = ["Banana", "Orange", "Apple", "Mango"];
    // 访问第一项数组元素
    console.log(arr3[0]); // Banana

访问最后一项数组元素

数组的长度与数组下标存在关系。数组最后一项的下标 等于数组的长度减 1 length - 1

    var arr3 = ["Banana", "Orange", "Apple", "Mango"];
    // 访问最后一项数组元素
    console.log(arr3[arr3.length - 1]); // Mango

注意: 如果索引值超过数组最大项,相当于这一项没有赋值,内部储存的就是 undefined

    // 当下标超过索引值,返回undefined
    console.log(arr2[8]); // undefined

更改数组数据

更改数据:

使用下标 array-name[index] 调用这一项数据,后面等号 = 赋值更改数据。

    // 更改数组中某一项数据
    var arr2 = [1, "string", true, null, undefined, [1, 2, 3]];
    arr2[1] = "hahaha";
    console.log(arr2);

    // 控制台输出
    [1, "hahaha", true, null, undefined, Array(3)]

获取数组长度

数组有一个length属性,属性返回数组的长度(数组元素的数目)。

语法:

    array-name.length

实例:

    var arr2 = [1, "string", true, null, undefined, [1, 2, 3]];

    // 获取数组长度
    console.log(arr2.length); // 6

更改数组长度

增加数组长度:

  1. 使用length属性。直接给数组length属性赋一个大于原长度length的值。array-name.length = new-length;

  2. 使用下标赋值。给大于最大下标的项赋值,也可以强制拉长数组。

缩短数组长度:

  • 强制给length属性赋小于原数组length的值

缩短数组长度,数据不可逆:

  • 强制缩短length属性,后面数据会直接删除,删除的数据不可逆。

实例:

    // 方法一:给数组length属性赋一个大于原长度的值
    var arr5 = ["aaa",2,3,4,5,6];
    arr5.length = 10;
    console.log(arr5.length); // 10
    
    // 方法二:给大于原数组length属性赋值
    arr5[8] = "haha";
    console.log(arr5[8]); // haha

    // 如果数组拉长原数组的长度,拉长部分下标元素未进行赋值返回 undefined
    console.log(arr5[7]); // undefined
    // 访问原数组
    console.log(arr5);
    // 访问原数组,控制台返回
    (9) ["aaa", 2, 3, 4, 5, 6, empty × 2, 8]
        0: "aaa"
        1: 2
        2: 3
        length: 6


    // 数组数据不可逆
    // 数组强制缩短,原数据删除,数据不可逆
    arr5.length = 3;
    console.log(arr5[6]); // undefined
    // 测试原数组下标数据,数据已被删除
    arr5.length = 6;
    console.log(arr5[6]); // undefined

遍历数组

概念: 对数组的每一项元素都访问一次叫做遍历。

实现: 使用for循环,根据下标在 0arr.length-1之间,进行for循环遍历。

实例:

    var arr = [2, 65, 5, 86, 98, 12, 35, 66, 86];
    // 利用 for 循环,根据索引获取数组每一项元素
    for (var i = 0; i <= arr.length - 1; i++) {
        console.log(arr[i]);
    }