数组和数组方法

1. 数组简介

数组是JavaScript中的一种数据结构，用于存储多个值。数组中的每个值称为元素，每个元素都有一个索引（位置），索引从0开始。

1.1 创建数组

你可以使用以下几种方式创建数组：

// 使用数组字面量
let fruits = ["apple", "banana", "cherry"];

// 使用Array构造函数
let numbers = new Array(1, 2, 3, 4, 5);

// 创建一个空数组
let emptyArray = [];

1.2 访问数组元素

你可以通过索引来访问数组中的元素：

let fruits = ["apple", "banana", "cherry"];
console.log(fruits[0]); // 输出: apple
console.log(fruits[1]); // 输出: banana
console.log(fruits[2]); // 输出: cherry

1.3 修改数组元素

你可以通过索引来修改数组中的元素：

let fruits = ["apple", "banana", "cherry"];
fruits[1] = "orange";
console.log(fruits); // 输出: ["apple", "orange", "cherry"]

2. 数组方法

JavaScript提供了许多内置方法来操作数组。以下是一些常用的数组方法。

2.1 push() 和 pop()

push() 方法用于在数组的末尾添加一个或多个元素，并返回新的数组长度。

pop() 方法用于移除数组的最后一个元素，并返回该元素。

let fruits = ["apple", "banana"];
fruits.push("cherry");
console.log(fruits); // 输出: ["apple", "banana", "cherry"]

let removedFruit = fruits.pop();
console.log(removedFruit); // 输出: cherry
console.log(fruits); // 输出: ["apple", "banana"]

2.2 unshift() 和 shift()

unshift() 方法用于在数组的开头添加一个或多个元素，并返回新的数组长度。

shift() 方法用于移除数组的第一个元素，并返回该元素。

let fruits = ["banana", "cherry"];
fruits.unshift("apple");
console.log(fruits); // 输出: ["apple", "banana", "cherry"]

let removedFruit = fruits.shift();
console.log(removedFruit); // 输出: apple
console.log(fruits); // 输出: ["banana", "cherry"]

2.3 splice()

splice() 方法用于添加或删除数组中的元素。它可以接受多个参数：

• 第一个参数是开始索引。
• 第二个参数是要删除的元素数量（如果为0，则不删除任何元素）。
• 后续参数是要添加的元素。

let fruits = ["apple", "banana", "cherry"];
fruits.splice(1, 1, "orange", "grape");
console.log(fruits); // 输出: ["apple", "orange", "grape", "cherry"]

2.4 slice()

slice() 方法用于提取数组的一部分，并返回一个新数组。它接受两个参数：

• 第一个参数是开始索引。
• 第二个参数是结束索引（不包括该索引的元素）。

let fruits = ["apple", "banana", "cherry", "orange"];
let selectedFruits = fruits.slice(1, 3);
console.log(selectedFruits); // 输出: ["banana", "cherry"]

2.5 map()

map() 方法创建一个新数组，其结果是对原数组中的每个元素调用一个提供的函数。

let numbers = [1, 2, 3, 4, 5];
let doubledNumbers = numbers.map(function(num) {
    return num * 2;
});
console.log(doubledNumbers); // 输出: [2, 4, 6, 8, 10]

2.6 filter()

filter() 方法创建一个新数组，其包含通过所提供函数实现的测试的所有元素。

let numbers = [1, 2, 3, 4, 5];
let evenNumbers = numbers.filter(function(num) {
    return num % 2 === 0;
});
console.log(evenNumbers); // 输出: [2, 4]

2.7 reduce()

reduce() 方法对数组中的每个元素执行一个提供的 reducer 函数，将其结果汇总为单个输出值。

let numbers = [1, 2, 3, 4, 5];
let sum = numbers.reduce(function(accumulator, currentValue) {
    return accumulator + currentValue;
}, 0);
console.log(sum); // 输出: 15

3. 实践练习

3.1 练习1：数组操作

创建一个包含5个数字的数组，使用 push() 方法添加两个新数字，然后使用 pop() 方法移除最后一个数字。最后，使用 unshift() 方法在数组开头添加一个新数字。

let numbers = [10, 20, 30, 40, 50];
numbers.push(60, 70);
numbers.pop();
numbers.unshift(5);
console.log(numbers); // 输出: [5, 10, 20, 30, 40, 50, 60]

3.2 练习2：数组过滤

创建一个包含10个数字的数组，使用 filter() 方法筛选出所有大于20的数字。

let numbers = [15, 25, 35, 10, 5, 45, 50, 55, 60, 70];
let filteredNumbers = numbers.filter(function(num) {
    return num > 20;
});
console.log(filteredNumbers); // 输出: [25, 35, 45, 50, 55, 60, 70]

3.3 练习3：数组求和

创建一个包含10个数字的数组，使用 reduce() 方法计算所有数字的总和。

let numbers = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];
let sum = numbers.reduce(function(accumulator, currentValue) {
    return accumulator + currentValue;
}, 0);
console.log(sum); // 输出: 55

4. 总结

数组是JavaScript中非常重要的数据结构，掌握数组的基本操作和常用方法对于编写高效的代码至关重要。通过本教程的学习，你应该能够熟练地创建、访问、修改数组，并使用数组方法进行各种操作。

继续练习和探索更多高级的数组方法，如 find()、some()、every() 等，将帮助你进一步提升编程技能。