javascript 中的map()方法

Posted

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了javascript 中的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>

  














以上是关于javascript 中的map()方法的主要内容,如果未能解决你的问题,请参考以下文章

10个JavaScript代码片段,使你更加容易前端开发。

10个JavaScript代码片段,使你更加容易前端开发。

精心收集的 48 个 JavaScript 代码片段,仅需 30 秒就可理解!(转载)

将多个输出中的hls属性设置为单独的片段代码

javascript学习系列:数组中的map方法

Android Studio Map setOnMarkerClickListener 不在片段上工作