js中map()方法和apply()方法的总结

在学习vue.js的render函数时遇到一段代码如下：

render: function (createElement) {
  return createElement('div',
    Array.apply(null, { length: 20 }).map(function () {
      return createElement('p', 'hi')
    })
  )
}

由于对其中Array.apply和map不是很理解，于是便在网上查找资料后，总结如下，方便以后自己回顾时进行复习。

map()

map()方法返回一个由原数组中每个元素调用一个指定的方法后返回的值组成的一个新数组。map()方法就是一种数组的映射,[].map(callback,[thisObject]) callback=function(value,index,array){}

通常map方法在调用callback函数时，会传递三个参数：当前正在遍历的元素，元素的索引，当前数组本身

var list= [{name:'one',name:'two',name:'three'}];
list.map(function(value,index){reutrn index})  //[0,1,2]
list.map(function (value){return value.name}).join(",")  //one,two,three

对于["1","2","3"].map(parseInt)的返回值为[1,NaN,NaN]的解释

由于map的callback函数传递三个参数，而parseInt本身只需要两个参数，第一个为元素本身，第二个为进制数，所以在进行转换时，会忽略callback的第三个参数，而parseInt则会用元素的索引作为自己的进制转换数。最终结果就是[1,NaN,NaN]

Array.apply()

Array.apply(null,array)要求第二个参数是一个数组，Array.apply(null,[1,2,3])返回[1,2,3]

当第二个参数为一个带有length属性的对象时，则会当做一个数组来使用

所以Array.apply(null,{length:3})返回的结果为[undefined,undefined,undefined]