我正在寻找一个解决方案,我可以在对象声明中使用动态键名(不使用ES6功能,如…或[key]: value)
这是我想到的:
var obj = (obj = {}, obj[field] = 123, obj)
一开始看起来有点复杂,但其实很简单。我们使用逗号操作符在一行中运行三个命令:
Obj ={}:创建一个新对象并将其赋值给变量Obj
Obj [field] = 123:向Obj添加计算属性名
Obj:使用Obj变量作为括号/逗号列表的结果
这种语法可以在函数形参中使用,而不需要显式声明obj变量:
//查看结果的test函数。
函数showObject(obj) {
console.log (obj);
}
//动态字段名。
var field = "myDynamicField";
//调用动态对象的函数。
showObject((obj = {}, obj[field] = 123, obj));
/ *
输出:
{
“myDynamicField”:真的
}
* /
一些变化
“严格模式”解决方案:
上面的代码不能在严格模式下工作,因为没有声明变量“obj”。
// This gives the same result, but declares the global variable `this.obj`!
showObject( (this.obj = {}, obj[field] = 123, obj) );
在初始化器中使用计算属性名的ES2015代码:
// Works in most browsers, same result as the other functions.
showObject( {[field] = 123} );
这个解决方案适用于所有现代浏览器(但不适用于IE,如果我需要提及的话)
使用JSON.parse()的超级hack方式:
// Create a JSON string that is parsed instantly. Not recommended in most cases.
showObject( JSON.parse( '{"' + field +'":123}') );
// read: showObject( JSON.parse( '{"myDynamicfield":123}') );
键中允许有特殊字符
注意,还可以在计算属性名中使用空格和其他特殊字符(在JSON.parse中也是如此)。
var field = 'my dynamic field :)';
showObject( {[field] = 123} );
// result: { "my dynamic field :)": 123 }
这些字段不能使用点(obj.)访问。My dynamic field:)显然在语法上是无效的),但只能通过括号符号,即obj[' My dynamic field:)']返回123