黑马程序员技术交流社区

标题: js中的map()方法 [打印本页]

作者: 397737426 时间: 2019-4-4 14:55
标题: js中的map()方法
map定义和方法
map()方法返回一个新数组，数组中的元素为原始数组元素调用函数处理的后值。
map()方法按照原始数组元素顺序依次处理元素。
注意：
map不会对空数组进行检测
map不会改变原始数组
arr.map(function(currentValue，index，arr),thisValue)
参数说明
function(currentValue,index,arr)
必须，函数，数组中的每个元素都会执行这个函数函数参数
函数参数
currentValue 必须当前元素值
index 可选当前元素的索引值
arr 可选当前元素属于的数组对象。
我们看个小demo，就会一目了然

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>map方法</title>
</head>
<body>
<p>点击按钮将数组中的每个元素乘以输入框指定的值，并返回新数组</p>
<p>
      最小年龄:
      <input type="number" id="age" value="10" />
</p>
<button id="btn">点我</button>
<p id="data">新数组</p>

<script type="text/javascript">
      var btn = document.getElementById("btn");
      var data = document.getElementById("data");
      var age = document.getElementById("age");
      var numbers = [25,36,121,49];

      function myFunction(num,index,arr){
         console.log(arr);
         return num * age.value;
      }

      btn.onclick = function(num){
         data.innerHTML = numbers.map(myFunction);
      }

</script>
</body>

欢迎光临黑马程序员技术交流社区 (http://bbs.itheima.com/)

黑马程序员IT技术论坛 X3.2