JS的数组

67 阅读2分钟

35、认识数组数据类型

数组 是一种数据类型,他也是属于引用数据类型(复杂数据类型)
根据字面意思来说,存放数字的一个组合,但这样说有点片面了
更完善的说法:数组是存放一些数据的集合
换句话说:我们把数据放在一个盒子中,这个盒子就叫做数组,注意!数组内的数据是有顺序的
    //  创建一个变量 并在内部存储一个 数组
    var arr = [1, 2, 3, 'q', 'w', 'e', true, false, undefined]
    console.log(arr)

36、创建数组

创建数组
    分为两种方式    
        1.字面量的方式
            语法:var arr = [1, 2, 3, 'q', 'w', 'e']     
        ```js
            var arr = [1, 2, 3, 'q', 'w', 'e']
            console.log(arr)
        ```
        2.内置构造函数的方式
            语法1var arr = new Array() //创建一个空数组     
        ```js
            var arr1 = new Array()
            console.log(arr1)
        ```
            语法2var arr = new Array(5) //创建一个有长度的数组
        ```js
            var arr2 = new Array(5)
            console.log(arr2)
        ```
            语法3var arr = new Array(1, 2, 3) //创建一个有内容的数组
        ```js
            var arr3 = new Array(1, 2, 3)
            console.log(arr3)
        ```

37、数组的length

数组的 length 属性
 *    length 翻译过来就是 长度的意思
 *        代表 这个数组内,有多少个成员
 *    语法 数组名.length
    var arr1 = [1, 2, 3, 4, 5]
    var arr2 = ['q', 'w', 'e', 'r']
    var arr3 = new Array(1, 2, 3, 4, 5)
    // console.log(arr1)
    // console.log(arr2)
    console.log(arr1.length)
    console.log(arr2.length)
    console.log(arr3.length)

38、数据的索引

索引 也有人叫做 下标
     就是指一个数据,在这个数组内排列在第几个位置上
     注意:在JS中,索引(下标) 是从0开始计算的
         如果想要获取到数组指定位置的值,可以通过下标来获取
     语法:数组名[下标] -> 能够获取到这个数组中对应下标的成员具体的值
    var arr = ['b', 'a', 'c', 1, 2, 3]
    //  console.log(arr)
    console.log(arr[0]) //b
    console.log(arr[3]) //1

39、遍历数组

遍历数组
    想办法 拿到 数组的每一个成员
    想拿到数组的所有成员,需要先想办法拿到数组的所有下标
    规律:所有数组的下标都是从0开始的,然后到 数组.length - 1结束
    var arr = ['b', 'a', 'c', 1, 2, 3]
    //          0    1    2   3  4  5
    var arr1 = ['b', 'a', 'c', 1, 2]
    //          0    1    2   3  4
    // console.log(arr)
    // console.log(arr1)
    // 需求,就是根据arr这个数组,拿到他的所有下标
    for (var i = 0; i < arr.length; i++) {
      // console.log(i) // 0 1 2 3 4 5 输出所有下标
      // 需求:拿到数组所有的值,输出在控制台
      console.log(arr[i]) //输出所有下标对应的值
    }

40、课堂案例

    /**
     * 1.求数组内所有成员的和
     * 核心内容
     *      1.拿到所有的成员
     *      2.计算所有的和
     * */ 
    var arr = [9, 5, 6, 11, 8, 4, 3]
    var sum = 0 //初始化
    for(var i = 0; i < arr.length; i++) {
      // console.log(arr[i]) // 9 5 6 11 8 4 3
      sum += arr[i]
    }
    console.log('数组内所有成员的和为',sum)
    /**
     * 2.求数组内最大的数字
     * 核心内容
     *      1.拿到所有的成员
     *      2.找出最大值
     * */ 
     var arr = [9, 5, 6, 11, 8, 4, 3]
     var max = arr[0] //假设数组下标为0 的值是最大的,然后存储在max中
     for(var i = 0; i < arr.length; i++) {
         // console.log(arr[i]) // 9 5 6 11 8 4 3
         if(max < arr[i]) {//如果我假设的最大值小于数组中的某个值,那么会执行这个分支语句
             max = arr[i]
         }
     }
     console.log('数组内最大的数字',max)

41、课后练习

1. 封装函数, 把数组进行放大十倍的操作
```javascript
function map(arr) {
    // code run here ...
}
// 将来使用的时候
var arr = [100, 200, 300];
var res = map(arr);
// res: [ 1000, 2000, 3000 ]
```
- 要求: 函数的返回值需要是一个新数组
/**
 * 核心内容
 *    1.封装一个函数
 *    2.需要参数吗?需要
 *    3.需要几个参数? 1个数组
 *    4.需要返回值吗? 需要,返回一个放大十倍后的新数组
 * */
```js
    var arr = [100, 200, 300]
    function fn(fnArr) { //fnArr是形参,arr是实参
        var newFnArr = [] //声明一个新数组newFnArr,将放大十倍的数组放进去
        for(var i = 0; i < fnArr.length; i++) {
            // console.log(fnArr[i])
            newFnArr.push(fnArr[i] * 10)
        }
        return newFnArr
    }
    var newArr = fn(arr) //接收fn返回的值
    console.log(newArr)
```
2. 使用 JS 生成一个数组
- 要求: 数组内存储的数据是从 2 开始 的所有 偶数, 要求数组的长度为 30
```js
var arr = [100, 200, 300];
arr.push(500);
```
```js
    //方式一
    var arr = []
    for (var i = 2; i <= 60; i++) {
      // console.log(arr[i])
      if (i % 2 === 0) {
        arr.push(i);
      }
    }
    console.log(arr)
    //方式2
    var arr2 = new Array(30)
    for (var i = 0; i < arr2.length; i++) {
      arr2[i] = (i + 1) * 2
    }
    console.log(arr2)
```
3、 利用作业 2 生成的数组, 每 5 个数字求一个平均值, 放在新数组内
 *例子: [2, 4, 6, 8, 10, ..., 60] -> [6, 16, 26, 36, 46, 56]
 ```js
    var arr2 = []
    var sum = 0;//累加器
    var ciShu = 0;//计数器
    var avg = 0; //平均值
    for (var j = 0; j < arr.length ;j++) {
      // console.log(arr[j])
      ciShu++ //1 2 3 4 5每累加一次,那么计数器自增1,用来记录累加的次数
      sum += arr[j] //2+4+6+8+10累加器每次去和数组的值相加
      if (ciShu === 0) {
        var avg = sum / ciShu
        arr2.push(avg)
        sum = 0 //累加器清0
        ciShu = 0 //计时器清0
      }
    }
    console.log(arr2)
 ```