JS 数组 - Javascript

JavaScript 是一门广泛使用的脚本语言，具有动态类型、基于原型的弱类型风格，同时支持面向对象、命令式和声明式（如函数式编程）风格。在 JavaScript 中，数组是一种特殊的对象类型，用于存储有序的数据集合。本文将详细介绍 JavaScript 数组的各种常用方法和用法。

创建数组

JavaScript 数组可以使用以下三种方式进行创建：

1. 直接量方式：使用方括号 [] 表示一个空数组，使用逗号分隔符分隔数组元素。（代码片段1）

const arr1 = [];
const arr2 = [1, 2, 3];

2. 构造函数方式：使用 Array 构造函数来创建数组。（代码片段2）

const arr3 = new Array();
const arr4 = new Array(1, 2, 3);

3. Array.of() 方式：使用 Array.of() 方法创建数组。（代码片段3）

const arr5 = Array.of();
const arr6 = Array.of(1, 2, 3);

访问数组元素

数组中的元素可以用数组下标来访问，下标从 0 开始计数，可以使用方括号 [] 来访问数组元素。（代码片段4）

const arr = [1, 2, 3];
console.log(arr[0]); // 输出结果为 1
console.log(arr[1]); // 输出结果为 2
console.log(arr[2]); // 输出结果为 3

修改数组元素

使用下标和赋值符号来修改数组元素。（代码片段5）

const arr = [1, 2, 3];
arr[0] = 0;
arr[1] = 1;
arr[2] = 2;
console.log(arr); // 输出结果为 [0, 1, 2]

数组常用方法

JavaScript 数组提供了许多常用的方法，包括增、删、改、查、排序、遍历等方法。下面我们将介绍一些常用的数组方法。

push() 方法

push() 方法可以向数组末尾添加一个或多个元素，返回新数组的长度。（代码片段6）

const arr = [1, 2, 3];
console.log(arr.push(4)); // 输出结果为 4
console.log(arr); // 输出结果为 [1, 2, 3, 4]

pop() 方法

pop() 方法可以删除并返回数组末尾的元素。（代码片段7）

const arr = [1, 2, 3];
console.log(arr.pop()); // 输出结果为 3
console.log(arr); // 输出结果为 [1, 2]

shift() 方法

shift() 方法可以删除并返回数组头部的元素。（代码片段8）

const arr = [1, 2, 3];
console.log(arr.shift()); // 输出结果为 1
console.log(arr); // 输出结果为 [2, 3]

unshift() 方法

unshift() 方法可以向数组头部添加一个或多个元素，返回新数组的长度。（代码片段9）

const arr = [1, 2, 3];
console.log(arr.unshift(0)); // 输出结果为 4
console.log(arr); // 输出结果为 [0, 1, 2, 3]

splice() 方法

splice() 方法可以删除或插入元素，返回被删除的元素组成的数组或空数组。（代码片段10）

const arr = [1, 2, 3, 4];
console.log(arr.splice(1, 2)); // 输出结果为 [2, 3]
console.log(arr); // 输出结果为 [1, 4]
console.log(arr.splice(1, 0, 2, 3)); // 输出结果为 []
console.log(arr); // 输出结果为 [1, 2, 3, 4]

slice() 方法

slice() 方法可以复制数组的一部分，返回复制的新数组。（代码片段11）

const arr = [1, 2, 3, 4];
console.log(arr.slice(1, 3)); // 输出结果为 [2, 3]
console.log(arr); // 输出结果为 [1, 2, 3, 4]

concat() 方法

concat() 方法可以连接两个或多个数组，返回新数组。（代码片段12）

const arr1 = [1, 2];
const arr2 = [3, 4];
console.log(arr1.concat(arr2)); // 输出结果为 [1, 2, 3, 4]

indexOf() 和 lastIndexOf() 方法

indexOf() 方法可以搜索数组中是否含有特定元素，如果有，则返回其下标，如果没有，则返回 -1。（代码片段13）

const arr = [1, 2, 3, 4, 3];
console.log(arr.indexOf(3)); // 输出结果为 2
console.log(arr.indexOf(5)); // 输出结果为 -1

lastIndexOf() 方法与 indexOf() 方法类似，区别在于搜索的方向是从末尾开始。（代码片段14）

const arr = [1, 2, 3, 4, 3];
console.log(arr.lastIndexOf(3)); // 输出结果为 4
console.log(arr.lastIndexOf(5)); // 输出结果为 -1

sort() 方法

sort() 方法可以对数组进行排序，默认以字母排序。（代码片段15）

const arr = [2, 1, 3];
console.log(arr.sort()); // 输出结果为 [1, 2, 3]

forEach() 和 map() 方法

forEach() 方法可以遍历数组中的所有元素，并对每个元素执行指定操作。（代码片段16）

const arr = [1, 2, 3];
arr.forEach((item) => {
  console.log(item);
});
// 输出结果为
// 1
// 2
// 3

map() 方法也可以遍历数组中的所有元素，但是遍历过程中可以对每个元素进行修改，最后返回新的数组。（代码片段17）

const arr = [1, 2, 3];
const newArr = arr.map((item) => {
  return item * 2;
});
console.log(newArr); // 输出结果为 [2, 4, 6]

filter() 方法

filter() 方法可以遍历数组中的所有元素，并返回满足条件的所有元素组成的新数组。（代码片段18）

const arr = [1, 2, 3, 4, 5];
const newArr = arr.filter((item) => {
  return item % 2 === 0;
});
console.log(newArr); // 输出结果为 [2, 4]

总结

JavaScript 数组是一种非常常用的数据结构，常用于存储有序的数据集合。在 JavaScript 中，数组拥有丰富的方法，包括增、删、改、查、排序、遍历等方法，使用这些方法可以方便地对数组进行操作。为了充分利用 JavaScript 数组的优势，需要了解数组的各种常用方法和用法，从而编写出更简洁、高效的代码。