Javascript 将数组数据映射并前置到HTML

我有一个数组，它基本上接受数组数据并将其附加到HTML中。我使用for循环来实现这一点。但我很好奇，如果我想使用Array.prototype.map函数来实现这一点，我将如何实现？我不想使用任何第三方库，如下划线或lodash

更新的解决方案：

因为OP说他无法控制输入，维基百科提供的数据可能是他们的服务之一

然后我假设数据是结构化和正确的，也就是说，它永远不会出现嵌套数组中的一个比另一个长或短的情况

是的，您完全可以使用MapAPI为您从Wikipedia获得的输入赋予更多意义，然后使用forEach对项目进行迭代以构建HTML字符串

例如：

这样，您就可以说title X的description属性的值为yyy，link属性的值为zzz

即使缺少这些属性之一，最多也会得到一个未定义的值

这就是你在结构中循环的方式

for (var title in suggested_data) {
    var item = suggested_data[title];
    $("#output").append(
          "<div><h1>" + title+"</h1><p>" + item.description
          +"</p><a>" + item.link + "</a></div>"
      );
}

---

归根结底，这与是否使用map无关，我认为更多的是您选择的数据结构

您可以使用.map在数组中收集新的HTML元素，然后在一次操作中将结果附加到输出元素

请注意，您应该使用.text方法，而不是连接字符串，以避免大于符号或符号破坏生成的HTML

下面是它的样子：

var数据=[[标题1、标题2、标题3]， [说明1、说明2、说明3]， [链接1、链接2、链接3]； $output.appenddata[0]。地图标题，i=> $.append $.texttitle， $.textdata[1][i]， $.textdata[2][i] ;

---

函数式编程通常可以避免诸如DOM操作之类的副作用。所以我想说，在这里使用map并不是一个很好的选择。我试图构建一个wikipedia查看器，json数据的格式是这样的。。看看这个@谢谢你的更新。因为我不知道你没有；我无法控制输入。好的，现在我已经更新了解决方案，先做map，然后forEach。在小提琴上试过，效果很好。

var suggested_data = {
    title1: {
        description: "description 1",
        link: "link1"
    },
    title2: {
        description: "description 1",
        link: "link1"
    },
    title3: {
        description: "description 1",
        link: "link1"
    }
}

for (var title in suggested_data) {
    var item = suggested_data[title];
    $("#output").append(
          "<div><h1>" + title+"</h1><p>" + item.description
          +"</p><a>" + item.link + "</a></div>"
      );
}