es6下的高级函数

最新推荐文章于 2022-09-28 20:06:50 发布

原创最新推荐文章于 2022-09-28 20:06:50 发布 · 744 阅读

1 ·

CC 4.0 BY-SA版权

文章标签：

#javascript #vue.js

本文介绍了ES6中的高级函数用法，包括filter用于筛选数组元素，map用于对数组元素进行操作并返回新数组，reduce用于对数组进行累积计算。此外，还讲解了如何通过split筛选数组，去除空值以及实现数组去重。同时，探讨了对象操作，如使用Object.keys获取对象的key，Object.values获取对象的value，以及indexOf查找字符串在数组中的位置。

flter函数返回一个新的数组每次会根据条件进行一次判断支返回为true的一项。
map函数对数组的每一项进行操作返回每一项的数组。
数组对象可以直接取出自己想要的对象

let arr = [{
        id: 1,
        name: "tony",
        class: 1,
        garde: 88
   },{
        id: 2,
        name: "Tom",
        class: 1,
        grade: 90
   },{
        id: 3,
        name: "Jack",
        class: 1,
        grade: 86
   }];
let res = arr.map(({name, id}) => ({ id, name }))
 console.log(res)

reduce 第一参数是上次返回的值第二个参数是这一次使用的值。
split 筛选数组 arr.splilt(’-’,3);参数二是返回数组的前三项。
去掉空数组空字符串、undefined、null

var newArr = arr.filter(item => item)

数组去重

var arr = [1, 2, 2, 3, 4, 5, 5, 6, 7, 7,8,8,0,8,6,3,4,56,2];
var arr2 = arr.filter((x, index,self)=>self.indexOf(x)===index)  
console.log(arr2); //[1, 2, 3, 4, 5, 6, 7, 8, 0, 56]

//此处的self其实就是arr原数组

对象
Object.keys(arr);可以获取对象的key
Object.values(arr);可以获取对象的value值
indexOf返回某个指定的字符串值在字符串中首次出现的位置。

const arr = [1,2,3,4,5,6,7]
const list = [
    {openId: 1, timelineId: 1, showNo: 1, uid: 1},
    {openId: 2, timelineId: 1, showNo: 1, uid: 1},
    {openId: 9, timelineId: 1, showNo: 1, uid: 1},
    {openId: 4, timelineId: 1, showNo: 1, uid: 1},
    {openId: 5, timelineId: 1, showNo: 1, uid: 1}
]
const params = list.filter(item=> arr.indexOf(item.openId) > -1)
console.log(params)