JavaScript常用数组方法以及使用方法
JavaScript中的数组是一种数据结构,可以存储一系列的值,并提供了许多方法来操纵和操作这些值。以下是一些常用的JavaScript数组方法:
- push():在数组末尾添加一个或多个元素,并返回新数组的长度。
- pop():删除并返回数组的最后一个元素。
- unshift():在数组开头添加一个或多个元素,并返回新数组的长度。
- shift():删除并返回数组的第一个元素。
- slice():从数组中提取指定的部分并返回一个新的数组,原始数组不会被修改。
- splice():从数组中删除、添加或替换元素,原始数组将被修改,并返回被删除的元素。
- concat():将两个或多个数组连接在一起,并返回新数组。
- reverse():反转数组的顺序,并返回修改后的数组。
- sort():按照字母顺序对数组进行排序,或者使用自定义函数对其进行排序,并返回修改后的数组。
- indexOf():返回指定元素在数组中的位置(从前往后找)。
- lastIndexOf():返回指定元素在数组中的位置(从后往前找)。
- forEach():遍历数组中的每个元素,并为每个元素执行回调函数。
- map():创建一个新数组,其中包含原始数组的所有元素,并对每个元素执行回调函数。
- filter():创建一个新数组,其中仅包含通过测试函数的元素。
- reduce():通过对数组中所有元素应用一个函数来将其减少为单个值,并返回该值。
join():用指定的分隔符将数组每一项拼接为字符串
find():返回匹配的值
findIndex():返回匹配位置的索引
toLocaleString()、toString():将数组转换为字符串
这些方法只是JavaScript中可用的一部分数组方法,还有很多其他的方法可以使用。push():
push()向数组末尾添加一个或多个元素,并返回新的长度
let fruits = ["apple", "banana"];
fruits.push("orange", "kiwi");
console.log(fruits); // ["apple", "banana", "orange", "kiwi"]
pop()删除数组最后一个元素,并返回被删除元素的值
let fruits = ["apple", "banana", "orange", "kiwi"];
let lastFruit = fruits.pop();
console.log(lastFruit); // "kiwi"
console.log(fruits); // ["apple", "banana", "orange"]
unshift():向数组开头添加一个或多个元素,并返回新的长度
let fruits = ["apple", "banana"];
fruits.unshift("orange", "kiwi");
console.log(fruits); // ["orange", "kiwi", "apple", "banana"]
shift():删除数组第一个元素,并返回被删除元素的值
let fruits = ["orange", "kiwi", "apple", "banana"];
let firstFruit = fruits.shift();
console.log(firstFruit); // "orange"
console.log(fruits); // ["kiwi", "apple", "banana"]
splice():从指定位置开始删除/插入若干个元素
let fruits = ["orange", "kiwi", "apple", "banana"];
// 从第二个位置开始删除两个元素,再插入两个元素
fruits.splice(1, 2, "pear", "peach");
console.log(fruits); // ["orange", "pear", "peach", "banana"]
slice():返回一个从开始到结束位置(不包括结束位置)的子数组
let fruits = ["orange", "kiwi", "apple", "banana"];
let subFruits = fruits.slice(1, 3);
console.log(subFruits); // ["kiwi", "apple"]
join():将数组中所有元素转换成字符串,并连接起来
let fruits = ["orange", "kiwi", "apple", "banana"];
let fruitString = fruits.join(", ");
console.log(fruitString); // "orange, kiwi, apple, banana"
indexOf():返回指定元素在数组中第一次出现的位置,如果不存在则返回-1
let fruits = ["orange", "kiwi", "apple", "banana"];
let index = fruits.indexOf("apple");
console.log(index); // 2
concat():合并两个或多个数组,返回一个新数组
let fruits1 = ["orange", "kiwi"];
let fruits2 = ["apple", "banana"];
let allFruits = fruits1.concat(fruits2);
console.log(allFruits); // ["orange", "kiwi", "apple", "banana"]
forEach():对数组中的每个元素执行指定操作
let fruits = ["orange", "kiwi", "apple", "banana"];
fruits.forEach(function(fruit) {
console.log(fruit.toUpperCase());
});
reverse()反转数组的顺序,并返回修改后的数组。
var arr = [1,2,3,4]
console.log(arr.reverse()) //[4,3,2,1]
sort():按照字母顺序对数组进行排序,或者使用自定义函数对其进行排序,并返回修改后的数组。
const numbers = [4, 2, 5, 1, 3];
numbers.sort((a, b) => a - b);
console.log(numbers); // 输出:[1, 2, 3, 4, 5]
lastIndexOf()
方法返回指定元素在数组中最后出现的位置的索引值,如果没有找到则返回 -1。
const fruits = ['apple', 'banana', 'orange', 'apple', 'pear'];
const appleIndex = fruits.lastIndexOf('apple');
console.log(appleIndex); // Output: 3
const grapeIndex = fruits.lastIndexOf('grape');
console.log(grapeIndex); // Output: -1
map() 方法可以用于对数组中的每个元素进行操作并返回一个新的数组。map()方法接收一个函数作为参数,在该函数中定义对每个元素进行的操作。
下面是一个示例,演示了如何使用 map() 方法将数组中的每个元素都平方,并返回一个包含平方后结果的新数组:
const array = [1, 2, 3, 4, 5];
const squaredArray = array.map((num) => num ** 2);
console.log(squaredArray); // Output: [1, 4, 9, 16, 25]
filter()
方法用于过滤数组中的元素,只保留符合特定条件的元素,并返回一个新数组。该方法接受一个回调函数作为参数,该回调函数将在数组的每个元素上被调用。
回调函数接受三个参数:
当前遍历的元素
1、元素索引
2、原始数组
3、回调函数必须返回一个布尔值,表示当前元素是否应该保留在新数组中。如果返回值为true,则该元素将被保留,否则将被过滤掉。
例如,假设有一个包含数字的数组,我们想要过滤出其中所有的偶数。可以使用以下代码:
const numbers = [1, 2, 3, 4, 5, 6];
const evenNumbers = numbers.filter((number) => number % 2 === 0);
console.log(evenNumbers); // 输出 [2, 4, 6]
reduce()
方法是一个高阶函数,它接受一个回调函数和一个可选的初始值参数。这个回调函数可以用来执行归纳操作,将数组中的所有元素归约成单个值。
回调函数有两个参数:累加器(accumulator)和当前值。累加器是上一次回调函数的返回值,而当前值是数组中正在处理的元素。回调函数必须总是返回一个值,以便在下一次迭代时使用。
以下是一个使用 reduce()
方法计算数组总和的示例:
const arr = [1, 2, 3, 4, 5];
const sum = arr.reduce((accumulator, currentValue) => accumulator + currentValue, 0);
console.log(sum); // 输出 15
find():返回匹配的值
var arr = [1,2,3,4,5,6]
var findData = arr.find(item=>{
return item == 2
})
console.log(findData) // 2
var findData1 = arr.find(item=>{
return item == 8
})
console.log(findData1) // undefined
findIndex():返回匹配位置的索引
var arr = [1,2,3,4]
var index = arr.find(item=>{
return item == 2
})
console.log(index) //1
toLocaleString()、toString():将数组转换为字符串
var arr = [1,2,3,4]
console.log(arr.toString()) //'1,2,3,4'
console.log(arr.toLocaleString()) //'1,2,3,4'