博客

1.数组的概念

数组是指

一组数据的集合

，其中的每个数据被称作

元素

，在数组中可以

存放任意类型的元素

。

👻数组是一种将

一组数据存储在单个变量名下

的优雅方式。

// 普通变量一次只能存储一个值
var  num = 10; 
// 数组一次可以存储多个值
var arr = [1,2,3,4,5];

2.创建数组

（1）数组的创建方式

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

（2）利用 new 创建数组

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

（3）利用数组字面量创建数组

• 数组的字面量是方括号 [ ]
• 声明数组并赋值称为数组的初始化
• 最多使用的方式
• 数组中可以存放任意类型的数据，例如字符串，数字，布尔值等。

var arr = [];//创建了一个空的数组
var arr1 = [1, 2, '虚无', true];

• 数组里面的数据一定用逗号分隔
• 数组里面的数据 比如1,2… 我们称之为数组元素

3.获取数组中的元素

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

格式：数组名[索引号]

var arr = [‘小白’,‘小黑’,‘大黄’,‘瑞奇’];

索引号一一对应： 0 1 2 3

var arr1 = [1, 2, '虚无', true];	
console.log(arr1);//(4) [1, 2, '虚无', true]
console.log(arr1[2]);//虚无
console.log(arr1[3]);//true
var arr2 = ['天启','弑源','玄武'];
console.log(arr2[0]);//天启
console.log(arr2[1]);//弑源
console.log(arr2[2]);//玄武
console.log(arr2[3]);//因为没有这个数组元素，所有输出结果是 undefined

定义一个数组，里面存放星期一、星期二…… 直到星期日（共7天），在控制台输出：星期日

var week = ['星期一','星期二','星期三','星期四','星期五','星期六','星期日'];
console.log(week[6]);//星期日

4.遍历数组

（1）遍历数组

就是把数组的元素从头到尾访问一次

var arr = ['red', 'green', 'blue'];
for (var i = 0; i < 3; i++) {
    console.log(arr[i]);
}
//red
//green
//blue
// 1.因为数组索引号是从0开始的，所以 i 必须从 0 开始 i < 3
// 2.输出的时候 arr[i]  i 计数器当索引号来用

（2）数组的长度

使用“数组名.length”可以访问数组元素的数量（数组长度）

🎉这样的话，日后若想再添加一个数组元素，就不需要在for循环里改变

条件表达式

了

var arr = ['关羽','张飞','马超','赵云','黄忠','刘备','姜维','Java'];
for (var i = 0; i < arr.length; i++) {
    console.log(arr[i]);
}

• 数组的长度是
  
  元素的个数
  
  不要跟索引号混淆
• arr.length 是动态检测数组元素的个数

案例 ：数组求和及平均值

求数组 [2,6,1,7, 4] 里面所有元素的和以及平均值。

//求数组 [2,6,1,7, 4] 里面所有元素的和以及平均值。
//1.声明一个求和变量 sum。
//2.遍历这个数组，把里面每个数组元素加到 sum 里面。
//3.用求和变量 sum 除以数组的长度就可以得到数组的平均值。
 var arr = [2, 6, 1 , 7, 4];
var sum = 0;
var average = 0;
for (var i = 0; i < arr.length; i++) {
    sum += arr[i];//记住我们所加的是数组元素 arr[i]  不是计数器 i
}
average = sum / arr.length;
console.log(sum,average);//想要输出多个变量，用逗号隔开即可

案例 ： 数组最大值

求数组[2,6,1,77,52,25,7]中的最大值。

// 求数组[2,6,1,77,52,25,7]中的最大值。
//1.声明一个保存最大元素的变量 max。
//2.默认最大值可以取数组中的第一个元素。
//3.遍历这个数组，把里面每个数组元素和 max 相比较。
//4.如果这个数组元素大于max 就把这个数组元素存到 max 里面，否则继续下一轮比较。
//5.最后输出这个 max。
var arr = [2,6,1,77,52,25,7,99];
var max = arr[0];
for (var i = 1; i < arr.length; i++) {
    if (arr[i] > max) {
       max = arr[i];
    }
}
console.log('该数组最大值为：' + max);

// 最小值
var arr = [2,6,1,77,52,25,7,99];
var min = arr[0];
for (var i = 1; i < arr.length; i++) {
    if (arr[i] < min) {
       min = arr[i];
    }
}
console.log('该数组最小值为：' + min);

案例 ： 数组转换为字符串

要求：将数组 [‘red’, ‘green’, ‘blue’, ‘pink’] 里面的元素转换为字符串

输出： ‘redgreenbluepink’

//1.需要一个新变量用于存放转换完的字符串 str。
//2.遍历原来的数组，分别把里面数据取出来，加到字符串里面。
var arr = ['red', 'green', 'blue', 'pink'];
var str = '';
for (var i = 0; i < arr.length; i++) {
    str = str + arr[i];
}
console.log(str);

案例 ： 数组转换为分割字符串

要求：将数组 [‘red’, ‘green’, ‘blue’, ‘pink’] 转换为字符串，并且用 | 或其他符号分割

输出： ‘red|green|blue|pink’

<script>
        // 将数组 ['red', 'green', 'blue', 'pink'] 转换为字符串，
        //并且用 | 或其他符号分割
        //1.需要一个新变量用于存放转换完的字符串 str。
        //2.遍历原来的数组，分别把里面数据取出来，加到字符串里面。
        //3.同时在后面多加一个分隔符。
        var arr = ['red', 'green', 'blue', 'pink'];
        var str = '';
        var sep = '|';
        for (var i = 0; i < arr.length; i++) {
            str = str + arr[i] + sep;
        }
        console.log(str);
    </script>

5.数组中新增元素

（1） 修改 length 长度新增数组元素

通过修改 length 长度来实现数组扩容的目的

// 1.新增数组元素 修改length长度
var arr = ['鸿蒙', '生命', '死亡'];
console.log(arr.length);
arr.length = 5;//把数组的长度修改为了 5 里面应该有五个元素
console.log(arr);
console.log(arr[3]);//undefined
console.log(arr[4]);//undefined

（2）修改索引号追加数组元素

可以通过修改数组索引的方式追加数组元素

不能直接给数组名赋值，否则会覆盖掉以前的数据

最常用的一种方式

// 2.新增数组元素  修改索引号 追加数组元素
var arr1 = ['鸿蒙', '生命' ,'死亡'];
arr1[3] = '虚无';
console.log(arr1);
arr1[4] = '命运';
console.log(arr1);
arr1[0] = '焚烬';// 替换原来的数组元素
console.log(arr1);
arr1 = '太初神则';
console.log(arr1);// 不要直接给数组名赋值 否则里面的数组元素都会消失的

案例 1： 数组新增元素

新建一个数组，里面存放10个整数（ 1~10）， 要求使用循环追加的方式输出： [1,2,3,4,5,6,7,8,9,10]

//1.使用循环来追加数组。(核心原理)
//2.声明一个空数组 arr。
//3.循环中的计数器 i  可以作为数组元素存入。
//4.由于数组的索引号是从0开始的， 因此计数器从 0 开始更合适，存入的数组元素要+1。
var arr = [];
for (var i = 0; i < 10; i++) {
    //arr = i;//不要直接给数组名赋值，否则以前的元素都会没了。
    arr[i] = i + 1;
}
console.log(arr);

案例 2：筛选数组

要求：将数组 [2, 0, 6, 1, 77, 0, 52, 0, 25, 7] 中大于等于 10 的元素选出来，放入新数组。

// 将数组 [2, 0, 6, 1, 77, 0, 52, 0, 25, 7] 中
// 大于等于 10 的元素选出来，放入新数组。
// (1)声明一个新的数组用于存放新数据。
// (2)遍历原来的数组，找出大于等于 10 的元素。
// (3)依次追加给新数组 newArr。

// 方法一：
var arr =[2, 0, 6, 1, 77, 0, 52, 0, 25, 7];
var newArr = [];
//定义一个变量 用来计算 新数组的索引号
var j = 0;
for (var i = 0; i < arr.length; i++) {
    if (arr[i] >= 10) {
       // 新数组索引号应该从0开始 依次递增
       newArr[j] = arr[i];
       j++;
     }
}
console.log(newArr);// [77, 52, 25]
        

// 方法二：
var arr =[2, 0, 6, 1, 77, 0, 52, 0, 25, 7];
var newArr = [];
//刚开始 newArr.length 就是0
for (var i = 0; i < arr.length; i++) {
    if (arr[i] >= 10) {
    // 新数组索引号应该从0开始 依次递增
    //每次存入一个值，newArr长度都会 +1 
    newArr[newArr.length] = arr[i];
    }
}
console.log(newArr);

// 将数组 [2, 0, 6, 1, 77, 0, 52, 0, 25, 7] 中
// 小于十的筛选出来
var arr = [2, 0, 6, 1, 77, 0, 52, 0, 25, 7];
var newArr = [];
for (var i = 0; i < arr.length; i++) {
    if (arr[i] < 10) {
       newArr[newArr.length] = arr[i];
    }
}
console.log(newArr);

6.数组案例

（1）案例 1： 删除指定数组元素

要求：将数组[2, 0, 6, 1, 77, 0, 52, 0, 25, 7]中的 0 去掉后，形成一个不包含 0 的新数组。

//1.需要一个新数组用于存放筛选之后的数据。
//2.遍历原来的数组，把不是 0 的数据添加到新数组里面( 此时要注意采用数组名+索引的格式接收数据)。
//3.新数组里面的个数，用 length 不断累加。

var arr = [2, 0, 6, 1, 77, 0, 52, 0, 25, 7];
var newArr = []; 空数组的默认的长度为 0
// 定义一个变量 i 用来计算新数组的索引号
for (var i = 0; i < arr.length; i++) {
    // 找出大于 10 的数
    if (arr[i] != 0) {
       // 给新数组
       // 每次存入一个值，newArr长度都会 +1  
       newArr[newArr.length] = arr[i];
    }
}
console.log(newArr);

（2）案例 2： 翻转数组

要求: 将数组 [‘red’, ‘green’, ‘blue’, ‘pink’, ‘purple’] 的内容反过来存放。

输出： [‘purple’, ‘pink’, ‘blue’, ‘green’, ‘red’]

var arr = ['red', 'green', 'blue', 'pink', 'purple','神道'];
var newArr = [];
// var i 不能直接等于4，否则以后往arr数组添加一个'神道'，下面还需要再修改
for (var i = arr.length - 1; i >= 0; i--) {
    newArr[newArr.length] = arr[i];
}
console.log(newArr);

（3）案例 3： 数组排序（冒泡排序）

• 复习交换两个变量

// 交换两个变量
var num1 = '落叶';
var num2 = '化雪';
var temp;
temp = num1;
num1 = num2;
num2 = temp;
console.log(num1,num2);//化雪 落叶

• 冒泡排序：是一种算法，把一系列的数据按照一定的顺序进行排列显示(从小到大或从大到小）。

gif演示

• 将数组 [5, 4, 3, 2, 1]中的元素按照从小到大的顺序排序，输出： 1，2，3，4，5

// var arr = [5, 4, 3, 2, 1];
var arr = [2, 1, 5, 3, 4];
// 外层循环管趟数
for (var i = 0; i <= arr.length - 1; i++) {
    // 内层循环 管 每一趟交换的次数
    for (var j = 0; j <= arr.length - i - 1; j++) {
        // 内部交换2个变量的值 前一个和后面一个数组元素相比较
        if (arr[j] > arr[j + 1]) {
           // 将 > 换成 < ，可变成 [5, 4, 3, 2, 1]
           var temp;
           temp = arr[j];
           arr[j] = arr[j + 1];
           arr[j + 1] = temp;
        }
     }
}
console.log(arr);