Learn a few advanced reduction patterns: flatten allows you to merge a set of arrays into a single array, the dreaded flatmap allows you to convert an array of objects into an array of arrays which then get flattened, and reduceRight allows you to invert the order in which your reducer is applied to your input values.

Flatten

var data = [[1,2,3], [4,5,6], [7,8,9]];
var flatData = data.reduce( (acc, value) => {
return acc.concat(value);
}, []); console.log(flatData); //[1, 2, 3, 4, 5, 6, 7, 8, 9]

Flatmap

var input = [
{
title: "Batman Begins",
year: 2005,
cast: [
"Christian Bale",
"Michael Caine",
"Liam Neeson",
"Katie Holmes",
"Gary Oldman",
"Cillian Murphy"
]
},
{
title: "The Dark Knight",
year: 2008,
cast: [
"Christian Bale",
"Heath Ledger",
"Aaron Eckhart",
"Michael Caine",
"Maggie Gyllenhal",
"Gary Oldman",
"Morgan Freeman"
]
},
{
title: "The Dark Knight Rises",
year: 2012,
cast: [
"Christian Bale",
"Gary Oldman",
"Tom Hardy",
"Joseph Gordon-Levitt",
"Anne Hathaway",
"Marion Cotillard",
"Morgan Freeman",
"Michael Caine"
]
}
]; var flatMapInput = input.reduce((acc, value)=>{
value.cast.forEach((star)=>{
if(acc.indexOf(star) === -1){
acc.push(star);
};
}); return acc;
}, []); //["Christian Bale", "Michael Caine", "Liam Neeson", "Katie Holmes", "Gary Oldman", "Cillian Murphy", "Heath Ledger", "Aaron Eckhart", "Maggie Gyllenhal", "Morgan Freeman", "Tom Hardy", "Joseph Gordon-Levitt", "Anne Hathaway", "Marion Cotillard"]

ReduceRight

var countDown = [1,2,3,4,"5"];

var str = countDown.reduceRight((acc, value)=>{
return acc + value;
}, ""); console.log(str); //"54321"

[Javascript] Advanced Reduce: Flatten, Flatmap and ReduceRight的更多相关文章

  1. [Javascript] Advanced Reduce: Common Mistakes

    Take away: Always check you ruturn the accumulator Always pass in the inital value var data = [" ...

  2. [Javascript] Advanced Reduce: Additional Reducer Arguments

    Sometimes we need to turn arrays into new values in ways that can't be done purely by passing an acc ...

  3. [Javascript] Advanced Reduce: Composing Functions with Reduce

    Learn how to use array reduction to create functional pipelines by composing arrays of functions. co ...

  4. JavaScript中reduce()方法

    原文  http://aotu.io/notes/2016/04/15/2016-04-14-js-reduce/   JavaScript中reduce()方法不完全指南 reduce() 方法接收 ...

  5. JavaScript: Advanced

    DOM 1. 节点 getElementsByName方法 <!DOCTYPE HTML> <html> <head> <script type=" ...

  6. [Javascript] Advanced Console Log Arguments

    Get more mileage from your console output by going beyond mere string logging - log entire introspec ...

  7. [Javascript] Introducing Reduce: Common Patterns

    Learn how two common array functions - map() and filter() - are syntactic sugar for reduce operation ...

  8. javascript之reduce()方法的使用

    以前看到reduce方法,总是看得我头皮发麻,今天无意间又遇到他了,于是学习了下,接触之后,觉得这个方法还挺好用的,在很多地方都可以派上用场,比如,数组中元素求和.数组去重.求数组中的最大值或最小值等 ...

  9. JavaScript map reduce

    23333333333333 map var s = []; for(let i=0;i<10;i++){ s.push(i); } function pow(x){ return x*x; } ...

随机推荐

  1. 认识<hr>标签,添加水平横线

    在信息展示时,有时会需要加一些用于分隔的横线,这样会使文章看起来整齐些.如下图所示: 语法: html4.01版本 <hr> xhtml1.0版本 <hr /> 注意: 1.  ...

  2. MTP设备无法安装驱动的解决办法

    1,进入设备管理器右击带黄色问号的MTP,选择“属性”,“详细信息”“设备范例 ID”(用Ctrl+C复制). 2,找到c:\windows\inf\wpdmtp.inf打开(或者通过运行打开),找到 ...

  3. Bit Map解析

    1. Bit Map算法简介 来自于<编程珠玑>.所谓的Bit-map就是用一个bit位来标记某个元素对应的Value, 而Key即是该元素.由于采用了Bit为单位来存储数据,因此在存储空 ...

  4. WebAPI接口测试之matthewcv.WebApiTestClient

    WebAPI接口测试之matthewcv.WebApiTestClient matthewcv.WebApiTestClient 1.安装matthewcv.WebApiTestClient包 打开v ...

  5. Entity Framework中实现指定字段更新

    foreach (var entity in databasePatents) { var patentTmp = sourcePClist.FirstOrDefault(p => p.Oid ...

  6. Spring Cp30配置

    1.配置db.properties <bean id= "propertyConfigurer" class="org.springframework.beans. ...

  7. select 1 from table where的作用?

    "SELECT 1 FROM identity_approve WHERE identity_num=' " . trim($_POST['IDnumber']) . " ...

  8. Automatically watermark all uploaded photos (给所有上传的相片加水印)

    Hello, This mod automatically watermark all uploaded photos. Price: FREE, enjoy. You will have to ed ...

  9. 蟠桃记 AC 杭电

    蟠桃记 Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 65536/32768 K (Java/Others) Total Submis ...

  10. 之前采用的是Helper类的方法重构时改用了扩展方法

    在手机端输入网址不方全,通常会将网址做成一个二维码,然后用手机扫一下就可以打开预览.我们每改一下样式,就在手机上点一下刷新或电脑上按一下F5,这在最初的时候,也不觉得有什么问题,因为拿到我手上的静态页 ...