最近项目中用到的操作数据的一些简便方法

225 阅读1分钟

1 find
适用场景
根据唯一标示列如id去拿到匹配的数据

let arr = [{
    id:1,name:'xiaoming',age:18
},{
    id:5,name:'xiaoming',age:12
},{
    id:3,name:'xiaoming',age:11
}]
let id = 5;
let source= arr.find((item)=>{
  return item.id === id;
})
console.log(source)//{ id: 5, name: 'xiaoming', age: 12 }

定义和用法
find找到符合条件的元素,就不会再往下找了,不会改变原数组 ,没找到返回undefined
2 filuter
适用场景
重新筛选数组

let arr = [{
  id:1,name:'xiaoming',age:18
},{
  id:5,name:'xiaoming',age:12
},{
  id:5,name:'xiaohong',age:11
}]
let name = 'xiaoming';
let source= arr.filter((item)=>{
  return item.name === name;
})
console.log(source)//[ { id: 1, name: 'xiaoming', age: 18 },{ id: 5, name: 'xiaoming', age: 12 } ]


定义和用法
filuter返回的是个数组,不会改变原数组,没找到返回的是一个[]
3 map
适用场景
for循环带回调的方法

let arr = [{
  id:1,name:'xiaoming',age:18
},{
  id:5,name:'xiaoming',age:12
},{
  id:5,name:'xiaohong',age:11
}]
let name = 'xiaoming';
let source= arr.filter((item)=>{
  return item.name === name;
})
console.log(source)//[ { id: 1, name: 'xiaoming', age: 18 },{ id: 5, name: 'xiaoming', age: 12 } ]


定义和用法
map返回一个新数组,数组中的元素为原始数组元素调用函数处理后的值,不会改变原数组,
3 fill
适用场景
for循环带回调的方法

let arr = [{
  id:1,name:'xiaoming',age:18
},{
  id:5,name:'xiaoming',age:12
},{
  id:5,name:'xiaohong',age:11
}]
let name = 'xiaoming';
let source= arr.filter((item)=>{
  return item.name === name;
})
console.log(source)//[ { id: 1, name: 'xiaoming', age: 18 },{ id: 5, name: 'xiaoming', age: 12 } ]


定义和用法
fill 替换数组中某一个arr.fill(value, start, end)

组合用法

1 删除指定元素
arr.splice(arr.findIndex(item => item.id === 8), 1)