什么是数组?
数组是一种容器,可以存储多个项目,这些项目可以是数字、字符串、对象,甚至其他数组。在 JavaScript 中,数组中的每个项目都有一个从 0 开始的数字索引,可以使用这些索引来访问和操作数组中的元素。
创建数组
我们可以使用两种方式创建数组:
使用数组字面量
数组字面量是一种用方括号 [] 定义数组元素的方式。例如:1
2
3
4
5
6
7
8// 示例1
const fruits = ["apple", "banana", "orange", "grapes"];
// 示例2
const numbers = [8, 9, 3];
// 示例3
const data = ["apple", "banana", 9, 5];
使用 new 关键字
另一种创建数组的方式是使用 new 关键字。例如:1
const fruits = new Array("apple", "banana", "orange", "grapes");
访问数组元素
我们可以使用数字索引(0、1、2…)访问数组元素。需要注意的是,数组的索引从 0 开始。1
2
3
4const fruits = ["apple", "banana", "orange", "grapes"];
console.log(fruits[0]); // 输出:apple
console.log(fruits[1]); // 输出:banana
获取数组长度
可以使用 length 属性获取数组的长度(即数组中的元素个数)。1
2
3
4const numbers = [1, 2, 3, 4, 5, 6, 7];
const arrLength = numbers.length;
console.log(arrLength); // 输出:7
修改数组元素
可以通过访问数组元素的索引值来修改数组元素。例如:1
2
3
4
5const fruits = ["apple", "banana", "orange", "grapes"];
fruits[1] = "Plum";
console.log(fruits); // 输出:['apple', 'Plum', 'orange', 'grapes']
还可以向数组中添加新元素。例如:1
2
3
4
5const fruits = ["apple", "banana", "orange", "grapes"];
fruits[4] = "Plum";
console.log(fruits); // 输出:['apple', 'banana', 'orange', 'grapes', 'Plum']
数组方法
JavaScript 提供了许多用于操作数组的方法,下面是一些常用的数组方法:
pop()
pop() 方法会删除数组的最后一个元素,并返回被删除的元素。该方法会修改原始数组。1
2
3
4
5const numbers = [1, 9, 13, 7];
const removedElement = numbers.pop();
console.log(removedElement); // 输出:7
console.log(numbers); // 输出:[1, 9, 13]
push()
push() 方法会在数组的末尾添加一个新元素,并返回新数组的长度。该方法会修改原始数组。1
2
3
4
5const numbers = [1, 9, 13, 7];
const newElement = numbers.push(2);
console.log(numbers); // 输出:[1, 9, 13, 7, 2]
console.log(newElement); // 输出:5(新数组的长度)
shift()
shift() 方法会删除数组的第一个元素,并返回被删除的元素。1
2
3
4
5const numbers = [1, 9, 13, 7];
const removedElement = numbers.shift();
console.log(numbers); // 输出:[9, 13, 7]
console.log(removedElement); // 输出:1
unshift()
unshift() 方法会在数组的开头添加一个新元素,并返回新数组的长度。1
2
3
4
5const numbers = [1, 9, 13, 7];
const newElement = numbers.unshift(2);
console.log(numbers); // 输出:[2, 1, 9, 13, 7]
console.log(newElement); // 输出:5(新数组的长度)
join()
join() 方法会使用指定的分隔符将数组的所有元素连接起来。1
2
3
4
5
6const numbers = [1, 9, 13, 7];
const numbers1 = numbers.join("-");
const numbers2 = numbers.join("!");
console.log(numbers1); // 输出:1-9-13-7
console.log(numbers2); // 输出:1!9!13!7
等等其他方法:slice()、reverse()、sort()、indexOf()、find()、filter()、map()等。
遍历数组
for 循环
可以使用 for 循环遍历数组:1
2
3
4
5const colors = ["red", "orange", "blue", "green", "white"];
for (let i = 0; i < colors.length; i++) {
console.log(colors[i]);
}
forEach()
forEach() 方法对每个元素执行函数:1
2
3const colors = ["red", "orange", "blue", "green", "white"];
colors.forEach(color => console.log(color));
for…of
for...of 循环数组值:1
2
3
4
5const colors = ["red", "orange", "blue", "green", "white"];
for (color of colors) {
console.log(color);
}
map()
map() 对元素执行函数生成新数组:1
2
3
4const numbers = [1, 2, 3, 4, 5];
const squaredNumbers = numbers.map(num => num * num);
console.log(squaredNumbers);
等等其他遍历方式。
总结
- 数组是组织数据的重要结构,可以高效存储多个元素
- 数组元素可以是各种数据类型,如数字、字符串、对象等
- 学习了创建数组的方法,以及访问和获取数组长度
- 掌握了数组的多种操作方法,如 push()、pop()、splice() 等
- 了解了数组的遍历方式,如 for 循环、forEach()、map() 等
- 数组提供了方便的内置方法来处理数据
- 是 JavaScript 中非常有用的数据结构
综上所述,通过学习数组的创建、访问、操作和遍历,可以灵活地使用数组来组织和管理多种数据。数组提供了高效存储和强大功能,是 JavaScript 中重要的数据结构。
