当试图从对象中获取属性时，得到 UNDEFINED答案

【问题标题】：When trying to get propertis from object, get UNDEFINED当试图从对象中获取属性时，得到 UNDEFINED
【发布时间】：2020-01-30 11:03:53
【问题描述】：

我在获取对象道具时遇到问题...

这是我的 json 文件

formControlOptions: any[] = [
    {
        { type: "INPUT",
            value: "none,"
        }
    },
    {
        type: "SELECT_BOX",
            value: "none",
            options: ["select option 1", "select option 2", "select option 3"]

    },
    {
        type: "RADIO_BTN",
            value: "none",
            options: ["radio option 1", "radio option 2", "radio option 3"]

    }
];

这是我尝试获取数据的地方。我也尝试制作JSON.parse()，但我总是得到UNDEFINED

for (let v of this.formControlOptions) {
            if (Object.keys(v) === "INPUT") {
                console.log(v); // { INPUT: { value: "none" })
                console.log(typeof v); // object
                console.log(v.value); // undefined
                console.log(Object.keys(v).value); // undefined
                console.log(JSON.parse(v).value); // undefined
            }

【问题讨论】：

你真的应该停止使用 == 来处理你不明确想要松散等于的场景。
这只是举例......在这种情况下，我会像我期望的那样得到真实并得到所有console.logs
另外，你正在通过反复试验进行编程 - 你已经登录了v，你想要v.INPUT.value。
v.value 未定义，因为 v 是一个对象 = {INPUT: { value: "none" }}，因此您必须检查 v.INPUT.value，但我不确定您要在这里实现什么。我建议您更改 json 的结构。因此，可能会在其中保存输入类型的位置添加一个名为 type 的键。如果您不理解这一点，我可以更好地解释。
"这是我的 json 文件" 那不是 JSON。这是一个数组。 JSON 是 JavaScript 对象的字符串表示形式。正如您所注意到的，typeof v 不是字符串。如果不是字符串，解析 JSON 是没有意义的。

标签： javascript angular typescript

【解决方案1】：

首先，这是一个数组，据我了解，您正在尝试在实际 API 准备就绪时添加待处理的模拟数据。 Object.keys 返回一个包含对象中所有键的数组。所以Object.keys(v) === "INPUT" 是假的。 v.value 未定义，因为 v 是一个没有值作为键的对象。我认为你应该在那里做的是v.INPUT.value。

我建议您更改数组的结构。所以你有：

const formControlOptions: {
  inputType: string;
  label: string;
  defaultValue: string | string[];
  options?: string[];
}[] = [
  {
    inputType: "text",
    label: "Input label",
    defaultValue: ""
  },
  {
    inputType: "select",
    label: "Select label",
    defaultValue: "",
    options: ["select option 1", "select option 2", "select option 3"]
  },
  {
    inputType: "radio",
    label: "Radio label",
    defaultValue: "",
    options: ["select option 1", "select option 2", "select option 3"]
  },
  {
    inputType: "checkbox",
    label: "Checkbox label",
    defaultValue: [],
    options: ["check option 1", "check option 2", "check option 3"]
  }
];

然后您可以映射数组并使用inputType 设置适当的 inputT 类型。

【讨论】：