Vue的map()方法和filter()方法的使用

map()

map():方法返回一个新数组,数组中的元素为原始数组元素调用函数处理后的值

案例:

c 复制代码
const data = res.map(item => item.id);
const data = res.map(item => return item.id);
const data = res.map(item => { name: item.name, id: item.id })
const data = res.map(item => { text: item.id + item.name });
const data = res.map(item => {
	const temp = find(options, { code: item });
	return temp;
})

filter()

filter():方法创建一个新的数组,新数组中的元素是通过检查指定数组中符合条件的所有元素

c 复制代码
const arr= [4, 9, 16, 25];
const arr1 = arr.map(item => item+2)
console.log(arr)
console.log(arr1)

注:

foreach遍历数组,不会有返回值

map遍历数组,返回处理后的新数组

every判断数组中每一个元素是否符合某个条件,返回一个布尔值

some判断数组中是否有元素符合某个条件,返回一个布尔值

filter筛选数组中满足条件的元素,返回筛选后的新数组

find:返回符合条件的第一个对象

相关推荐
程序员Sunday7 小时前
JavaScript 事件循环面试题,宏任务与微任务怎么执行|Sunday面试指南
开发语言·javascript·面试·校招·事件循环·程序员sunday
Setsuna_F_Seiei7 小时前
前端转型 Agent 开发 06 之 Agent Memory 记忆系统(让 Agent 更智能,更懂你)
前端·agent·ai编程
志尊宝8 小时前
Vue3 零基础每日笔记(073):keep-alive 页面缓存实战——列表页返回不丢状态
vue.js·笔记·缓存·#vue #前端 #前端开发·#javascript·#vue.js
zhangzeyuaaa8 小时前
Ruby 多线程、GVL(GIL)与 Mutex 完全指南
开发语言·前端·ruby
默_笙8 小时前
🌊 向量库和 ES 都查不出"关系",我只好给奶茶建了一张人脉网
前端·javascript
优选资讯9 小时前
标签打印软件怎么对接 Excel 数据
前端·excel
思无邪669 小时前
用 AI 做 JS 逆向:从抓包到复现的完整方法论
开发语言·javascript·人工智能
一个风轻云淡10 小时前
GCC 和 GDB命令简单解读
java·linux·前端
u01110267510 小时前
图片处理接口如何统一错误信息 前端提示与后端错误码设计
前端·状态模式
福兮说11 小时前
浏览器里把 iPhone 的 HEIC 转成 JPG:Chrome 解不开、转完大了七成、拍摄时间全丢,六个坑实测
前端·javascript·图像处理·chrome·ios·iphone·heic