如何使用下划线js添加计算属性?

时间:2014-12-17 20:48:09

标签: javascript underscore.js

我们需要为对象数组添加一个额外的属性。

数组:

var data = [
    {
        event:'event 1',
        status:'Upcoming'
    }
    {
        event:'event 2',
        status:'Completed'
    }
    {
        event:'event 3',
        status:'Canceled'
    }
    ...
]

要根据状态标签的值为状态标签指定不同的颜色,我们希望将数组转换为以下内容:

var result = [
    {
        event:'event 1',
        status:'Upcoming',
        statusCss:'label-success'
    }
    {
        event:'event 2',
        status:'Completed',
        statusCss:'label-info'
    }
    {
        event:'event 3',
        status:'Canceled',
        statusCss:'label-warning'
    }
    ...
]

很容易想出一个JavaScript for循环:

                for (var i = 0; i < data.length; i++) {
                    var t = data[i];
                    if (t.status === 'Upcoming') t.statusCss = "label-success";
                    if (t.status === 'Canceled') t.statusCss = "label-warning";
                    if (t.status === 'Completed') t.statusCss = "label-info";
                    result.push(t);
                }

但是,underscore.js中有什么东西可以用较少的代码处理这种转换吗?

1 个答案:

答案 0 :(得分:1)

你可以使用地图。 Map迭代集合,允许您修改集合中的项目并将这些项目返回到新集合。

data = _.map(data, function(val) {
  if (val.status === 'Upcoming') val.statusCss = "label-success";
  if (val.status === 'Canceled') val.statusCss = "label-warning";
  if (val.status === 'Completed') val.statusCss = "label-info";
  return val;
});

这将继续并修改数据,以便数据包含您之前拥有的相同的对象列表,但具有新属性