JS入门-数组

数组是什么？

数组：(Array)是一种可以按顺序保存数据的数据类型

使用场景：如果有多个数据可以用数组保存起来，然后放到一个变量中，管理非常方便

数组的基本使用

定义数组和数组单元

<script>
  // 1. 语法，使用 [] 来定义一个空数组
  // 定义一个空数组，然后赋值给变量 classes
  // let classes = [];

  // 2. 定义非空数组
  let classes = ['1', '2', '3', '4', '5']
</script>

通过 [] 定义数组，数据中可以存放真正的数据，如字符串1，2，3，4，5等这些都是数组中的数据，我们这些数据称为数组单元，数组单元之间使用英文逗号分隔。

访问数组和数组索引

使用数组存放数据并不是最终目的，关键是能够随时的访问到数组中的数据（单元）。其实 JavaScript 为数组中的每一个数据单元都编了号，通过数据单元在数组中的编号便可以轻松访问到数组中的数据单元了。

我们将数据单元在数组中的编号称为索引值，也有人称其为下标。

索引值实际是按着数据单元在数组中的位置依次排列的，注意是从0 开始的：

​
<script>
  let classes = ['1', '2', '3', '4', '5']
    //     索引：  0    1    2    3    4
</script>

​

<script>
  let classes = ['1', '2', '3', '4', '5']
  
  // 1. 访问数组，语法格式为：变量名[索引值]
  document.write(classes[0]) // 结果为：1
  document.write(classes[1]) // 结果为：2
  document.write(classes[4]) // 结果为：3
  
  // 2. 通过索引值还可以为数组单重新赋值
  document.write(classes[3]) // 结果为：3
  // 重新为索引值为 3 的单元赋值
  classes[3] = '6'
  document.wirte(classes[3]); // 结果为： 6
</script>

数据单元值类型

数组做为数据的集合，它的单元值可以是任意数据类型

<script>
  // 6. 数组单值类型可以是任意数据类型

  // a) 数组单元值的类型为字符类型
  let list = ['HTML', 'CSS', 'JavaScript']
  // b) 数组单元值的类型为数值类型
  let scores = [78, 84, 70, 62, 75]
  // c) 混合多种类型
  let mixin = [true, 1, false, 'hello']
</script>

数组长度属性

重申一次，数组在 JavaScript 中并不是新的数据类型，它属于对象类型。

<script>
  // 定义一个数组
  let arr = ['html', 'css', 'javascript']
  // 数组对应着一个 length 属性，它的含义是获取数组的长度
  console.log(arr.length) // 3
</script>

操作数组

数组做为对象数据类型，不但有 length 属性可以使用，还提供了许多方法：

1. push 动态向数组的尾部添加一个单元

2. unshit 动态向数组头部添加一个单元

3. pop 删除最后一个单元

4. shift 删除第一个单元

5. splice 动态删除任意单元

使用以上4个方法时，都是直接在原数组上进行操作，即成功调任何一个方法，原数组都跟着发生相应的改变。并且在添加或删除单元时 length 并不会发生错乱。

<script>
  // 定义一个数组
  let arr = ['html', 'css', 'javascript']

  // 1. push 动态向数组的尾部添加一个单元
  arr.push('Nodejs')
  console.log(arr)
  arr.push('Vue')

  // 2. unshit 动态向数组头部添加一个单元
  arr.unshift('VS Code')
  console.log(arr)

  // 3. splice 动态删除任意单元
  arr.splice(2, 1) // 从索引值为2的位置开始删除1个单元
  console.log(arr)

  // 4. pop 删除最后一个单元
  arr.pop()
  console.log(arr)

  // 5. shift 删除第一个单元
  arr.shift()
  console.log(arr)
</script>