Как написать функцию, которая создаёт N количество HTML элементов?

Question

[Aristotel Paskalov]

Я хочу написать функцию, которая принимает в себя параметр "count", и возвращает столько HTML элементов, сколько передали в count

Например:
count = 3

return svg (3 раза)

Я сделал это так:

function createStars(count) {
        const star = `
            <span>
                <svg width="15" height="13" viewBox="0 0 15 13" fill="none"
                    xmlns="http://www.w3.org/2000/svg">
                    <path
                        d="M7.49777 0L9.60005 4.23718L14.2772 4.92164L10.8875 8.22991L11.6861 12.8908L7.49777 10.6907L3.30949 12.8908L4.10802 8.22991L0.718262 4.92164L5.41176 4.23718L7.49777 0Z"
                        fill="#FFCD1D" />
                </svg>
            </span>
        `;

        for (let i = 0; i <= count; i++) {
            return star;
        }
    }

Но почему-то на сайте отображается всего 1 звёздочка:


Подскажите пожалуйста, где ошибка в моём коде, и как было бы правильнее написать такую функцию?

Answer 1

[Rsa97]

После первого встреченного return, то есть ещё на первой итерации цикла, функция завершится.

const star = `
  <span>
    <svg width="15" height="13" viewBox="0 0 15 13" fill="none" xmlns="http://www.w3.org/2000/svg">
    <path
      d="M7.49777 0L9.60005 4.23718L14.2772 4.92164L10.8875 8.22991L11.6861 12.8908L7.49777 10.6907L3.30949 12.8908L4.10802 8.22991L0.718262 4.92164L5.41176 4.23718L7.49777 0Z"
      fill="#FFCD1D"
    />
  </svg>
</span>`;

const createStars = (num) => star.repeat(num);

Comments

[Aristotel Paskalov]

Спасибо! Тоже так подозревал, но до конца не был уверен