为何传入函数的参数无法作为对象的键名使用？

嘿，这个问题其实是JavaScript对象字面量的一个常见小坑～

你写的{x: y}这种语法里，键名x会被直接当作字符串字面量处理，而不是去读取变量x的值。所以不管你传入的x是'cat'还是别的什么，对象的键都会是字符串"x"，这就是为什么你看不到'cat'作为键名的原因，箭头函数里也是一样的逻辑哦。

解决办法有两种： #

• 使用ES6的计算属性名：把键名用方括号[]包裹起来，这样JavaScript就会计算括号里表达式的值，把它作为对象的键名。修改后的代码长这样：

"use strict";
let functionTest = function(x, y) {
  return console.log({[x]: y}); 
}
functionTest('cat', 153); // 现在会输出 {cat: 153}

箭头函数版本也一样：

"use strict";
let functionTest = (x, y) => console.log({[x]: y});
functionTest('cat', 153); // 同样输出 {cat: 153}

• 先创建空对象再动态赋值：如果需要兼容ES6之前的环境，可以用这种方式：

"use strict";
let functionTest = function(x, y) {
  let result = {};
  result[x] = y;
  return console.log(result);
}
functionTest('cat', 153); // 输出 {cat: 153}

简单来说，静态的对象键名直接写标识符就好，但要把变量的值作为键名，就得用计算属性名或者动态赋值的方式啦～

内容的提问来源于stack exchange，提问作者DR01D