JavaScript Array 对象之ES5新增数组高阶方法

野性酷女 2022-11-26 09:47 326阅读 0赞

### 1.forEach()遍历 ###

forEach() 方法用于调用数组的每个元素，并将元素传递给回调函数。  
语法:

var arr = ['我','爱','我的','祖国'];
    arr.forEach(function(item,index,self){
    	console.log(item,index,self);
    })

参数：

<table> 
 <thead> 
  <tr> 
   <th>参数</th> 
   <th>描述</th> 
  </tr> 
 </thead> 
 <tbody> 
  <tr> 
   <td>item</td> 
   <td>必须，当前元素</td> 
  </tr> 
  <tr> 
   <td>index</td> 
   <td>可选，当前元素的索引值</td> 
  </tr> 
  <tr> 
   <td>self</td> 
   <td>可选，当前元素所属的数组对象</td> 
  </tr> 
 </tbody> 
</table>

### 2.map()映射 ###

map() 方法返回一个新数组，数组中的元素为原始数组元素调用函数处理后的值。  
map() 方法按照原始数组元素顺序依次处理元素。  
语法：

var arr = [1,3,5];
    var arr2 = arr.map(function(item,index,self){
    	return item*2;
    })

参数：

### 3.filter过滤 ###

filter() 方法创建一个新的数组，新数组中的元素是通过检查指定数组中符合条件的所有元素。  
语法：

var arr1 = [2,4,6,7,9,100,999,-4,24];
    var arr2 = arr1.filter(function(item){
    	return item>10;
    })

参数：

### 4.reduce() ###

reduce() 方法接收一个函数作为累加器，将数组中的每个值从左到右相加，最终计算为一个值。  
语法：

var arr = [2,4,6,9,99,199];
    var ret = arr.reduce(function(a,b){
    		return a+b;
    })

参数：

<table> 
 <thead> 
  <tr> 
   <th>参数</th> 
   <th>描述</th> 
  </tr> 
 </thead> 
 <tbody> 
  <tr> 
   <td>a</td> 
   <td>必须，初始值，也是计算结束后的返回值</td> 
  </tr> 
  <tr> 
   <td>b</td> 
   <td>必须，当前元素</td> 
  </tr> 
 </tbody> 
</table>

### 5.every() ###

every() 方法用于检测数组所有元素是否都符合指定条件.  
如果数组中检测到有一个元素不满足，则整个表达式返回 false  
如果所有元素都满足条件，则返回 true  
语法：

var arr = [2,4,6,9,99,199];
    var ret = arr.every(function(item){
    	return item<120;
    })

参数：

<table> 
 <thead> 
  <tr> 
   <th>参数</th> 
   <th>描述</th> 
  </tr> 
 </thead> 
 <tbody> 
  <tr> 
   <td>item</td> 
   <td>必须，当前元素的值</td> 
  </tr> 
 </tbody> 
</table>

### 6.some() ###

some() 方法用于检测数组中的元素是否满足指定条件。  
如果有一个元素满足条件，则表达式返回true , 剩余的元素不会再执行检测。  
如果没有满足条件的元素，则返回false。  
语法：

var arr = [2,4,6,9,99,199];
    var ret3 = arr.some(function(item){
    	return item>20;
    })

参数：

<table> 
 <thead> 
  <tr> 
   <th>参数</th> 
   <th>描述</th> 
  </tr> 
 </thead> 
 <tbody> 
  <tr> 
   <td>item</td> 
   <td>必须，当前元素的值</td> 
  </tr> 
 </tbody> 
</table>

### 7.sort()排序 ###

sort() 方法用于对数组的元素进行排序。  
一般情况下通过一个函数作为参数来调用此方法  
**注意：** 此方法会改变原始数组！  
语法：

array.sort(function);

参数：

<table> 
 <thead> 
  <tr> 
   <th>参数</th> 
   <th>描述</th> 
  </tr> 
 </thead> 
 <tbody> 
  <tr> 
   <td>function</td> 
   <td>可选，规定排序顺序。必须是函数。</td> 
  </tr> 
 </tbody> 
</table>

eg：数组排序  
a-b 为升序，b-a 为降序

var arr = [40,100,1,5,25,10];
    arr.sort(function(a,b){return a-b});

输出结果为：  
1,5,10,25,40,100

### 8.concat() ###

concat() 方法用于连接两个或多个数组。  
语法：

var newArr = arr1.concat(arr2,arr3,...)

参数：

<table> 
 <thead> 
  <tr> 
   <th>参数</th> 
   <th>描述</th> 
  </tr> 
 </thead> 
 <tbody> 
  <tr> 
   <td>arr2,arr3,…</td> 
   <td>必须。该参数可以是具体的值，也可以是数组对象。可以是任意多个。</td> 
  </tr> 
 </tbody> 
</table>

### 9.includes() ###

includes() 方法用来判断一个数组是否包含一个指定的值  
如果是返回 true，否则false。  
语法：

arr.includes(item)

参数：

<table> 
 <thead> 
  <tr> 
   <th>参数</th> 
   <th>描述</th> 
  </tr> 
 </thead> 
 <tbody> 
  <tr> 
   <td>item</td> 
   <td>必须。需要查找的元素值。</td> 
  </tr> 
 </tbody> 
</table>

### 10.copyWithin() ###

copyWithin() 方法用于从数组的指定位置拷贝元素到数组的另一个指定位置中。  
语法：

arr.copyWithin(target, start, end)

参数：

<table> 
 <thead> 
  <tr> 
   <th>参数</th> 
   <th>描述</th> 
  </tr> 
 </thead> 
 <tbody> 
  <tr> 
   <td>target</td> 
   <td>必须。替换开始位置</td> 
  </tr> 
  <tr> 
   <td>start</td> 
   <td>可选。拷贝开始位置</td> 
  </tr> 
  <tr> 
   <td>end</td> 
   <td>可选。拷贝结束位置</td> 
  </tr> 
 </tbody> 
</table>

### 11.fill()填充 ###

fill() 方法用于将一个固定值替换数组的元素。  
语法：

array.fill(value, start, end)

参数：

<table> 
 <thead> 
  <tr> 
   <th>参数</th> 
   <th>描述</th> 
  </tr> 
 </thead> 
 <tbody> 
  <tr> 
   <td>value</td> 
   <td>必须。填充的内容</td> 
  </tr> 
  <tr> 
   <td>start</td> 
   <td>可选。填充开始位置</td> 
  </tr> 
  <tr> 
   <td>end</td> 
   <td>可选。填充结束位置</td> 
  </tr> 
 </tbody> 
</table>

### 12.find()查找 ###

find() 方法返回满足函数条件的数组的第一个元素的值。  
语法：

var arr = [1,6,88,45,8000,889];
    var ret = arr.find(item=>item>100);

参数：