在underscore.js中通过对象键查找

Question

我有以下对象

{ join: {} }

我想从下面的数组中找到它的默认对象

[
    { login: { label: 'Login', url: '#login' } },
    { join: { label: 'Join', url: '#join', theme: 'a' } },
    { home: { label: 'none', icon: 'home', url: '#', theme: 'a' } }
]

我想循环遍历数组并匹配键，这里的键是'join'。

以下是我目前的代码：

 var butt_to_find = { join: {} }
 var all_buttons = 'array above'
 var matching = _.find(all_buttons, function(default_button){
 return if default_butt key @ 1 is the same as butt_to_find key @ 1;
  });

在听了那么多关于Underscore的内容之后，这是我第一次使用它。非常欢迎任何帮助。

- Chin

---

一个小细节（与主题无关）：您正在使用 label: 'none'。毫无疑问，使用label: null（或省略label属性）更准确地表示此内容是更好的方式，这样写可以避免在 UI 中实际呈现出单词“none”。 - davidchambers

Answer 1

var buttons = [
  { login: { label: 'Login', url: '#login' } },
  { join: { label: 'Join', url: '#join', theme: 'a' } },
  { home: { label: 'none', icon: 'home', url: '#', theme: 'a' } }
]

_.find(buttons, function (button) { return 'join' in button })

问题在于你正在使用一种次优的数据结构。以下代码更合理，可以产生更简单的代码：

var buttons = {
  login: {label: 'Login', url: '#login'},
  join: {label: 'Join', url: '#join', theme: 'a'},
  home: {label: 'none', icon: 'home', url: '#', theme: 'a'}
}

buttons.join // equivalent to the `_.find` line in the first example (but much simpler)

也许你正在使用数组因为按钮的顺序很重要。在这种情况下，我会使用一个由数组组成的数组：

var buttons = [
  ['login', {label: 'Login', url: '#login'}],
  ['join', {label: 'Join', url: '#join', theme: 'a'}],
  ['home', {label: 'none', icon: 'home', url: '#', theme: 'a'}]
]

_.find(buttons, function (button) { return button[0] === 'join' })

- davidchambers

---

感谢您提供指针 - 让我思考数据结构真正有所帮助。 - Chin

顺序保留的话，我不建议使用数组嵌套数组的方式。可以用一个键的数组来维持顺序，再将按钮对象保持原样。例如：var buttons = {...}; var buttonsOrder = [ 'login','join','home']; 这样做就只需要在需要排序时迭代数组，在需要查找项目时可以进行即时查找。 - webnesto

Answer 2

var matching =
( _.find
  ( all_buttons,
    function (button)
    { return _.keys(butt_to_find)[0] in button;
    }
  )
);

当_.keys(butt_to_find)的结果为['join']时（即butt_to_find的键值），_.keys(butt_to_find)[0]的结果为'join'（该数组的第一个元素），而_.keys(butt_to_find)[0] in button的结果取决于button是否包含'join'作为键，可能是true或false。（in运算符是JavaScript中的常规运算符，而不是underscore.js添加的内容。）

- ruakh

Answer 3

var def = {join: {}}
var defs = [
    { login: { label: 'Login', url: '#login' } },
    { join: { label: 'Join', url: '#join', theme: 'a' } },
    { home: { label: 'none', icon: 'home', url: '#', theme: 'a' } }
]
_.find(defs,function(item,key){
    return _.has(item,_.keys(def)[0])
})

您也可以切换到lodash库（underscore的替代版本）并执行此操作

_.compact(_.pluck(defs,_.keys(def)[0]))

- Shanimal