前言
JavaScript 数组是一种非常常用的数据结构,用于存储和操作一组相关的数据。数组可以存储任意类型的数据,包括数字、字符串、对象等,并且可以根据索引访问和修改数组中的元素。之前我们有简单的了解过,本章我就学习更多的数组操作
一、创建数组
1.使用数组字面量 [] 创建数组
const numbers = [1,2,3]
2.使用 Array 构造函数创建数组
const numbers = new Array(1,2,3)
二、访问元素
1.使用索引访问数组元素
const fruits = ['apple','banana','orange']
console.log(fruits[0]) // ’apple'
注意:数组有下标的概念,从0开始,当我们使用索引访问的数组中的第1个元素apple时,也就是访问下标0,如上述代码
三、修改元素
1.通过索引对数组进行修改
const numbers = [1,2,3]
numbers[1] = 3
console.log(numbers) // [1,3,3]
四、遍历元素
1.使用循环语句 for 遍历数组元素
const numbers = [1, 2, 3, 4, 5];
for (let i = 0; i < numbers.length; i++) {
console.log(numbers[i]);
}
// 控制台日志就会分别打印出 1 2 3 4 5
2.使用 forEach 方法遍历数组元素
const numbers = [1, 2, 3, 4, 5];
numbers.forEach(function (number) {
console.log(number);
});
// 控制台日志就会分别打印出 1 2 3 4 5
3.使用 for...of 循环语句遍历数组
const numbers = [1, 2, 3, 4, 5];
for (const number of numbers) {
console.log(number);
}
// 控制台日志就会分别打印出 1 2 3 4 5
五、数组方法
1.添加元素
1).使用 push 方法向数组末尾添加元素
const fruits = ["apple", "banana"];
fruits.push("orange");
console.log(fruits); // 输出:["apple", "banana", "orange"]
2).使用 unshift 方法向数组开头添加元素
const fruits = ["banana", "orange"];
fruits.unshift("apple");
console.log(fruits); // 输出:["apple", "banana", "orange"]
2.删除元素
1).使用 pop 方法删除数末尾的元素
const fruits = ["apple", "banana", "orange"];
fruits.pop();
console.log(fruits); // 输出:["apple", "banana"]
2).使用 shift 方法删除数组开头的元素
const fruits = ["apple", "banana", "orange"];
fruits.shift();
console.log(fruits); // 输出:["banana", "orange"]
3.数组长度
1).使用 length 属性获取数组的长度
const fruits = ["apple", "banana", "orange"];
console.log(fruits.length); // 输出:3
4.数组查找
1).使用 indexOf 方法查找元素是否在数组的位置中
const fruits = ["apple", "banana", "orange"];
console.log(fruits.indexOf("banana")); // 输出:1
console.log(fruits.indexOf("grape")); // 输出:-1
2).使用 includes 方法检查数组是否包含某个元素
const fruits = ["apple", "banana", "orange"];
console.log(fruits.includes("banana")); // 输出:true
console.log(fruits.includes("grape")); // 输出:false
3).使用 find 方法查找满足条件的第一个元素
const numbers = [1, 2, 3, 4, 5];
const evenNumber = numbers.find(function (number) {
return number % 2 === 0;
});
console.log(evenNumber); // 输出:2
5.数组排序
1).使用 sort 方法对数组元素进行比较
const fruits = ["banana", "apple", "orange"];
fruits.sort();
console.log(fruits); // 输出:["apple", "banana", "orange"]
6.数组转换
1).使用 join 方法将数组转为字符串
const fruits = ["apple", "banana", "orange"];
const fruitString = fruits.join(", ");
console.log(fruitString); // 输出:"apple, banana, orange"
2).使用 toString 方法将数组转换为字符串
const fruits = ["apple", "banana", "orange"];
const fruitString = fruits.toString();
console.log(fruitString); // 输出:"apple,banana,orange"
3).使用 Array.form 方法将类似数组的对象或可迭代的对象转换为数组
const str = "hello";
const strArray = Array.from(str);
console.log(strArray); // 输出:["h", "e", "l", "l", "o"]
练习题:
1.数组求和
function sumArray(arr) {
...你的代码
}
// 示例用法
console.log(sumArray([1, 2, 3, 4, 5])); // 输出 15
console.log(sumArray([-1, 0, 1])); // 输出 0
2.查找数组中的最大值
function findMaxValue(arr) {
...你的代码
}
// 示例用法
console.log(findMaxValue([2, 7, 1, 9, 4])); // 输出 9
console.log(findMaxValue([-1, 0, -5, -3])); // 输出 0
3. 数组反转
function reverseArray(arr) {
...你的代码
}
// 示例用法
console.log(reverseArray([1, 2, 3, 4, 5])); // 输出 [5, 4, 3, 2, 1]
console.log(reverseArray(['a', 'b', 'c'])); // 输出 ['c', 'b', 'a']
算法题:移动零
给定一个包含数字和零的数组,编写一个函数将所有的零移动到数组的末尾,同时保持非零元素的相对顺序不变。
function moveZeroes(nums) {
...你的代码
}
// 示例用法
console.log(moveZeroes([0, 1, 0, 3, 12])); // 输出 [1, 3, 12, 0, 0]
console.log(moveZeroes([1, 2, 0, 0, 3, 0, 4])); // 输出 [1, 2, 3, 4, 0, 0, 0]
结语:
本章内容较多,需要各位认真观看,有的人直接就来看结语,最好老实从头看!这一章呢,笔者带大家简单的过了一遍数组的操作。还有很多方法,这里呢,并没有全部写完。但是这些几乎都是非常常用的,所以大家务必学会,能看到这里,笔者非常的开心。好了让我出发基础篇的最后一章,对象的操作!🚀🚀🚀