使用map函数在JavaScript中动态创建表_Javascript

使用map函数在JavaScript中动态创建表

javascript

使用map函数在JavaScript中动态创建表,javascript,Javascript,我试图使用map函数在JavaScript中动态创建一个表，但出现了错误。谁能给我指点一下吗未捕获的SyntaxError:速记属性初始值设定项无效这是我的密码： //电影列表让电影=[ { 标题：“搏击俱乐部”，排名：10， id:“tt0137523” }, { 标题：“肖申克的救赎”，排名：1， id:“TT011161” } ] 功能显示电影（电影）{ 设table=''；表+=`IDNameRank`； movies.map（（电影，索引）=>({ table=table

我试图使用map函数在JavaScript中动态创建一个表，但出现了错误。谁能给我指点一下吗

未捕获的SyntaxError:速记属性初始值设定项无效

这是我的密码：

//电影列表
让电影=[
{
标题：“搏击俱乐部”，
排名：10，
id:“tt0137523”
},
{
标题：“肖申克的救赎”，
排名：1，
id:“TT011161”
}
]
功能显示电影（电影）{
设table=''；
表+=`IDNameRank`；
movies.map（（电影，索引）=>({
table=table+``，
table=table++`+`标题：`${movie.id}`++`，
table=table++`++`Title:`${movie.Title}`++`，
table=table++`+`标题：`${movie.rank}`+``
}));  
表+=“”
document.getElementById（“电影列表”）.innerHTML=table；
}
播放电影

答复
您有几个语法错误
在demo.js
中，我对不需要插值的字符串文本使用了单引号而不是反勾号。您还缺少几个+
运算符。另外，在index.html
中，我将..
标记移到了“电影列表”div下面
index.html:

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width">
    <title>repl.it</title>
    <link href="style.css" rel="stylesheet" type="text/css" />
  </head>
  <body>
    <!-- <script src="script.js"></script> -->
    <div id="movies-list">
      <!-- The div element where the movies table will be inserted --> 
    </div>
    <script src="demo.js"></script>
  </body>
</html>

您有几个语法错误
在demo.js
中，我对不需要插值的字符串文本使用了单引号而不是反勾号。您还缺少几个+
运算符。另外，在index.html
中，我将..
标记移到了“电影列表”div下面
index.html:

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width">
    <title>repl.it</title>
    <link href="style.css" rel="stylesheet" type="text/css" />
  </head>
  <body>
    <!-- <script src="script.js"></script> -->
    <div id="movies-list">
      <!-- The div element where the movies table will be inserted --> 
    </div>
    <script src="demo.js"></script>
  </body>
</html>

您需要在displaymoves
功能上使用Array.forEach
而不是Array.map。
Array.map
用于创建一个新数组，其中填充了对调用数组中的每个元素调用所提供函数的结果。不需要返回基于电影的新数组
数组，因此最好使用array.forEach


在循环中添加td
值时语法错误


您需要在displaymoves
功能上使用Array.forEach
而不是Array.map。
Array.map
用于创建一个新数组，其中填充了对调用数组中的每个元素调用所提供函数的结果。不需要返回基于电影的新数组
数组，因此最好使用array.forEach


在循环中添加td
值时语法错误

将=>（{
替换为=>{
。在您的行中使用映射
。如果您使用（{…}）
它认为您要返回一个对象。同时将.map（）
更改为.forEach（）
（虽然它仍然可以与map一起使用，但是如果您不使用.map
的返回值，那么forEach是一个不错的选择）将=>（{
替换为=>{
。在您的行中使用.map
。如果您使用（{…}）
它会认为您想要返回一个对象。同时将.map（）
更改为.forEach（）
（尽管它仍然可以与map一起使用，但如果您不使用.map
的返回值，那么forEach是一个不错的选择。）谢谢！我在我的编辑器中粘贴了您的代码，但现在我收到了以下错误未捕获类型错误：无法设置Null的属性'innerHTML'，请尝试将id名称更改为movieslist
，然后重试。谢谢！我在我的编辑器中粘贴了您的代码，但现在我收到了此错误未捕获类型错误：无法设置Null的属性'innerHTML'，请尝试更改请将id名称添加到movieslist并重试。
table = table + `<td>` + `Title:` `${movie.id}` + `</td>`,

table = table + `<td>Title: ${movie.id}</td>`;