我的单选按钮出现尾随逗号，请问问题根源是什么？

尾随逗号的来源 #

选项后出现的尾随逗号，是因为options.map()返回的是数组，在模板字符串中直接插入数组时，JavaScript会自动将数组转为字符串，数组元素之间默认用逗号分隔，这些逗号就被渲染到页面里了。

解决办法 #

在map()方法后追加.join('')，将数组拼接成无分隔符的字符串，就能消除这些逗号：

修改后的JavaScript代码：

const options = [
        "Easy to use",
        "Loading",
        "Fast",
        "Others (Mention below)"
      ];
      const template = `
    <div class="question-title">sdjhaskjdhakjs</div>
    <div class="question-options">${options?.map((option, i) => {
      return `
      <div class="question-option">
        <input class="${"id"}-feedback-question-option" type="radio" id="${"id"}-${option}" name="option" value="${option}" ${
        i === options.length - 1 ? "checked" : ""
      } />
        <label for="${"id"}-${option}">${option}</label>
      </div>`;
    }).join('')}</div>
  `;
 
 document.getElementById("app").innerHTML = template;

额外修正 #

你代码里默认选中的判断逻辑有误：options.length === i - 1永远不会成立，改成i === options.length - 1后，最后一个选项才能被默认选中。

内容的提问来源于stack exchange，提问作者Mujtaba Kably