Javascript-使用传递的变量名称在文字字符串中调用变量

Question

有没有一种方法可以将变量名嵌入文字字符串中而无需子字符串并将字符串重新构建在一起？

例：

function(mode) {
    return ${REACT_APP_<mode>_PREFIX_URL};
}

其中mode截取文字字符串(``)作为传递的参数，该参数指向要查找的正确变量名称。

这是输出示例

输出示例： REACT_APP_ADMIN_PREFIX_URL用于传入模式= 'ADMIN'

Answer 1

如果我对你的问题正确，

function myFunc (mode) {
  return obj[`REACT_APP_${mode}_PREFIX_URL`];
}
var obj = {
  REACT_APP_ADMIN_PREFIX_URL : 'Hello'
}

console.log(myFunc('ADMIN'))// Hello

应该管用。

您也可以使用eval尽管我不建议这样做。

var REACT_APP_ADMIN_PREFIX_URL : 'Hello';
function myFunc (mode) {
  return eval(`REACT_APP_${mode}_PREFIX_URL`);
}

还应该返回相同的响应。

Answer 2

假设您有一个包含常量的文件.env，内容如下：

REACT_APP_ADMIN_PREFIX_URL=admin_str
REACT_APP_DEV_PREFIX_URL=dev_str
...

然后，您可以在（当前）文件中：

function(mode) {
  return process.env[`REACT_APP_${mode.toUpperCase()}_PREFIX_URL`};
  // this will be process.env[`REACT_APP_ADMIN_PREFIX_URL`]
  // which is `admin_str`
}

Answer 3

如果在全局范围内可以访问REACT_APP_ADMIN_PREFIX_URL则可以使用与访问任何其他对象上的属性相同的方式来访问它，例如：

const val = window[`REACT_APP_${mode}_PREFIX_URL`];
return `REACT_APP_${mode}_PREFIX_URL`;

（假设这里的应用程序正在浏览器中运行，其中“ window”是全局对象）

但是，使用配置变量污染全局范围可能很难维护，因此，我建议如果可能的话，执行以下操作：

const PrefixUrls = {
    ADMIN: 'foobar'
}

function(mode) {
 return PrefixUrls[mode];
}

Answer 4

const CONSTANTS = {
  REACT_APP_ADMIN_PREFIX_URL: '...',
  REACT_APP_OTHER_PREFIX_URL: '...',
}

function(mode) {
    return CONSTANTS['{REACT_APP_'+mode+'_PREFIX_URL'];
}

没有办法，你可以用变量做