【精选】Vue中常用的数组方法.filter()、.map()、.forEach()、.find()、.findIndex()、.some()、.every()

2023-10-24 14:04| 来源: 网络整理| 查看: 265

Vue中常用的数组方法 .filter()、.map()、.forEach()、.find()、.findIndex()、.some()、.every()、.fill().filter().map().forEach().find().findIndex().some().every().fill()

.filter()、.map()、.forEach()、.find()、.findIndex()、.some()、.every()、.fill()

本文仅为自己在项目中经常用到的一些数组方法的使用，以便随时查看。

.filter()

filter() 方法创建一个新的数组，新数组中的元素是通过检查指定数组中符合条件的所有元素。是否改变原数组：否是否对空数组进行检测：否

语法：

const arr= [32, 33, 16, 40]; const arr1 = arr.filter(item => item >= 18) console.log(arr) // [32, 33, 16, 40] console.log(arr1) // [32, 33, 40] .map()

map() 方法返回一个新数组，数组中的元素为原始数组元素调用函数处理后的值。 map() 方法按照原始数组元素顺序依次处理元素。是否改变原数组：否是否对空数组进行检测：否

语法：

const arr= [4, 9, 16, 25]; const arr1 = arr.map(item => item+2) console.log(arr) // [4, 9, 16, 25] console.log(arr1) // [6, 11, 18, 27] .forEach()

forEach() 方法用于调用数组的每个元素，并将元素传递给回调函数。注意: forEach() 对于空数组是不会执行回调函数的。 tips: forEach()中不支持使用break(报错)和return(不能结束循环)，有需要时可使用常规的for循环。

语法：

const arr= [4, 9, 16, 25]; const arr1 = []; arr.forEach(item => arr1.push(item)) console.log(arr) // [4, 9, 16, 25] console.log(arr1) // [4, 9, 16, 25] .find()

find() 方法返回通过测试（函数内判断）的数组的第一个元素的值。

find() 方法为数组中的每个元素都调用一次函数执行：

当数组中的元素在测试条件时返回 true 时, find() 返回符合条件的元素，之后的值不会再调用执行函数。如果没有符合条件的元素返回 undefined

注意: find() 对于空数组，函数是不会执行的。注意: find() 并没有改变数组的原始值。

语法：

const arr= [4, 9, 16, 25]; const b = arr.find(item => item>10) const c = arr.find(item => item item>10) const c = arr.findIndex(item => item item>10) const c = arr.some(item => item item>10) const c = arr.every(item => item>1) console.log(arr) // [4, 9, 16, 25] console.log(b) // false console.log(c) // true .fill()

fill() 方法用于将一个固定值替换数组的元素。

注意： fill() 不会对空数组进行填充。注意： fill() 会改变原始数组。

语法：

const arr1= [4, 9, 16, 25]; const b = arr1.fill(100); const arr2= [4, 9, 16, 25]; const c = arr2.fill(100, 2, 4) // 2为开始填充的起始位置，4为结束位置（不包含） const arr3= []; const d = arr3.fill(100); console.log(arr1) // [100, 100, 100, 100] console.log(b) // [100, 100, 100, 100] console.log(arr2) // [4, 9, 100, 100] console.log(c) // [4, 9, 100, 100] console.log(arr3) // [] console.log(d) // []

【本文地址】

公司简介

联系我们