gpt4 book ai didi

javascript - 为什么 Javascript 对象点表示法会导致错误?

转载 作者:行者123 更新时间:2023-12-02 23:10:53 26 4
gpt4 key购买 nike

我读过很多关于 Javascript 中点表示法和括号表示法之间差异的文章。我的理解如下。

点符号:

  • 属性标识只能是字母数字(以及 _ 和 $)
  • 属性标识符不能以数字开头。
  • 属性标识符不能包含变量。
  • 好的 — obj.prop_1、obj.prop$
  • 不正常 — obj.1prop、obj.prop 名称

括号表示法:

  • 属性标识符必须是字符串或引用字符串的变量。
  • 可以使用变量、空格和以数字开头的字符串
  • 好的 — obj["1prop"], obj["prop name"]

所以我仍然不明白为什么如果我在下面的示例中使用点符号而不是括号符号,我的 linter 会抛出错误。

    this.contactConfig = {
"prop": "addresses",
groups: [
{
"label": "Physical Address",
"type": "address",
"prop": 'physical_address',
"controls": [
{
"label": "Address Line 1",
"prop": "address1"
},
{
"label": "Address Line 2",
"prop": "address2"

},
{
"label": "City",
"prop": "city"

},
{
"label": "State",
"prop": "state",
"type": "dropdown"

},
{
"label": "Zip Code",
"prop": "zipcode"
}
]
},
{
"label": "Mailing Address",
"type": "address",
"prop": "mailling_address",
"same": false,
"controls": [
{
"label": "Address Line 1",
"prop": "mailing_address1"

},
{
"label": "Address Line 2",
"prop": "mailing_address2"

},
{
"label": "City",
"prop": "mailing_city"
},
{
"label": "State",
"prop": "mailing_state",
"type": "dropdown"
},
{
"label": "Zip Code",
"prop": "mailing_zipcode"
}
]
},
{
"label": "Contact",
"prop": "contact",
"controls": [
{
"label": "Email",
"prop": "email"
},
{
"label": "Primary Phone Number",
"prop": "primary_phone_number"
},
{
"label": "Secondary Phone Number",
"prop": "secondary_phone_number"
}
]
}
]
}

this.profileForm = new FormGroup({});
this.contactConfig["groups"].forEach(group => {
console.log('group', group)
group.controls.forEach(control => {
this.formControlService.addFormGroupToFormGroup(this.profileForm, group);
})
})

如果我使用点表示法,我的 linter 会抛出以下错误:Property 'groups' does not exist on type '{}'.

如果我将代码更改为 "groups" groups我仍然遇到同样的错误。有什么想法为什么我必须使用括号表示法吗?

TSLint 错误。 enter image description here

最佳答案

您可以将它与括号表示法一起使用。您只是有一个语法错误:

this.contactConfig['groups]'

应该是:

this.contactConfig['groups']

this.contactConfig = {
prop: "addresses",
groups: [
{
label: "Physical Address",
type: "address",
prop: 'physical_address',
controls: [
{
label: "Address Line 1",
prop: "address1"
},
{
label: "Address Line 2",
prop: "address2"

},
{
label: "City",
prop: "city"

},
{
label: "State",
prop: "state",
type: "dropdown"

},
{
label: "Zip Code",
prop: "zipcode"
}
]
},
{
label: "Mailing Address",
type: "address",
prop: "mailling_address",
same: false,
controls: [
{
label: "Address Line 1",
prop: "mailing_address1"

},
{
label: "Address Line 2",
prop: "mailing_address2"

},
{
label: "City",
prop: "mailing_city"
},
{
label: "State",
prop: "mailing_state",
type: "dropdown"
},
{
label: "Zip Code",
prop: "mailing_zipcode"
}
]
},
{
label: "Contact",
prop: "contact",
controls: [
{
label: "Email",
prop: "email"
},
{
label: "Primary Phone Number",
prop: "primary_phone_number"
},
{
label: "Secondary Phone Number",
prop: "secondary_phone_number"
}
]
}
]
};

this.contactConfig['groups'].forEach(group => {
console.log('group', group);
group.controls.forEach(control => {
this.formControlService.addFormGroupToFormGroup(this.profileForm, group);
});
});

您也可以使用点表示法:

this.contactConfig = {
prop: "addresses",
groups: [
{
label: "Physical Address",
type: "address",
prop: 'physical_address',
controls: [
{
label: "Address Line 1",
prop: "address1"
},
{
label: "Address Line 2",
prop: "address2"

},
{
label: "City",
prop: "city"

},
{
label: "State",
prop: "state",
type: "dropdown"

},
{
label: "Zip Code",
prop: "zipcode"
}
]
},
{
label: "Mailing Address",
type: "address",
prop: "mailling_address",
same: false,
controls: [
{
label: "Address Line 1",
prop: "mailing_address1"

},
{
label: "Address Line 2",
prop: "mailing_address2"

},
{
label: "City",
prop: "mailing_city"
},
{
label: "State",
prop: "mailing_state",
type: "dropdown"
},
{
label: "Zip Code",
prop: "mailing_zipcode"
}
]
},
{
label: "Contact",
prop: "contact",
controls: [
{
label: "Email",
prop: "email"
},
{
label: "Primary Phone Number",
prop: "primary_phone_number"
},
{
label: "Secondary Phone Number",
prop: "secondary_phone_number"
}
]
}
]
};

this.contactConfig.groups.forEach(group => {
console.log('group', group);
group.controls.forEach(control => {
this.formControlService.addFormGroupToFormGroup(this.profileForm, group);
});
});

此外(仅供引用),对于对象文字,您的对象键/属性名称不需要加引号,除非您尝试创建 JSON 字符串。最后,不要依赖自动分号插入,而是自己添加分号,这是一个非常好的主意。

关于javascript - 为什么 Javascript 对象点表示法会导致错误?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/57366863/

26 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com