有什么方法可以根据外部值来依赖对象中键的存在吗？

Question

我想根据标志值在对象中设置一些键

例如

const ourFlag = true //true or false depends on case

const ourObject = {
  name: 'Pablo',
  secondName: 'Picasso',
  [ourFlag && 'age']: 20,
  [ourFlag && 'moreComplexValue']: [
    {
      val: true
    },
    {
      val: false
    }
  ]
}

只要 ourFlag 设置为 true 一切都按我预期的那样工作，但是当我将它的值更改为 false 时，一些奇怪的事情开始出现。

属性 age 不再存在 - 很好但是属性 moreComplexValue 现在是 false

当标志为 false:

时我得到的代码

{
  name: 'Pablo',
  secondName: 'Picasso',
            // age disappear as I expected
  false: [  //why!?!
    {
      val: true
    },
    {
      val: false
    }
  ]
}

当标志为 true:

时我得到的代码

{ .    //brilliant everything is fine
  name: 'Pablo',
  secondName: 'Picasso',
  age: 20,
  moreComplexValue: [
    {
      val: true
    },
    {
      val: false
    }
  ]
}

有什么方法可以用计算的属性来处理它吗？

Answer 1

问题是 javascript 对象键总是字符串，否则会被类型转换为字符串。

所以，当值是false并且同一个键被使用两次并用第二个值重写时，它变成字符串"false"

要动态设置键，您可以将其设置为未定义或使用 if..else

设置

const ourFlag = true //true or false depends on case

const ourObject = {
  name: 'Pablo',
  secondName: 'Picasso',
}
if(ourFlag) {
  ourObject.age = 20;
  ourObject.moreComplexValue = [
    {
      val: true
    },
    {
      val: false
    }
  ];
}

Answer 2

[flag && key] 的计算结果为 false 或 key，这正是您的文字所做的，将 false 转换为字符串并在标志为假时覆盖它.

一个更好的选择是使用一个对象展开 ...flag && object，它会在 true 的情况下扩展到对象，在 false 的情况下扩展到一个空的 Boolean，因此基本上跳过它.

let ourFlag = true

const a = {
    name: 'Pablo',
    secondName: 'Picasso',
    ...ourFlag && {age: 20},
    ...ourFlag && {moreComplexValue: [1, 2, 3]}
}

ourFlag = false


const b = {
    name: 'Pablo',
    secondName: 'Picasso',
    ...ourFlag && {age: 20},
    ...ourFlag && {moreComplexValue: [1, 2, 3]}
}

console.log(a)
console.log(b)

有什么方法可以根据外部值来依赖对象中键的存在吗？

Is there any way to depend presence of key in Object on external value?

javascript

key

object

ecmascript-6

computed-properties