JavaScript 数组

JavaScript 数组

目标

• 能够知道为什么要有数组
• 能够创建数组
• 能够获取数组中的元素
• 能够对数组进行遍历
• 能够给数组新增一个元素
• 能够独立完成冒泡排序的案例

目录

• 数组的概念
• 创建数组
• 获取数组中的元素
• 遍历数组
• 数组中新增元素
• 数组案例

1. 数组的概念

问：之前学习的变量，只能存储一个值，如果我们想存储班级中所有学生的姓名，那么该如何存储呢？

答：可以使用数组（Array）。数组可以把一组相关的数据一起存放，并提供方便的访问（获取）方式。

问：什么是数组呢？

答：数组是指一组数据的集合，其中的每个数据都被称作元素，在数组中可以存放任意类型的元素，数组是一种将一组数据存储在单个变量名下的优雅方式。

2. 创建数组

2.1 数组的创建方式

JS 创建数组有两种方式：

• 利用 new 创建数组
• 利用数组字面量创建数组

2.2 利用 new 创建数组

      var 数组名 = new Array();
      var arr = new Array(); // 创建一个新的空数组

• 这种方式暂且了解，等学完对象再看
• 注意 Array(), A 要大写

2.3 利用数组字面量创建数组

    <script>
      // 1. 使用数组字面量方式创建空的数组
      var 数组名 = [];
      // 2. 使用数组字面量方式创建带初始值的数组
      var 数组名 = ["小白", "小黑", "大黄", "瑞奇"];
    </script>

• 数组的字面量是方括号 []
• 声明数组并赋值称为数组的初始化
• 这种字面量方式也是我们以后最多使用的方式

2.4 数组元素的类型

数组中可以存放任意类型的数据，例如：字符串、数字、布尔值等。

    <script>
      var arrStus = ["小白", 12, true, 23.4];
    </script>

3. 获取数组元素

3.1 数组的索引

索引（下标）：用来访问数组元素的序号（数组下标从 0 开始）。

    <script>
      var arr = ["小白", "小黑", "大黄", "瑞奇"];
      // 索引号:    0       1      2       3
    </script>

数组可以通过索引来访问、设置、修改对应的数组元素，我们可以通过 “数组名[索引]” 的形式来获取数组中的元素。

这里的访问就是获取得到的意思。

    <script>
      // 定义数组
      var arr = ["小白", "小黑", "大黄", "瑞奇"];
      // 获取数组中的第 2 个元素
      console.log(arr[2]); // 大黄
    </script>

4. 遍历数组

问：数组中的每一项我们怎么取出来？

答：可以通过 “数组名[索引号]” 的方式一项项的取出来。

    <script>
      var arr = ["red", "green", "blue"];
      console.log(arr[0]); // red
      console.log(arr[1]); // green
      console.log(arr[2]); // blue
    </script>

问：怎么把数组里面的元素全部取出来？

规律：

从代码中我们可以发现，从数组中取出每一个元素时，代码是重复的，有所不一样的是索引值在递增

答案就是 循环

遍历：就是把数组中的每个元素从头到尾都访问一次（类似我们每天早上学生的点名）。

    <script>
      // 遍历数组：就是把数组的元素从头到尾访问一次
      var arr =