Загрузка...

Help with the topic Template strings using an example

Thread in Node.js created by gezhaf Nov 19, 2023. (bumped Nov 19, 2023) 173 views

  1. gezhaf
    gezhaf Topic starter Nov 19, 2023 2 Jun 18, 2022
    1. const result = {
    2. success: ["max-length", "no-amd", "prefer-arrow-functions"],
    3. failure: ["no-var", "var-on-top", "linebreak"],
    4. skipped: ["no-extra-semi", "no-dup-keys"]
    5. };
    6. function makeList(arr) {
    7. "use strict";
    8. // change code below this line
    9. const failureItems = arr.map(item => `<li class="text-warning">${item}</li>`);
    10. // change code above this line
    11. return failureItems;
    12. }
    13. const failuresList = makeList(result.failure);

      Я не понимаю 9 строку с методом map, насколько понял он используется для того что бы создать новый массив из того что принимает в параметрах, но функция в параметрах метода меня запутывает.
     
  2. ChatGPT
    ChatGPT Nov 19, 2023 2250 Mar 14, 2023
    gezhaf, да, вы правильно поняли. Метод `map()` используется для создания нового массива путем применения функции к каждому элементу исходного массива. В данном случае, функция, переданная в `map()`, принимает один параметр `item`, который представляет каждый элемент массива `arr`.

    В данном коде, функция переданная в `map()` использует стрелочную функцию для создания нового массива `failureItems`. Каждый элемент нового массива представляет собой строку `<li class="text-warning">${item}</li>`, где `${item}` является значением элемента из исходного массива `arr`. Таким образом, `failureItems` будет содержать массив строк, каждая из которых будет представлять элементы исходного массива `arr` в виде HTML-элемента списка.

    Надеюсь, это помогло вам разобраться с 9-й строкой кода. Если у вас есть еще вопросы, не стесняйтесь задавать.
     
    1. gezhaf Topic starter
    2. ChatGPT
      gezhaf, конечно, я готов помочь! Чем я могу быть полезен?
  3. h00k_fl4me0ut
    h00k_fl4me0ut Nov 19, 2023 Banned 9 Jul 16, 2022
    Эта строка создает новый массив failureItems, пройдя по каждому элементу массива arr и применяя стрелочную функцию к каждому элементу.
    Стрелочная функция (item => <li class="text-warning">${item}</li>) - это сокращенная форма для функции. В данном случае, она принимает один параметр item и возвращает строку, представляющую элемент в виде HTML-тега <li> с классом "text-warning". Таким образом, каждый элемент массива arr будет преобразован в соответствующий HTML-тег.
    Например, если arr содержит элемент "no-var", то failureItems будет содержать элемент <li class="text-warning">no-var</li>.
    Это полезный способ создания нового массива, преобразуя каждый элемент с использованием определенной логики.
     
    1. gezhaf Topic starter
  4. Toil
    Toil Nov 19, 2023 ������� ������ :coder: 3543 Nov 18, 2018
    а что она запутывает? Это обычная функция, только анонимная, которая оборачивает текст в хтмл тег
     
    1. gezhaf Topic starter
      Toil, спасибо за ответ
    2. Toil
      gezhaf,

      здесь ты сразу обращаешься по ключу объекта т.к. у тебя есть один объект и ты можешь себе спокойно это позволить
      А здесь, ты обращаешься уже по элементу массива, в данном случае это "no-var", "var-on-top" и "linebreak" , аналогичный код ты можешь сделать с помощью ручного пуша в новый массив, но тебе бы пришлось дублировать кучу кода
      Code
      new_array = [];

      new_array.push(`<li...>${arr[0]}</li>`)
      new_array.push(`<li...>${arr[1]}</li>`)
      new_array.push(`<li...>${arr[2]}</li>`)
      или можешь сделать тоже самое в цикле forof и тогда никаких различий не будет, кроме того, что для цикла нужно будет задать пустой массив заранее и он будет немного медленнее
      Code
      new_array = [];

      for (const item of arr) {
      new_array.push(`<li...>${item}</li>`)
      }
    3. gezhaf Topic starter
      Toil, ОГРОМНАЯ благодарность, за то что так понятно объяснил. Держи утку :duck_like:
Loading...
Top