js数组常用的方法

2023/11/21 技术

# 1. push() 方法:向数组末尾添加一个或多个元素,并返回新数组的长度。

javascriptlet fruits = ["apple", "banana"];
fruits.push("orange");
console.log(fruits); // 输出:["apple", "banana", "orange"]
1
2
3

# 2. pop() 方法:删除数组的最后一个元素,并返回被删除的元素。

javascriptlet fruits = ["apple", "banana", "orange"];
let removedFruit = fruits.pop();
console.log(removedFruit); // 输出:orange
console.log(fruits); // 输出:["apple", "banana"]
1
2
3
4

# 3. shift() 方法:删除数组的第一个元素,并返回被删除的元素。

javascriptlet fruits = ["apple", "banana", "orange"];
let removedFruit = fruits.shift();
console.log(removedFruit); // 输出:apple
console.log(fruits); // 输出:["banana", "orange"]
1
2
3
4

# 4. unshift() 方法:向数组的开头添加一个或多个元素,并返回新数组的长度。

javascriptlet fruits = ["banana", "orange"];
fruits.unshift("apple");
console.log(fruits); // 输出:["apple", "banana", "orange"]
1
2
3

# 5. concat() 方法:将两个或多个数组合并成一个新数组。

javascriptlet fruits1 = ["apple", "banana"];
let fruits2 = ["orange", "grape"];
let mergedFruits = fruits1.concat(fruits2);
console.log(mergedFruits); // 输出:["apple", "banana", "orange", "grape"]
1
2
3
4

# 6. slice() 方法:从数组中提取指定位置的元素,并返回新数组。

javascriptlet fruits = ["apple", "banana", "orange", "grape"];
let slicedFruits = fruits.slice(1, 3);
console.log(slicedFruits); // 输出:["banana", "orange"]
1
2
3

# 7. splice() 方法:向/从数组中添加/删除元素,并返回被删除的元素。

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

# 8. Array.from() 方法: Array.from() 方法用于将类似数组或可迭代对象转换为真正的数组。

javascriptconst str = 'hello';
const arr = Array.from(str);
console.log(arr); // 输出:['h', 'e', 'l', 'l', 'o']
1
2
3

# 9. Array.find() 方法: Array.find() 方法用于找到数组中满足条件的第一个元素,并返回该元素。

javascriptconst numbers = [1, 2, 3, 4, 5];
const evenNumber = numbers.find(num => num % 2 === 0);
console.log(evenNumber); // 输出:2
1
2
3

# 10. Array.findIndex() 方法: Array.findIndex() 方法用于找到数组中满足条件的第一个元素的索引,并返回该索引。

javascriptconst numbers = [1, 2, 3, 4, 5];
const evenIndex = numbers.findIndex(num => num % 2 === 0);
console.log(evenIndex); // 输出:1
1
2
3

# 11. Array.includes() 方法: Array.includes() 方法用于判断数组是否包含某个元素,返回一个布尔值。

javascriptconst numbers = [1, 2, 3, 4, 5];
console.log(numbers.includes(3)); // 输出:true
console.log(numbers.includes(6)); // 输出:false
1
2
3

# 12. Array.filter() 方法: Array.filter() 方法用于筛选数组中满足条件的所有元素,并返回一个新数组。

javascriptconst numbers = [1, 2, 3, 4, 5];
const evenNumbers = numbers.filter(num => num % 2 === 0);
console.log(evenNumbers); // 输出:[2, 4]
1
2
3

# 13.indexOf() 方法用于返回数组中指定元素首次出现的索引。如果数组中不存在该元素,则返回 -1。

javascriptconst fruits = ['apple', 'banana', 'orange', 'apple'];
const index = fruits.indexOf('banana');
console.log(index); // 输出:1

const nonExistentIndex = fruits.indexOf('grape');
console.log(nonExistentIndex); // 输出:-1
1
2
3
4
5
6

# 14.forEach 和 map 的区别

  1. # forEach() 方法: forEach() 方法用于对数组中的每个元素执行指定的操作,没有返回值。它接受一个回调函数作为参数,该回调函数在数组的每个元素上被调用一次。

  2. # forEach() 方法对数组中的每个元素都执行了回调函数,并且没有返回值。

javascriptconst numbers = [1, 2, 3, 4, 5];
numbers.forEach((num) => {
  console.log(num);
});
// 输出:1 2 3 4 5
1
2
3
4
5

# 2. map() 方法: map() 方法用于对数组中的每个元素执行指定的操作,并返回一个新的数组,新数组的元素是原始数组经过操作后的结果。它也接受一个回调函数作为参数,该回调函数在数组的每个元素上被调用一次。

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

# map() 方法对数组中的每个元素都执行了回调函数,并将回调函数的返回值组成一个新的数组返回。 总结: - forEach() 方法用于对数组中的每个元素执行操作,没有返回值。 - map() 方法用于对数组中的每个元素执行操作,并返回一个新的数组

LOSER
米津玄師