Попытка понять, как `$ {c}` в этой строковой интерполяции указывает на элементы в массиве - PullRequest
Новая
       27

Попытка понять, как `$ {c}` в этой строковой интерполяции указывает на элементы в массиве

0 голосов
/ 27 октября 2019 
const continents = ['Africa', 'America', 'Asia', 'Australia', 'Europe'];

const helloContinents = Array.from(continents, c => `Hello ${c}!`);

const message = helloContinents.join(' ');

const element = React.createElement("div", {

  title: "Outer div"

}, React.createElement("h1", null, message));

ReactDOM.render(element, document.getElementById('contents'));

Ответы [ 2 ]

1 голос
/ 27 октября 2019

Из документов для Array.from

Параметры

arrayLike Подобный массиву илиповторяемый объект для преобразования в массив.

mapFn Необязательная функция Map для вызова каждого элемента массива.

thisArg Необязательное значение для использования при выполнении mapFn.

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/from#Syntax

Он говорит, что второй аргумент является функцией отображения, он применяется ккаждый элемент в массиве.

0 голосов
/ 27 октября 2019

как ${c} в этой строке интерполяция указывает на элементы в массиве

Это не так. c => `Hello ${c}!` - это функция стрелки , получающая один аргумент (c) за раз.
Если вы хотите поддерживать среды без интерполяции строк, вы должны написать
c => "Hello "+c+"!", чтоможет быть увеличен до c => {return "Hello "+c+"!";}, чтобы подчеркнуть, что это очень компактная, но актуальная функция.
10 лет назад, без функций интерполяции и стрелок, вы написали бы
function(c){return "Hello "+c+"!";} там.

Итак, как указывают другие ответы / комментарии, использование Array.from(someIterable,someFunction) просто вызывает someFunction для всех элементов someIterable, собирая результаты в массив. Затем join() объединяет элементы массива в одну строку. Так как ваш «итерируемый» уже массив, вы можете использовать вместо него Array.map(someFunction).

В некоторых вариациях также добавлено ведение журнала, в котором указывается длинный function(x): 

const continents = ['Africa', 'America', 'Asia', 'Australia', 'Europe'];
const hellos1 = Array.from(continents,function(x){
  console.log("processing element: "+x);
  return "Hello "+x+"!";
});
console.log(hellos1.join(" "));

const hellos2 = continents.map(x => {return "Hello "+x+"!"});
console.log(hellos2.join()); // comma-separated

console.log(`1+2: ${1+2}, continents.length: ${continents.length}`);

Последняя строка показывает, что элемент ${...} в интерполяции строк просто оценивает выражение внутри. Таким образом, c из ${c} в вопросе не является спецификатором формата, как \c может быть в разных языках, это c просто потому, что это имя аргумента, которое получает функция стрелки.

...