数组是一种特殊的对象,适用于存储和管理有序的数据项。

在实际开发中我们经常使用数组来存储一些数据,使用频率非常高。

数组可以存储任何类型的元素。但是一般一个数组存储的同一类数据的集合

例如

var arr = [ 'Apple', { name: 'John' }, true, function() { alert('hello'); } ];

声明

创建一个空数组有两种语法:

var arr = new Array();
var arr = [];

绝大多数情况下使用的都是第二种语法。我们可以在方括号中添加初始元素:

var fruits = ["Apple", "Orange", "Plum"];

索引和长度

  • 数组元素从 0 开始编号。我们称其为索引

  • 可以使用length属性来获取数组的长度(元素的个数)。

  var arr = [21, 22, 23];
  // 元素21的索引为0
  // 元素22的索引为1
  // 元素33的索引为2
  console.log(arr.length); // 打印结果:3

获取一个元素

我们可以通过方括号中的数字获取元素:

var fruits = ["Apple", "Orange", "Plum"];

alert( fruits[0] ); // Apple
alert( fruits[1] ); // Orange
alert( fruits[2] ); // Plum

修改一个元素

fruits[2] = 'Pear'; // 现在变成了 ["Apple", "Orange", "Pear"]

添加一个元素

fruits[3] = 'Lemon'; // 现在变成 ["Apple", "Orange", "Pear", "Lemon"]

遍历数组

var arr = ["张三", "john", "李四", "王五"];
// 1. for循环 遍历索引
for (var i = 0; i < arr.length; i++) {
    console.log(arr[i]);
}


// 2. for...of 遍历数组元素
var fruits = ["Apple", "Orange", "Plum"];
for (var fruit of fruits) {
  alert( fruit );
}
// `for..of` 不能获取当前元素的索引,只是获取元素值,但大多数情况是够用的。

数组方法

  • push 在末端添加一个元素。

  • unshift 在首端添加一个元素。

  • shift 删除数组首端的一个元素。

  • pop 从末端删除一个元素。

  • splice 删除数组某一位置的元素。

  • concat 连接多个数组。

  • join 将数组转换为字符串。

补充: split 将字符串分割为数组。

学习方法

  1. 学习使用语法
  2. 学习方法有什么作用和功能
  3. 记忆使用时需要传递什么参数
  4. 关注方法返回什么(返回值)(也就是方法运行完,额外提供给我们的数据)

作用于数组末端的方法:

pop

删除并返回数组的最后一个元素:

var fruits = ["Apple", "Orange", "Pear"];

alert( fruits.pop() ); // 移除 "Pear" 然后 alert 显示出来

alert( fruits ); // Apple, Orange

push

在数组末端添加元素:

var fruits = ["Apple", "Orange"];

fruits.push("Pear");

alert( fruits ); // Apple, Orange, Pear
调用 `fruits.push(...)` 与 `fruits[fruits.length] = ...` 是一样的。

作用于数组首端的方法:

shift

删除数组的第一个元素并返回它:

var fruits = ["Apple", "Orange", "Pear"];

alert( fruits.shift() ); // 移除 Apple 然后 alert 显示出来

alert( fruits ); // Orange, Pear

unshift

在数组的首端添加元素:

var fruits = ["Orange", "Pear"];

fruits.unshift('Apple');

alert( fruits ); // Apple, Orange, Pear

pushunshift 方法都可以一次添加多个元素:

/**/
var fruits = ["Apple"];

fruits.push("Orange", "Peach");
fruits.unshift("Pineapple", "Lemon");

// ["Pineapple", "Lemon", "Apple", "Orange", "Peach"]
alert( fruits );

splice

splice():从数组中删除指定的一个或多个元素,返回结果为删除元素组成的数组(会改变原来的数组,会将指定元素从原数组中删除)。

语法:

var result = 原数组.splice(起始索引index, 需要删除的个数, 第三个参数, 第四个参数...);

上方语法中,第三个及之后的参数,表示:向原数组中添加新的元素,这些元素将会自动从起始索引的位置插入。

举例 1:

/**/
var arr1 = ["a", "b", "c", "d", "e", "f"];
var result1 = arr1.splice(1); //从第index为1的位置开始,删除元素

console.log("arr1:" + arr1); // ["a"]
console.log("result1:" + result1); // ["b","c","d","e","f"]

console.log("-----------------------");

var arr3 = ["a", "b", "c", "d", "e", "f"];
var result3 = arr3.splice(1, 3); //从第index为1的位置开始删除元素,一共删除三个元素

console.log("arr3:" + arr3); // ["a","e","f"]
console.log("result3:" + result3); // ["b","c","d"]

举例 2:(我们来看看第三、四…个参数的用法)

/**/
var arr4 = ["a", "b", "c", "d", "e", "f"];

//从第index为1的位置开始删除元素,一共删除三个元素。并且在 起始索引 1 的位置开始追加两个元素
var result4 = arr4.splice(1, 3, "不凡学院", "js");

console.log("arr4:" + arr4); // ["a","不凡学院","js","e","f"]
console.log("result4:" + result4); // ["b","c","d"]

concat

连接两个或多个数组,返回连接后的新数组。(不会改变原数组)

语法:

var result = 数组.concat(数组1,数组2);
/**/
var nameArr1 = ["张三", "李四"];
var nameArr2 = ["王五", "赵六"];
var nameArr = nameArr1.concat(nameArr2);
console.log(nameArr); // ['张三','李四','王五','赵六']
console.log(nameArr1); // ['张三','李四']
console.log(nameArr2); // ['王五','赵六']
// 并未改变原数组,所以我要用一个新数组nameArr去接收合并后的数组,以便后续使用。

join

将数组转换为字符串,返回转换后的字符串。(不会改变原来的数组)

补充:join()方法可以指定一个字符串作为参数,这个字符串将会成为数组中元素的连接符;如果不指定连接符,则默认使用 , 作为连接符,此时和 toString()的效果是一致的

语法:

var result = 原数组.join(参数); // 参数选填
var arr = [1, 2, 3];
var arrStr = arr.join("-");
console.log(arrStr); // 1-2-3
console.log(arr); // [1,2,3]
// 并未改变原数组

字符串方法 split

通过指定分隔符,将字符串分割为字符串数组,返回分割后的数组。(不会改变原来的数组)

分隔符如果省略,默认以逗号分隔,

语法:

新数组 = 原字符串.split(分隔符, 数组长度);

第二个参数,指定返回数组的最大长度。

代码举例:

/**/
var email = "abc@163.com;cc@126.com;frg@qq.com";
var emailArr = email.split(";");
console.log(emailArr); // ["abc@163.com", "cc@126.com", "frg@qq.com"]
var emailArr2 = email.split(";", 2);
var emailArr = email.split(";"); // ["abc@163.com", "cc@126.com"]

多维数组

数组里的项也可以是数组。我们可以将其用于多维数组,例如存储矩阵:

var matrix = [
  [1, 2, 3],
  [4, 5, 6],
  [7, 8, 9]
];

alert( matrix[1][1] ); // 最中间的那个数
文档更新时间: 2021-09-28 15:14   作者:张老师