JavaScript中能否通过其他变量拼接生成动态变量名？

嘿，我懂你想通过拼接现有变量来生成新变量名的需求——虽然你也清楚用数组或对象管理这类变量更合理，但还是想搞清楚有没有办法实现对吧？

首先得说：你尝试的let score_(${p1})_upper_row1;这种写法是不合法的，JavaScript里不能直接用模板字面量来声明变量名，语法上根本通不过。不过我们可以换个思路，用对象属性来模拟这种“动态命名”的效果，既避开了eval的风险，也能达到你想要的目的。

推荐方案：用对象存储（安全易维护） #

用一个对象来集中管理所有分数相关的“动态变量”，本质是把你想要的变量名作为对象的属性名，这样既灵活又不会污染全局作用域：

let p1 = "player1";
let p2 = "player2";
let activePlayer = p2; // 注意你原代码里写的是activePlayers，应该是笔误~

// 创建一个专门存储分数的对象
const scores = {};

if (activePlayer === p1) {
  // 用模板字面量作为属性名，动态赋值
  scores[`score_${p1}_upper_row1`] = 0; // 可以根据需求初始化值，比如0
  scores[`score_${p1}_upper_row2`] = 0;
  scores[`score_${p1}_upper_row3`] = 0;
} else if (activePlayer === p2) {
  scores[`score_${p2}_upper_row1`] = 0;
  scores[`score_${p2}_upper_row2`] = 0;
  scores[`score_${p2}_upper_row3`] = 0;
}

// 访问时同样用模板字面量或者直接写属性名
console.log("当前玩家的第一行分数：", scores[`score_${activePlayer}_upper_row1`]);
// 也可以这样访问：scores.score_player2_upper_row1

这样生成的属性名完全符合你的预期：当activePlayer是player1时，对象里就有score_player1_upper_row1这类属性；切换到player2时则对应生成player2的属性。

不推荐但可行：用window对象（仅浏览器环境） #

如果你是在浏览器环境下，也可以利用window对象来创建全局变量，但这种方法会污染全局作用域，容易引发命名冲突，所以非常不推荐：

let p1 = "player1";
let p2 = "player2";
let activePlayer = p2;

if (activePlayer === p1) {
  window[`score_${p1}_upper_row1`] = 0;
  window[`score_${p1}_upper_row2`] = 0;
  window[`score_${p1}_upper_row3`] = 0;
} else if (activePlayer === p2) {
  window[`score_${p2}_upper_row1`] = 0;
  window[`score_${p2}_upper_row2`] = 0;
  window[`score_${p2}_upper_row3`] = 0;
}

// 此时可以直接作为全局变量访问
console.log(score_player2_upper_row1);

最后再啰嗦一句 #

虽然上面的方法能实现你想要的“动态生成变量名”效果，但本质上都是用对象属性来模拟的——JavaScript本身并不支持直接通过模板字面量声明变量名。而且还是强烈建议用对象（甚至嵌套对象）来管理这类变量，比如可以把每个玩家的分数单独分组：scores.player1.upper.row1，这样代码可读性和维护性会高很多~

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