Понимание литерала шаблона с тегами ES6

Следующий фрагмент кода используется в Mozilla (https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Template_literals), чтобы объяснить Tagged Template literal, помогите мне понять, что делает следующая функция, я не могу получить фактический поток функции, поскольку они использовали keys.foreach, и когда я проверял в Chrome, клавиши были функцией, поэтому я не мог понять

function template(strings, ...keys) {
  return (function(...values) {
    var dict = values[values.length - 1] || {};
    var result = [strings[0]];
    keys.forEach(function(key, i) {
      var value = Number.isInteger(key) ? values[key] : dict[key];
      result.push(value, strings[i + 1]);
    });
    return result.join('');
  });
}

var t1Closure = template`${0}${1}${0}!`;
t1Closure('Y', 'A');  // "YAY!"
var t2Closure = template`${0} ${'foo'}!`;
t2Closure('Hello', {foo: 'World'});  // "Hello World!"

ecmascript-6 template-literals tagged-templates
person Akshay Vijay Jain    schedule 14.09.2017    source источник
comment
Когда я проверял в Chrome, клавиши были функцией - нет. keys - это массив.   -  person Bergi    schedule 14.09.2017
comment
да, ключ - это массив, но каким-то образом, когда я задал вопрос, я проверил ключи, когда отладчик был внутри forEach, в этот раз вы не можете получить доступ к массиву ключей, и если вы введете ключи, вы получите функцию в консоли   -  person Akshay Vijay Jain    schedule 14.09.2017
comment
Просто напишите стандартный цикл for (let i=0; i<keys.length; i++) { const key = keys[i]; … вместо вызова forEach. Это не имеет значения для понимания шаблонных литералов.   -  person Bergi    schedule 14.09.2017
comment
Я пробовал с for и forEach и использовал console.log, в обоих случаях мы можем получить доступ к ключам в цикле, но при попытке отладки / проверки вы не можете получить массив ключей внутри цикла forEach   -  person Akshay Vijay Jain    schedule 14.09.2017

Ответы (2)


arrow_upward
2
arrow_downward

Большая часть сложности в примере возникает из-за перегруженной функции и вызова forEach, а не из тегированных литералов шаблона. Лучше было бы это записать как два отдельных случая:

function dictionaryTemplate(strings, ...keys) {
  return function(dict) {
    var result = "";
    for (var i=0; i<keys.length; i++)
      result += strings[i] + dict[keys[i]];
    result += strings[i];
    return result;
  };
}
const t = dictionaryTemplate`${0} ${'foo'}!`;
t({0: 'Hello', foo: 'World'});  // "Hello World!"


function argumentsTemplate(strings, ...keys) {
  is (!keys.every(Number.isInteger))
    throw new RangeError("The keys must be integers");
  return function(...values) {
    var result = "";
    for (var i=0; i<keys.length; i++)
      result += strings[i] + values[keys[i]];
    result += strings[i];
    return result;
  };
}
const t = argumentsTemplate`${0}${1}${0}!`;
t('Y', 'A');  // "YAY!"
person Bergi    schedule 14.09.2017

arrow_upward
0
arrow_downward

Шаблон - это настраиваемая функция, определенная нами для анализа строки шаблона всякий раз, когда функция используется для анализа строки шаблона
Первый аргумент функции тега содержит массив строковых значений. Остальные аргументы относятся к выражениям.
поэтому здесь мы специально написали функцию для данного вывода
Я запутался, потому что, когда я проверял ключи внутри forEach, я получил функцию в консоли, но проверяя функцию до того, как forEach выдал ключи как массив настраиваемых строк $ {0} и $ {1} в первом примере

person Akshay Vijay Jain    schedule 14.09.2017