Javascript Es6方法合集

• 1.filter
• 2.map
• 3.reduce
• 10.findIndex

1.filter

原理

filter()该方法创建一个新数组，原始数组的每个元素都被传递到回调函数中，该函数具有return返回值，如果返回值为true，此元素将保存到新数组中；false，元素不会保存到新数组中。

let values=[NaN, 10, 10, 0, 10, 10, 10, 10, 10, 10] 
//过滤掉NaN和0
//1.
let Liet= values.filter((item) => {
   return !isNaN(item)&&item
 });
 //2.
let Liet= values.filter((item) =>!isNaN(item)&&item);
//[10, 10, 10, 10, 10, 10, 10, 10]

//
let Liet= values.filter((item,index,arr) => {
        console.log(values,item,index,arr);
        return !isNaN(item)&&item
 });

2.map

map() 该方法返回一个新数组，数组中的元素是原始数组元素调用函数处理的值。

map() 该方法按原始数组元素的顺序处理元素。
返回一个新数组，其元素是原始数组元素调用函数处理的值。

注意： map() 未检测到空数组。

注意： map() 原始数组不会更改。

let ids = this.dynamicTags.map((item) => item.id);
// ["1354306079344857089", "1368812632591613954", "1370252422465757185", "1425622827346993153"]

let numbers = [1, 4, 9];
let roots = numbers.map(Math.sqrt);
//numbers [1, 4, 9]
//roots  [1, 2, 3]
//Math.sqrt(4)---2求平方根

let numbers = [1, 4, 16];
let numbers1 = numbers.map((currentValue, index, array) => {
      console.log("numbers1", currentValue, index, array);
})
//currentValue 数组中正在处理的当前元素
//index 数组中正在处理的当前元素的索引。
//array   map 调用方法的数组。   [1, 4, 16]
//1   0   [1, 4, 16]
//4   1    [1, 4, 16]
//16  2    [1, 4, 16]

function pow(x) {
    return x * x;
}
var arr = [1, 2, 3];
var results = arr.map(pow); // [1, 4, 9]
console.log(results);

我们不仅可以计算上述简单的运算，还可以计算任何复杂的函数，例如，我们可以快速将数字数组转换为字符串数组：

键入数组的元素。

var arr = [1, 2, 3];
var results = arr.map(String); 
console.log("results",results);// [1, 2, 3]
console.log(results.map(Number))// [1, 2, 3]

有时在使用中map例如，如果将字符串数字转换为数字，可能会出现意外结果。你为什么要考虑以下价值观?

var a=[1, 2, 3].map(parseInt); //[1,NaN,NaN]，
说明： map会给callback传递三个参数，第一个是元素本身（当前元素），第二个是元素的索引值（当前元素的索引），第三个是原始数组(map 方法称为数组），并且parseInt您可以接受一个参数或两个参数。当您接受一个参数时，该参数直接是要转换的字符串。接受两个参数时：第一个参数是要转换为数字的字符串，第二个参数是需要转换的二进制。

在js中的参数数map前两个参数自动传递给parseInt，将领先parseInt接受不存在的二进制文件(第二个参数通常是2，8，10，16)而显示NaN因此，如果需要正常显示，则需要parseInt接受一个值或默认其第二个值10

 var a=[1, 2, 3].map(function(x){return parseInt(x);});
 // [1, 2, 3]

3.reduce

Array的reduce()为此设置函数Array的[x1, x2, x3…]在上，此函数必须接收两个参数，reduce()结果继续与序列的下一个元素累加，

累加和

var arr = [1, 3, 5,3];
let results = arr.reduce(function (x, y) {
    return x + y;
}); // 12
console.log(results, results);

求积

var arr = [1, 3, 5,3];
let results = arr.reduce(function (x, y) {
    return x * y;
}); // 45
console.log(results, results);

要把[1, 3, 5, 7, 9]转换为整数13579，reduce()它也可以派上用场：

var arr = [1, 3, 5, 7, 9];
let results =  arr.reduce(function (x, y) {
    console.log(x,y);//x对于结果，每次都使用结果和序列的下一个元素。
    // 1 3
    // 13 5
    // 135 7
    // 1357 9
    return x * 10 +y
});
console.log(results, results);//上次返回值13579

10.findIndex

var num = this.tableDataChange.findIndex((n) => n.state == "1");
//num == -1