开发者问题收集

在 JavaScript 中定义对象

2012-03-02
1381
javascript object

我想在 javascript 中定义以下对象： 

var property = 'foo';
var value = 'bar';
var obj = {
    property: value;
};

这将导致以下结果： 

obj.property <-> 'bar';
obj.foo <-> undefined

这是正常的，但如何定义要获取的对象： 

obj.foo = 'bar';

可能的解决方案是： 

var obj = {};
obj[property] = value;

或 

var obj = new Object();
obj[property] = value;

但是当必须定义如下对象时，这并不方便： 

var obj = {
    o1: {
        oo1: {
            property: value;
        }
    }
};

同样，我想要的是： 

var property = 'foo';
var value = 'bar';
var obj = {
    property: value;
}; 
alert(obj.foo); // I want this to alert: 'bar'

您如何处理类似的情况？ 谢谢！

3个回答

如果我理解正确的话，您希望在对象的构造函数中使用来自全局范围的变量，并且深度达到多个级别。除此之外，说得客气一点，这很冒险，因为实际上不可能确定这些变量的值，您可以像这样指定范围： 

var property = 'foo';
var value = 'bar';
var obj = {val : window.value};//doesn't work for property id's
var obj[window.property] = obj.val;
alert(obj.foo);//alerts 'bar'

或者，让您的构造函数接受参数： 

function Foobar(prop,val)
{
    this[prop] = val;
}
var obj = new Foobar('foo','bar');
alert(obj.foo);//alerts 'bar'

在我的第二个示例中，嵌套对象可以使用传递给其“父级”/包含对象的参数，如下所示： 

function Foobar(prop,val)
{
    Foobar.prop = prop;
    Foobar.val = val;
    ...
    this.subObj = {};
    this.subObj[Foobar.prop] = Foobar.val;//var prop from scope Foobar, same as window
}

利用函数或对象的变量可以设为静态的事实，您甚至可以执行如下操作： 

Foobar.prop = (typeof Foobar.prop !== 'undefined' ? Foobar.prop : prop);
//or
Foobar.subObj=  {new Foobar};//extending parent object
Foobar.subObj.newProp = 'newVal';
Elias Van Ootegem
2012-03-02

在 JavaScript 中执行此操作的唯一方法是使用括号： 

var property = 'foo',
    value = 'bar',
    obj = {};

obj[property] = value;

我不确定我是否理解为什么这对您来说不切实际。您能详细说明一下吗？

treeface
2012-03-02

看来您想要一个别名。

如果我理解正确的话，您想要这样做： 

var obj = {something: 'bar'};
alert(obj.foo); // alerts 'bar'

为此，请定义一个 getter。使用原型最简单： 

function Factory() {
}
Factory.prototype = {
    get foo() {
        return this.something;
    }
};

var obj = new Factory;
obj.something = 'bar';
alert(obj.foo); // alerts 'bar'

原型基本上是对象的模型。当您创建一个新的工厂时，结果对象具有 getter“某物”，它返回 foo 的值。这是一种混乱的语法，但它可以满足您的需要。

此外，您可以完全避免使用原型并执行以下操作： 

var obj = {};
obj.__defineGetter__('foo', function () { return this.something; });
obj.something = 'bar';
alert(obj.foo); // alerts 'bar'

使用 __defineSetter 也可以完成相同的操作。这是 ES5 语法，并不适用于所有浏览器（IE），但应该适用于较新的浏览器。

有关更多信息，请参阅 John Resig 的博客 。

beatgammit
2012-03-02