JS的一些优雅写法

JS的一些优雅写法

reduce

1、可以使用 reduce 方法来实现对象数组中根据某一key值求和

例如,假设有以下对象数组:

const arr = [ { name: 'apple', price: 2 }, { name: 'banana', price: 3 }, { name: 'orange', price: 4 }, ];

如果要根据price属性求和,可以使用以下代码:

const sum = arr.reduce((acc, cur) => acc + cur.price, 0); console.log(sum); // 9

image.png

其中,reduce方法的第一个参数是一个回调函数,它接收两个参数:累加器(acc)和当前元素(cur)。回调函数的返回值会作为下一次调用回调函数时的累加器的值。reduce方法的第二个参数是累加器的初始值,这里设置为0。

在回调函数中,我们将累加器和当前元素的price属性相加,最终得到了所有元素的price属性的总和。

map

1、可以使用map方法来实现对象数组中根据某一key值,取得另外一个key的值。

例如,假设有以下对象数组:

const arr = [ { name: 'apple', price: 2 }, { name: 'banana', price: 3 }, { name: 'orange', price: 4 }, ];

如果要根据name属性获取price属性,可以使用以下代码:

const prices = arr.map(item => item.name === 'banana' ? item.price : null); console.log(prices); // [null, 3, null]

image.png

其中,map方法的参数是一个回调函数,它接收一个参数:当前元素(item)。回调函数的返回值会作为新数组的元素。在回调函数中,我们判断当前元素的name属性是否等于'banana',如果是,则返回当前元素的price属性,否则返回null。最终得到了一个新数组,其中只有name属性为'banana'的元素的price属性有值,其他元素的price属性为null。

2、可以使用map方法来获取对象数组中根据某一key值得到的元素的price属性,可以使用find方法来实现。

例如,假设有以下对象数组:

const arr = [ { name: 'apple', price: 2 }, { name: 'banana', price: 3 }, { name: 'orange', price: 4 }, ];

如果要根据name属性获取price属性,可以使用以下代码:

const banana = arr.find(item => item.name === 'banana'); if (banana) { console.log(banana.price); // 3 }

image.png

其中,find方法的参数是一个回调函数,它接收一个参数:当前元素(item)。回调函数需要返回一个布尔值,表示当前元素是否符合条件。find方法会返回符合条件的第一个元素,如果没有符合条件的元素,则返回undefined。

在回调函数中,我们判断当前元素是否banana,如果是,则返回当前元素。最终得到了一个对象,其中只有name属性为'banana'的元素的price属性有值,其他元素price属性为undefined。我们可以使用if语句来判断是否找到了符合条件的元素,如果找到了,则输出它的price属性。

点赞
收藏

评论区

加载中...

相关推荐

js 的 forEach,map,filter,some,every,find(es6),reduce详解

forEach()定义和用法forEach()方法用于调用数组的每个元素,并将元素传递给回调函数注意:forEach()对于空数组是不会执行回调函数的。语法array.forEach(function(currentValue,index,arr),thisValue)参数function(currentValue,index,a

什么是回调函数?

原文链接:什么是回调函数?简单的来说,一个函数作为另外一个函数的参数,可以称为回调函数。这个理解其实不完全对,回调的意义根本没有体现出来,何为回调?也就是说一个函数你定义了,你没有马上的去调用它,而是交给了另外一个函数去调用,这才属于回调函数。缺点直接使用

Promise从入门到拿Offer之手写Promise

1、Promise构造函数的实现Promise构造函数用来声明示例对象,需要传入一个执行器函数。其中包括resolve函数和reject函数,以及几个重要的属性:状态属性、结果属性和回调函数队列。构造函数的基本框架resolve函数用于异步处理成功后调用的函数。其中包括验证对象状态修改次数,修改promise实例对象状态,异步调用成功的回调函数

mysql中时间比较的实现

MySql中时间比较的实现unix\_timestamp()unix\_timestamp函数可以接受一个参数,也可以不使用参数。它的返回值是一个无符号的整数。不使用参数,它返回自1970年1月1日0时0分0秒到现在所经过的秒数,如果使用参数,参数的类型为时间类型或者时间类型的字符串表示,则是从1970010100:00:0

JS 对象数组Array 根据对象object key的值排序sort,很风骚哦

有个js对象数组varary\{id:1,name:"b"},{id:2,name:"b"}\需求是根据name或者id的值来排序,这里有个风骚的函数函数定义:function keysrt(key,desc) {  return function(a,b){    return desc ? ~~(ak

AVIOInterruptCB结构体分析

1AVIOInterruptCB结构体定义在/usr/include/libavformat/avio.h中有如下的结构体定义,根据头文件中的注释:这是一个回调函数和参数的结构体。有些函数是在阻塞的,用这个回调函数来检查是否中断这个阻塞函数,如果回调函数返回1,那么这个正在阻塞的操作将被中止。那么就用这个结构体里的参数opaque来回调其中的callb