使用过滤器返回对象中的属性值

Posted 2023-02-27

【中文标题】使用过滤器返回对象中的属性值

【英文标题】：use filter to return property values in an object

【发布时间】：2015-09-20 23:14:04

【问题描述】：

尝试创建一个使用过滤器但不使用 for 或 while 循环或 foreach 函数的函数，该函数将遍历对象数组，仅返回其属性值。例如，

function getShortMessages(messages) 
    return messages.filter(function(obj)
        return obj.message
    );

所以如果我打电话给

getShortMessages([message:"bleh",message:"blah"]); 

我应该得到一个数组的返回 = ["bleh","blah"] 我只是不确定如何根据这些准则实施过滤器。我也在考虑使用链函数，也许是 .map。

//// 这是整个代码挑战规范/////

基本：过滤器 18 题中的第 4 题

任务

使用 Array#filter 编写一个名为 getShortMessages 的函数。

getShortMessages 采用具有“.message”属性的对象数组，并返回长度小于

该函数应该返回一个包含消息本身的数组，而不是包含它们的对象。

参数

消息：一个由 10 到 100 个随机对象组成的数组，看起来像这样：

    message: 'Esse id amet quis eu esse aute officia ipsum.' // random

条件

不要使用任何 for/while 循环或 Array#forEach。 不要创建任何不必要的函数，例如帮手。

提示

尝试链接一些 Array 方法！

示例

[ 'Tempor quis esse consequat sunt ea eiusmod.',
  'Id culpa ad proident ad nulla laborum incididunt.',
  'Ullamco in ea et ad anim anim ullamco est.',
  'Est ut irure irure nisi.' ]

资源

https://developer.mozilla.org/en-US/docs/Web/javascript/Reference/Global_Objects/Array/filter https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/map

样板

function getShortMessages(messages) 
  // SOLUTION GOES HERE


module.exports = getShortMessages

» 要再次打印这些说明，请运行：functional-javascript print » 要在测试环境中执行您的程序，请运行：functional-javascript run program.js » 要验证您的程序，请运行：functional-javascript verify program.js » 获取帮助运行：functional-javascript help

【问题讨论】：

你想要.map()，而不是.filter()。 （您可能想阅读some documentation about .filter()。）

事情是，我正在做一个 javascript 代码挑战，他们说我需要使用 .filter，这就是我感到困惑的原因。

要么你误解了，要么他们的问题是错误的。 .filter() 返回一个包含原始数组元素的新数组。它不会改变这些元素。

他们希望您使用filter 仅接收长度小于或等于 50 个字符的消息。

@codemonkey 我更新了我的答案以匹配更新后的问题。

【参考方案1】：

当您想要获取与预期属性匹配的整个对象时，请使用.filter。当您有一系列事物并希望对这些事物进行一些操作并获得结果时，请使用.map。

挑战是获取所有不超过 50 个字符的消息。因此，您可以使用filter 仅获取通过该测试的消息，然后使用map 仅获取消息文本。

function getShortMessages(messages) 
  return messages
    .filter(function(obj) 
      return obj.message.length <= 50;
    )
    .map(function(obj) 
      return obj.message;
    );

JSFiddle：http://jsfiddle.net/rbbk65sq/

如果输入对象可能没有message 属性，您可能需要像这样使用obj.message && obj.message.length <= 50 对其进行测试：

function getShortMessages(messages) 
  return messages
    .filter(function(obj) 
      return obj.message && obj.message.length <= 50;
    )
    .map(function(obj) 
      return obj.message;
    );

ES6

ES6 中相同的代码示例：

const getShortMessages = (messages) => messages
  .filter(obj => obj.message.length <= 50)
  .map(obj => obj.message);

如果输入对象可能没有message 属性：

const getShortMessages = (messages) => messages
  .filter(obj => obj.message && obj.message.length <= 50)
  .map(obj => obj.message);

JSFiddle：http://jsfiddle.net/npfsrwjq/

【讨论】：

这很奇怪，因为这应该可以工作，因为我知道它应该可以，但是当我在程序下运行它时，它说 typeError: cannot read property 'length' of undefined.

这意味着当过滤器遍历对象时，一个或多个没有.message 属性——也许有些根本没有消息？我会用那个变体更新我的答案。

我认为 flatMap 也可以工作并提供更简单的解决方案

【参考方案2】：

虽然我知道这个帖子太老了，但我觉得有必要发表评论，以防有人再次偶然发现它。我会像上面那样使用这样的 es6 语法：

objects.filter(obj => obj.key === 'value').map(filteredObj => filteredObj.key);

所以上面的例子是：

getShortMessages = (messages) => messages.filter(obj => obj.message.length <= 50).map(obj => obj.message);

【参考方案3】：

带有自定义返回值（简单的 ES6 示例）；

const customReturnFiltere = (result) => 
    return products.filter((obj) => 
      return obj.stock !== 0;
    )
    .map((finalResult) => 
        return 
          ...finalResult,
          info: 'product will be filtered if stock is 0'
        
    );

【参考方案4】：

如果有人正在寻找单次通过，可以通过.reduce() 完成

所以不要这样做：

const getShortMessages = (messages) => messages
  .filter(obj => obj.message.length <= 50)
  .map(obj => obj.message);

你可以这样做：

const getShortMessages = (messages) => 
  return messages.reduce((shortMessages, i) => 
    if (i.message.length <= 50) 
      shortMessages.push(i.message)
    
    return shortMessages
  ,[])

或者如果你想要更短的手：

const getShortMessages = (messages) => messages.reduce((shortMessages, item) => (item.message.length <= 50) 
    ? shortMessages=[...shortMessages,item.message] : shortMessages,[])

【讨论】：

我真的希望更多的人能做到这一点，我来这里也是为了说同样的话......使用reduce 比使用filter 和map 更有效。

【参考方案5】：

另外，我正在使用带有过滤器的 ES6 Destructure 并比较两个对象数组。最后映射我实际需要的特定字段。

初始化

const bumperDealRules =[]; // Array object
const cartItems =[]; // Array object

最终代码

const bumperDealsSelected = bumperDealRules.filter(
            ( item_display_id: item_display_id, purchasequantity: purchasequantity ) 
            => cartItems.some(( id: id, action_from: action_from, order_qty:  order_qty ) 
            => id === item_display_id && purchasequantity <= order_qty &&  action_from == 'bumper_deal' ) 
        ).map(function(obj) 
            return  
                bumper_deal_company_name_id: obj.bumper_deal_company_name_id, 
                from_amount: obj.from_amount,
                to_amount: obj.to_amount,
                discount: obj.discount,
                highest_limit: obj.highest_limit
             ;
          );