Question

我已经阅读了很多有关Java中点表示法和方括号表示法之间差异的信息。我的理解如下。

点符号：

属性标识只能是字母数字（和_和$）
属性标识符不能以数字开头。
属性标识符不能包含变量。
确定-obj.prop_1，obj.prop $
不正常-obj.1prop，obj.prop名称

括号符号

属性标识符必须是字符串或引用字符串的变量。
可以使用以数字开头的变量，空格和字符串
好的-obj [“ 1prop”]，obj [“ prop name”]

所以我仍然不明白为什么我的短绒袜如果使用点表示法而不是方括号表示法会抛出错误。

    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);
        })
    })

如果我使用点符号，我的短毛绒会引发以下错误：Property 'groups' does not exist on type '{}'.

如果我更改代码以使"groups" groups仍然出现相同的错误。关于为什么必须使用方括号符号的任何想法？

TSLint错误。

Answer 1

您可以将其与方括号符号一起使用。您只是其中存在语法错误：

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);
        });
    });

另外（FYI），带有对象文字，除非您试图创建JSON字符串，否则不需要用引号将您的对象键/属性名称加引号。最后，不依赖自动分号插入，而是自己输入分号是一个非常好的主意。

Answer 2

我认为您的问题不在于数据对象的语法，而在于您尝试检索它的方式。

只需对您的对象尝试一下，它就可以正常工作：

this.contactConfig.groups.forEach(group => {
    console.log(group);
});

为什么Javascript对象点表示法会导致错误？

2 个答案: