使用 es6 数组方法从数组中提取第一个对象答案

【问题标题】：Extract first object from array with es6 array methods使用 es6 数组方法从数组中提取第一个对象
【发布时间】：2017-06-22 08:46:00
【问题描述】：

我有这段代码来获取一个对象的数组：

let selectedShop = initialResultsState.get('products')
        .filter(product => product.shop.selected)

console.log(selectedShop)

结果：

我可以通过将另一个 es6 数组方法串到 filter 的末尾而不是 let newVariable = selesctedShop[0] 来在同一操作中从数组中提取对象吗？

我试图把它串起来：

.map(x => {return { shop: x.shop, products: x.products }})

但它仍然是一个对象的数组，因为 map 总是返回一个新数组。

【问题讨论】：

【解决方案1】：

两种基本方式：

数组方法，可以使用Array.prototype.shift()。

let selectedShop = initialResultsState.get('products')
    .filter(product => product.shop.selected)
    .shift();

您可以通过destructuring assignment 执行此操作。在你的情况下：

let [selectedShop] = initialResultsState.get('products')
    .filter(product => product.shop.selected);

这在 ES6 中可用，主要浏览器支持，无需转译。

但是您可以看到另一种方法，答案（Mikael Lennholm 的答案）是Array.prototype.find()。这可以提高性能。

【讨论】：

pop() 返回（并删除）最后一项而不是第一项。 shift 获取（并删除）第一个。
我实际上建议使用find()，因为这种方法往往会浪费时间和内存来过滤所有匹配的元素以仅提供其中一个。那些迭代器方法很花哨，但它们往往会忽略内存和时间的频繁浪费。
@cepharum 是的，但问题是Extract first object from array with es6 array methods 所以我不推荐Array.prototype.find()
@DanielMizerski 没问题，您的方法很好，但是如果有人正在阅读您的答案（首选答案），那么了解这种方法的缺点并提示坚持使用由下面是 mikael-lennholm。
@cepharum 我将参考 MikaelLennholm 方法

【解决方案2】：

使用find() 方法代替filter() 怎么样？ find() 总是返回单个项目，不包装在数组中，除非它没有找到任何项目，在这种情况下它返回 undefined

let selectedShop = initialResultsState.get('products')
    .find(product => product.shop.selected)

它也更有效率，因为它实际上在找到一个项目后就停止迭代数组。 filter() 将始终遍历整个数组，如果您只对第一个相关项目感兴趣，这是一种浪费。

【讨论】：