js数组学习(ES6+)

文章目录

        • js(ES6+)数组学习
          • 1.Array.prototype.forEach(fn)
          • 2.Array.prototype.map(fn)
          • 3.Array.prototype.filter(fn)
          • 4.Array.prototype.reduce(fn)
          • 5.Array.prototype.some(fn) every
          • 6.Array.prototype.find(fn)
          • 7.Array.prototype.includes(item)

js(ES6+)数组学习

1.Array.prototype.forEach(fn)

遍历数组,传一个函数,每次遍历会运行该函数


const arr = [45, 7, 2, 4, 1, 57, 3]

// for (const item of arr) {
//     console.log(item);
// }

// arr.forEach(function(item){
//     console.log(item);
// });

//遍历时函数里其实有三个参数,需要的时候,可以把数据下标和数组本身
arr.forEach(function(item,index,arr){
    console.log(item,index,arr);
});
2.Array.prototype.map(fn)

数组映射,传入一个函数,映射数组中的每一项,不会改动原数组,然后返回一个新的数组!

const arr = [45, 7, 2, 4, 1, 57, 3]

//数组每一项翻倍
const newArr = arr.map(function(item){
    return item*2;
});
console.log(newArr)

//随意用,比如返回一个对象
const newArr1 = arr.map(function(item){
    return{
        n : item,
        doubleN : item*2
    };
});

console.log(newArr1,'newArr1')
3.Array.prototype.filter(fn)

数组筛选,传入一个函数,仅保留满足条件的项。不会改变原数组,然后返回一个新数组!

const arr = [45, 7, 2, 4, 1, 57, 3]
//返回 和原数组一样的内容
const newArr = arr.filter(function (item){
    return true;
});

//返回新数组是个空数组,false把每一项都排除掉了
const newArr1 = arr.filter(function (item){
    return false;
});

//返回奇数数组
const newArr2 = arr.filter(function (item){
    return item % 2 !== 0;
});
console.log(newArr2)
4.Array.prototype.reduce(fn)

数组聚合,传入一个函数,对数组每一项按照该函数的返回聚合。 数组聚合相对复杂一点,但是多用于求和,简单理解很多项揉成一项就能用reduce。

const arr = [45, 7, 2, 4, 1, 57, 3]

const sum = arr.reduce(function(a,b){
    return a+b;
},0);
console.log(sum,'求和')
/**
 * 详细分析:
 * reduce函数里 有两个参数,一个function,第二个默认值0。到底是怎么运行的:
 * reduce一开始在内部开了一个空间,记录一开始的结果(用result代表)就是第二个参数,为0。
 * 然后function开始运行,把result为0这个结果给第一项a,我们数组arr第一项 45给b,a始终是
 * 当前的结果,当前结果是0,45给b,返回a+b=45,result就更新为45,这时候又把result=45 传给a,
 * arr第二个元素7给b,返回 a+b=52,result就更新为52,再次传给a,往复下去。直到b为3,
 * return a+b,最终结果为119
 */
5.Array.prototype.some(fn) every
const arr = [45, 7, 2, 4, 1, 57, 3]
//只要有一个元素满足条件就返回true,否则false
const result = arr.some(function (item) {
    return item > 50;
});
console.log(result,'结果')

//所有元素都要满足条件返回true,否则false
const result1 = arr.every(function (item) {
    return item > 0;
});
console.log(result1,'结果1')
6.Array.prototype.find(fn)

传入一个函数,找到数组中第一个能通过改函数测试的项
返回满足条件的元素,但是有两个元素满足条件时候,返回的还是第一个元素,怎么解决。用filter就行。

const arr = [45, 7, 2, 4, 1, 57, 3,54]
const result = arr.find(function(item){
    return item > 50;
});
console.log(result)
7.Array.prototype.includes(item)

判断数组中是否存在item,判定规则使用的是Object.is。传的不是函数了,传的是元素。//object.is({},{}) object.is(1,1),object.is理解为===

const arr = [45, 7, 2, 4, 1, 57, 3,54]
const result = arr.includes(2)
console.log(result)

你可能感兴趣的:(JS学习,javascript,学习,es6)