在对象属性中使用变量答案

【问题标题】：Use a variable in object property在对象属性中使用变量
【发布时间】：2013-09-11 17:01:07
【问题描述】：

我为我的 js 使用对象字面量，在下面你可以看到它是“全局”变量。其中之一是一个对象（theBody），它又包含一个称为“body”的数组。该数组包含多个对象（以下示例中只有一个），它们是 svg 对象。

我希望能够从一个名为 bodyColor 的特定变量分配填充值，但是当我更改时：

'fill':'#e59225',

到

'fill': AvGen.theBody.bodyColor,

我收到错误 Uncaught ReferenceError: theBody is not defined

为什么会这样？如何访问对象属性的 bodyColor？

来自 js：

var AvGen = {

    paper: null,
    theBody: {
        bodies: [
            [0,0,277.9,308.5,{
                type:'path',
                'fill':'#e59225',
                'stroke':'none',
                'stroke-width':'0',
                'fill-opacity':'1',
                'stroke-opacity':'0'
            }],
        ],
        currNr: 1,
        currObj: null,
        bodyColor: '#e59225'
    },

    init: function() {

    }
}

【问题讨论】：

test AvGen 是否被定义，只需做一个console.log 来测试它，因为错误明确指定Uncaught ReferenceError: AvGen is not defined
我猜AvGen 是在您尝试使用它之后定义的，或者它是在闭包中定义的并且您引用它的代码不在范围内。
Self-references in object literal declarations 的可能重复项

标签： jquery object properties object-literal

【解决方案1】：

您正在尝试引用尚未定义的内容！您正在尝试使用theBody，但它尚未创建。你可以这样做：

var AvGen = {
    paper: null,
    theBody: {
        bodies: [
            [0,0,277.9,308.5,{
                type:'path',
                'fill': null,
                'stroke':'none',
                'stroke-width':'0',
                'fill-opacity':'1',
                'stroke-opacity':'0'
            }],
        ],
        currNr: 1,
        currObj: null,
        bodyColor: '#e59225'
    },

    init: function() {

    }
}

AvGen.theBody.bodies[0][4].fill = AvGen.theBody.bodyColor;

甚至更好；将bodyColor 完全提取出来：

var bodyColor = "#e59225";
var AvGen = {
    paper: null,
    theBody: {
        bodies: [
            [0,0,277.9,308.5,{
                type:'path',
                'fill': bodyColor,
                'stroke':'none',
                'stroke-width':'0',
                'fill-opacity':'1',
                'stroke-opacity':'0'
            }],
        ],
        currNr: 1,
        currObj: null,
        bodyColor: bodyColor
    },

    init: function() {

    }
}

【讨论】：

【解决方案2】：

检查这个小提琴DEMO。

我认为您的错误是您在使用它的函数之后定义了 AvGen。我首先定义了一个 js 函数，在 AvGen 之后，我遇到了和你一样的错误。

在函数代码解决问题之前移动 AvGen 块。

AvGen = {
paper: null,
theBody: {
    bodies: [
        [0,0,277.9,308.5,{
            type:'path',
            'fill':'#e59225',
            'stroke':'none',
            'stroke-width':'0',
            'fill-opacity':'1',
            'stroke-opacity':'0'
        }],
    ],
    currNr: 1,
    currObj: null,
    bodyColor: '#e59225'
},

init: function() {

}
}
$(document).ready(function(){   
    $('#test').attr('style', 'background-color:' + AvGen.theBody.bodyColor);
});

【讨论】：