HTML+JavaScript-02

数组

JavaScript中的数组用于在单一变量存储多个值，其实跟java中的数组是一样的，都是通过索引来访问这些值的。

创建数组

方式一：（推荐）

var cars = ["北京现代", "丰田", "五菱宏光", "理想", "特斯拉"];

方式二：

new关键字

var cars = new Array("北京现代", "丰田", "五菱宏光", "理想", "特斯拉");

注意：出于简洁、可读性和执行速度的考虑，请使用第一种方法（数组文本方法），并且最后一个元素不能加,

访问数组元素

通过引用索引索引下标来访问数组中的元素

var cars = ["北京现代", "丰田", "五菱宏光", "理想", "特斯拉"];
console.log(cars[0]);//北京现代

注意：索引值是从0开始的

length属性

length属性返回数组的长度

var cars = ["北京现代", "丰田", "五菱宏光", "理想", "特斯拉"];
console.log("cars数组的长度=" + cars.length);//5

sort属性

sort属性对数组进行排序

var nums = [33, 22, 1, 56, 88, 13];
console.log("排序后的数组=" + nums.sort());//1,13,22,33,56,88

遍历数组

遍历数组最安全的方法是for循环

var cars = ["北京现代", "丰田", "五菱宏光", "理想", "特斯拉"];
for(let i = 0; i <= cars.length - 1; i++){
    console.log(cars[i]);
}

push()添加数组

添加数组的最佳方式是push()方法

var cars = ["北京现代", "丰田", "五菱宏光", "理想", "特斯拉"];
cars.push("比亚迪");
console.log(cars);

可以看到比亚迪直接加在了cars中的最后

push() 方法返回新数组的长度：

var cars = ["北京现代", "丰田", "五菱宏光", "理想", "特斯拉"];
console.log(cars.push("比亚迪"));//6

将数组转换为字符串

JavaScript 方法 toString() 把数组转换为数组值（逗号分隔）的字符串。

var cars = ["北京现代", "丰田", "五菱宏光", "理想", "特斯拉"];
console.log(cars.toString());

join() 方法也可将所有数组元素结合为一个字符串。它的行为类似 toString()，但是您还可以规定分隔符：

var cars = ["北京现代", "丰田", "五菱宏光", "理想", "特斯拉"];
console.log(cars.join("-"));

更改元素

通过索引index进行更改元素

var cars = ["北京现代", "丰田", "五菱宏光", "理想", "特斯拉"];
cars[2] = "长安"//把 长安 赋值给 五菱宏光 的索引
console.log(cars);

删除元素

可以使用delete来删除元素，但是不建议这样使用，可以看到“理想”这个元素被删除了，但是对应的索引也没了

var cars = ["北京现代", "丰田", "五菱宏光", "理想", "特斯拉"];
delete cars[3];
console.log(cars);

使用 delete 会在数组留下未定义的空洞。请使用 pop() 或 shift() 取而代之。

Popping

pop() 方法从数组中删除最后一个元素：

var cars = ["北京现代", "丰田", "五菱宏光", "理想", "特斯拉"];
cars.pop();//移除最后一个元素
console.log(cars);

注意：pop()方法只能删除最后一个元素

位移元素

位移与弹出等同，但处理首个元素而不是最后一个。

shift() 方法会删除首个数组元素，并把所有其他元素“位移”到更低的索引。

var cars = ["北京现代", "丰田", "五菱宏光", "理想", "特斯拉"];
cars.shift();//移除第一个元素
console.log(cars);

拼接数组

splice() 方法可用于向数组添加新项：

var cars = ["北京现代", "丰田", "五菱宏光", "理想", "特斯拉"];
cars.splice(1, 0, "宾利", "迈巴赫");//在北京现代后 添加 宾利 迈巴赫
console.log(cars);

cars.splice(1, 0, "宾利", "迈巴赫");

第一个参数（1）表示新增添元素的索引

第二个参数（0）表示要删除的元素数量

后面的参数是添加的新元素

使用 splice() 来删除元素

var cars = ["北京现代", "丰田", "五菱宏光", "理想", "特斯拉"];
cars.splice(1, 1);//删除丰田
console.log(cars);

cars.splice(1, 1);

第一个参数表示从哪个索引开始删除

第二个参数表示要删除几个元素

合并（连接）数组

concat() 方法通过合并（连接）现有数组来创建一个新数组：

var courseA = ["语文", "数学", "英语"];
var courseB = ["体育", "物理", "JavaScript"];
var course = courseA.concat(courseB);
console.log(course);

裁剪数组

slice() 方法用数组的某个片段切出新数组。

var course = ["语文", "数学", "英语", "体育", "物理", "JavaScript"];
var courseA = course.slice(2);
console.log("course=" + course);
console.log("courseA=" + courseA);

var courseA = course.slice(2);

参数（2）表示从索引为2的元素开始分割

可以看到得到的是以索引为界限的后半部分数组

当slice()接收两个参数时，第一个参数还是分割的头，第二个参数就是分割的尾

var course = ["语文", "数学", "英语", "体育", "物理", "JavaScript"];
var courseA = course.slice(2, 4);//截取 "英语", "体育" 赋值给courseA
console.log("course=" + course);
console.log("courseA=" + courseA);

不难发现slice()的两个参数的范围是前闭后开的