front-end-77
/
13-数组方法map.html

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta
      name="viewport"
      content="width=device-width, initial-scale=1.0,maximum-scale=1,minimum-scale=1,user-scalable=no"
    />
    <title>13-数组方法map.html</title>
    <style>
      * {
        margin: 0;
        padding: 0;
        box-sizing: border-box;
      }
    </style>
  </head>
  <body>
    <script>
      // map  返回 处理后的数组
      // map 数组的一个方法 也会遍历 数组  接收一个函数
      const arr = ['a', 'b', 'c'];
      // ['<li>a</li>','<li>b</li>','<li>c</li>']
      // const newArr = [];
      // arr.forEach(function (value) {
      //   newArr.push(`<li>${value}</li>`);
      // });

      // console.log(newArr);

      const newArr = arr.map(function (value, index) {
        return `<li>${index}-${value}</li>`;
      });
      console.log(newArr);
    </script>
  </body>
</html>