javascript - 是否可以使用标记模板文字并将模板文字保存为常量？

Question

我正在开发一个有多种语言的应用程序。我们没有使用像“i18n”这样的包，而是——因为字符串文字的数量不是很大——使用这样的系统:

// constants
const GREETING = 'greeting'

// es.js -- a language object

const aLanguageObject = {[GREETING] : '¿Cómo estás?'}

// helper function
const getText(selector) = currentLanguageObject[selector]

// usage file
const greetingPhrase = getText(GREETING);

其中 currentLanguageObject 是 es.js、en.js 等之一，即 languageObject< 之一 已定义(我们根据 process.env 值进行选择)

我们希望能够利用标记的模板文字将值插入到这些保存为常量的模板文字中。

我尝试让标记模板文字与我们的系统一起工作，如下所示:

// en.js
    const aLanguageObject = {[CONFIRM_NUMBER] : `is the number ${0} correct?`}

and then use tagged templates like this 

    const theNumber = 12;

    const   myTag = (strings, numberExp) => `${strings[0]}${theNumber}${strings[1]}`;

    const numberConfirmString = myTag`${getText(CONFIRM_NUMBER)})`;

但是 numberConfirmString 是未定义。

有没有办法“填充”保存为常量的模板文字？

Answer 1

语法:

const obj = {[key] = value}

应该是:

const obj = {[key]: value}

否则，会出现语法错误。

除此之外，我认为这样的事情应该有效:

function generaTemplate (strings, ...keys) {
  return function(data) {
    let temp = strings.slice();
    keys.forEach((key, i) => {
      temp[i] = temp[i] + data[key];
    });
    return temp.join('');
  }
}

const userTpl = user => generaTemplate`<article>
  <p>Name: ${'name'}</p>
  <p>Age: ${'age'}</p>
</article>`(user);

const users = [{
  name: 'Eric',
  age: '10'
}, {
  name: 'Rob',
  age: '20'
}];

const usersList = users.reduce((acc, user) => {
  return acc + userTpl(user);
}, '');

console.log(usersList);

它返回:

<article>
  <p>Name: Eric</p>
  <p>Age: 10</p>
</article><article>
  <p>Name: Rob</p>
  <p>Age: 20</p>
</article>

作为替代方案，您还可以使用:

const welcome = param => `Hello, ${param}`;
console.log(welcome('world'));

输出:

你好，世界

检查这个:Defer execution for ES6 Template Literals