ECMA5数组新方法

[damoclesX]

一直饱受IE浏览器的折磨，做的东西很多要兼容IE9-浏览器。ecma5的数组新方法对于我而言真是新方法，殊不ecma6标准都出来了。唉....

公司后台项目，不考虑兼容性，使用者都是使用chrome，firefox浏览器等，于是可以大胆尝试**“新”**的东西

IE9-浏览器不支持这些方法

1.isArray

判断是否为数组。之前判断为数组，用Object.prototype.toString方法才能准确判断变量是否为数组：如

Object.prototype.toString.call([1,2]).slice(8,-1)
//"Array"

现可用Array.isArray()，直接判断

Array.isArray([1,2])
//true

直接返回布尔值，更简单直接

2.indexOf

记得多年以前，在某前端论坛，看了下这个indexOf，某同仁还说indexOf有兼容性问题，我当时还傻傻分不清呢。多年以后，我终于用上了数组的indexOf方法，跟String的indexOf方法类似，搜索数据在数组中的索引，没有找到相等（严格相等===）的数据返回-1，搜索复杂类型，与判断两个复杂类型是否相等一致(是否引用同一数据)，看起来一样不相等

[1,2].indexOf(1)
//0
[1,2].indexOf(0)
//-1
[1,2].indexOf('1')
//-1
[{a:2}].indexOf({a:2})
//-1
var data = {a:2};
[data].indexOf(data);
//0

3.forEach、map、some、every

遍历数组内元素，类似于jquery中each方法。some方法本是判断数组中是否有数据满足断言，期待返回真值，找到一个数据满足断言，返回true，中断遍历。every是判断数组中是否所有数据满足断言，期待返回假值，找到一个数据不满足断言，返回false，中断遍历。如果some方法不return 真值时、every方法全部return 真值时，效果与forEach类似（some、every返回布尔值）。map方法本是扩展数组数据用的，扩展时也会遍历数组，会返回一个新的数组。map、forEach使用return无法中断

var arr = [1,2,3,4,5];
arr.forEach(function(e){
    console.log(e+1);
})
// 2,3,4,5,6,undefined
var arr = [1,2,3,4,5];
arr.map(function(e){
    console.log(e+1);
})
// 2,3,4,5,6,[undefined, undefined, undefined, undefined, undefined]
arr.some(function(e){
   console.log(e+1)
   //默认返回假值 undefined
})
//2,3,4,5,6,false
arr.every(function(e){
  console.log(e+1)
  return true;
})
//2,3,4,5,6,true
arr.some(function(e){
  console.log(e+1);
  return true;
})
//2,true
arr.every(function(){
  console.log(e+1);
  return false;
})
//2,false
arr.some(function(e){
  console.log(e+1);
  return 1;//返回真值都会中断遍历
})
//2,true
arr.every(function(e){
  console.log(e+1);
  return 0;//返回假值都会中断遍历
})
//2,false
arr.forEach(function(e){
  console.log(e+1);
  return false;//forEach 返回任何值不会中断遍历
})
//2,3,4,5,6,undefined

4.some、every

上面的some、every用法不是其主要作用，这两个方法主要是用来判断数组中数据是否满足断言，some指是否有一个数据满足断言，满足就返回true，every指是否所有数据都满足断言，有一个不满足就返回false，否则返回true。

var arr = [1,2,3,4];
arr.some(function(e,i){
   console.log(i)
   if(!(e%2)){
      return true;
   }else{
     return false;
   }
})
//0,1,true 遍历到2时，找到满足断言（!(e%2)），中断遍历，返回true

var arr = [1,2,3,4];
arr.every(function(e,i){
   console.log(i)
   if(typeof e == 'number'){
      return true;
   }else{
     return false;
   }
})
//0,1,2,3,true 都满足断言(typeof e == ‘number’)，返回true

5.map、reduce、reduceRight

map扩展数组数据，渲染数据挺有用的。reduce收缩(收敛)数组数据，比如计算数组数据总和可用（效率比evel(arr.join('+))高很多），reduceRight和reduce只是数据处理的方向不同而已

var arr = [1,2,3];
arr.map(function(e){
 return e+1;
})
//[2, 3, 4]

var arr = [{id:1,title:'标题一'},{id:2,title:'标题二'},{id:3,title:'标题三'}];
arr.map(function(e){
  return '<p data-id="'+e.id+'">'+e.title+'<p>';
}).join('')
//"<p data-id="1">标题一<p><p data-id="2">标题二<p><p data-id="3">标题三<p>"

var arr = [1,2,3,4];
arr.reduce(function(a,b){
  return a+b
})
//10

var arr = [1,2,3,4];
arr.reduceRight(function(a,b){
  return a+b
})
//10

6.filter

根据断言过滤数组数据，返回真值则添加到新创建的数组，否则不添加，如果没有一个符合，返回空数组

   var arr = [1,2,3];
   arr.filter(function(e){
     return e>2
   })
   //[3]
   var arr = [1,2,3];
   arr.filter(function(e){
     return e>4
   })
   //[]