javascript - 使用枚举作为对象键

标签 javascript

<分区>

我有一个枚举:

   const ingredients = {
      BREAD_BOTTOM: 'BreadBottom',
      BREAD_TOP: 'BreadTop',
      MEAT: 'Meat',
      BACON: 'Bacon',
      CHEESE: 'Cheese',
      SALAD: 'Salad'
   };

现在我想使用这个枚举创建一个成分列表,比如:

    listOfIngredients: {
      ingredients.BREAD_TOP: 1,
      ingredients.BACON: 1,
      ingredients.CHEESE: 2,
      ingredients.MEAT: 2,
      ingredients.BREAD_BOTTOM: 1,
    }

我尝试了一些变体,例如 ${ingredients.BREAD_TOP},但我无法使成分列表以枚举值作为键

最佳答案

您可以将键包装在 [] 中以在将它们用作键之前评估它们的值

const listOfIngredients: {
      [ingredients.BREAD_TOP]: 1,
      [ingredients.BACON]: 1,
      [ingredients.CHEESE]: 2,
      [ingredients.MEAT]: 2,
      [ingredients.BREAD_BOTTOM]: 1,
}

要访问一个值,只需执行以下操作:

console.log(listOfIngredients[ingredients.BREAD_TOP]);

这是一个片段:

let ingredients = {
  BREAD_BOTTOM: 'BreadBottom',
  BREAD_TOP: 'BreadTop',
  MEAT: 'Meat',
  BACON: 'Bacon',
  CHEESE: 'Cheese',
  SALAD: 'Salad'
};

const listOfIngredients= {
      [ingredients.BREAD_TOP]: 1,
      [ingredients.BACON]: 1,
      [ingredients.CHEESE]: 2,
      [ingredients.MEAT]: 2,
      [ingredients.BREAD_BOTTOM]: 1
};

console.log(listOfIngredients[ingredients.BREAD_TOP]);

关于javascript - 使用枚举作为对象键,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/52296113/

相关文章:

javascript - 在 Rails 中调用 javascript 函数 onclick

javascript - 相对路径不起作用,但绝对路径起作用

javascript - 从对象数组中减去对象数组

javascript - 停止冒泡事件似乎在 Internet Explorer 的谷歌页面上不起作用

javascript - 多次触发全局混合 - Vue

javascript - 有没有办法延迟 SVG animateTransform 中的重启

javascript - 隐藏/显示 Canvas 内的图像

javascript - 为什么 Meteor 对这个 IronRouter 代码感到暴躁?

javascript - 按相似数据分组但保留键和值javascript

javascript - 在 next.js/react 中映射时无法访问值