map, filter, some, every , find, forEach, for..in, for...of等使用方法说明

「爱情、让人受尽委屈。」 2021-09-18 02:36 285阅读 0赞

let arr = [1, 2, 3, 4, 5];
    
    
    // map 使用 (处理数组,返回数组)
    var res = arr.map( item => { 
        return item * 2;
    });
    // res: [2, 4, 6, 8, 10]
    
    
    // filter 使用  (删选符合条件元素,返回数组)
    var res = arr.filter( item => {
        return item > 3;
    });
    // res: [4, 5]
    
    
    // some 使用  (判断是否有元素符合条件,返回boolean)
    var res = arr.some( item => {
        return item > 3;
    });
    // res: true
    
    
    // every 使用  (判断每个元素是否符合条件,返回boolean))
    var res = arr.every( item => {
        return item > 3;
    });
    // res: fasle
    
    
    // find 使用   (找到第一个符合条件元素,返回该元素,否则返回undefined)
    var res = arr.find(item => {
        return item > 1
    })  
    // res: 2
    
    
    // includes 使用 (查找数组中是否包含该元素,返回boolean)
    var res = arr.includes(2)
    // res: true
    
    
    // forEach 使用 (没有返回值,只针对元素调用func, 不能使用break,return终止循环)
    var res = [];
    arr.forEach(item => {
        res.push(item*2)
    })
    // res: [2, 4, 6, 8, 10]
    
    
    // reducer 使用 (常用于累加, 不作累加时可替代forEach)
    array.reduce(function(total, currentValue, currentIndex, arr), initialValue);
    var sum= arr.reduce(function(total,num){ //第一个参数为叠加总值，需要初始化，第二个参数是当前项
        return total+ num;
      },0);    //后面这个参数零是sum的初始化, 意思是从零开始累加
    // sum : 15
    // 用法二 筛选
    var arr1 = [{id:1,name:2},{id:2,name:2},{id:3,name:2}]
    var sum = arr1.reduce((arr,cur)=>{
    arr.push(cur.id);
    return arr
    },[])
    // sum [1,2,3]
    // 用法三 list转换对象
    [{id:1,name:2},{id:2,name:2},{id:3,name:2}].reduce((t,c,i)=>{
        t[i] = c;
        return t;
    },{})
    
    // {0: {…}, 1: {…}, 2: {…}}
    // 0: {id: 1, name: 2}
    // 1: {id: 2, name: 2}
    // 2: {id: 3, name: 2}
    
    
    // for in 使用  (只为循环enumerable(可枚举)对象而设计,不推荐遍历数组,key为键名)
    // 注意 : for...in 是遍历对象本身的所有可枚举属性，以及对象从其构造函数原型中继承的属性
    let obj = {name:"Tom",age:17};
    for(var key in obj){
        console.log(key)
    }
    // name age
    
    
    // for of 使用 (可循环Arrays（数组）, Strings（字符串）, Maps（映射）, Sets（集合）等可迭代的数据结构等。)
    // 注意: for...of 不能遍历对象
    for(var value of arr){
        console.log(value)
    }
    // 1 2 3 4 5
    let mapData = new Map([['a', 1], ['b', 2], ['c', 3]]);
    for(var [key,value] of mapData ){
        console.log(value)
    }
    // 1 2 3
    
    
    // indexOf() 使用 (搜索数组或者字符串是否存在搜索元素, 存在返回当前元素索引,不存在返回-1)
    // 可传两个参数, 第一个是要搜索的元素, 第二个是开始搜索的位置(详细使用查手册)
    arr.indexOf(2) 
    // 1
    
    
    // lastIndexOf()  (用法同indexOf, 不过是逆序搜索)
    
    
    
    // Object.keys()，Object.values()，Object.entries() 使用
    let obj = {name:"Tom",age:17};
    
    var res = Object.keys(obj)
    // res : ["name", "age"]
    
    var res = Object.values(obj)
    // res : ["Tom", "17"]
    
    var res = Object.entries(obj)
    // res : [["name","Tom"], ["age",17]]
    
    
    // 补充一点 虽然for...of不能遍历对象, 
    // 但是配合Object.keys()，Object.values()，Object.entries() 使用就无敌了
    
    
    let {keys, values, entries} = Object;
    let obj = { a: 1, b: 2, c: 3 };
     
    for (let key of keys(obj)) {
      console.log(key); // 'a', 'b', 'c'
    }
     
    for (let value of values(obj)) {
      console.log(value); // 1, 2, 3
    }
     
    for (let [key, value] of entries(obj)) {
      console.log([key, value]); // ['a', 1], ['b', 2], ['c', 3]
    }

> 补充 : map, filter, some, every , find, forEach 都方法可传两个参数, 第一个参数是值, 第二个参数是索引值, 更详细的使用请查手册

发表评论取消回复

表情：

评论列表（有 0 条评论，285人围观）

还没有评论，来说两句吧...

相关阅读

相关 [转载] Vue中常用的数组方法filter、map、forEach、find、findIndex、some、every

> Vue中常用的数组方法 .filter()、.map()、.forEach()、.find()、.findIndex()、.some()、.every() > 本文仅为

忘是亡心i/ 2023年10月05日 12:14/ 0 赞/ 19 阅读

相关 map() forEach() some() every() filter() find() findIndex() slice() splice() split()

map() forEach() some() every() filter() find() findIndex() slice() splice() split()

傷城~/ 2023年07月18日 01:58/ 0 赞/ 28 阅读

相关简述forEach()、map()、filter()、every()、some()的用法

文章目录 1.forEach() 2.map() 3.filter() 4.every() 5.som

末蓝、/ 2022年12月23日 09:40/ 0 赞/ 191 阅读

相关 node.js中数组常用的方法：forEach、map、filter、every、some

前言工作中我们经常会遇到对数组的一些操作方法，或者对数字，对字符串，对json，但万变不离其宗，且听本文详细分解，本示例分为两个版本，一个是简单数字版本，一个是稍微复杂

小灰灰/ 2022年09月12日 09:54/ 0 赞/ 470 阅读

相关 JavaScript Array数组迭代方法every()、some()、filter()、forEach()、map()

every()方法 some()方法 filter()方法 forEach()方法

蔚落/ 2022年05月15日 10:26/ 0 赞/ 357 阅读

相关 JS中find(), findIndex(), filter(), forEach(), some(), every(), map(), reduce()方法记录

1. find()与findIndex() find()方法，用于找出第一个符合条件的数组成员。它的参数是一个回调函数，所有数组成员依次执行该回调函数，直到找出第一

女爷i/ 2022年05月09日 12:34/ 0 赞/ 298 阅读

相关 JS数组（every、some、filter、forEach、map、reverse、sort、indexOf、lastindexOf方法）

reverse方法 JavaScript中数组的reverse()方法用于将数组倒序输出，并且改变了原数组，并且返回的也是新数组。 var arr=["8",3

拼搏现实的明天。/ 2022年01月29日 03:15/ 0 赞/ 380 阅读

相关 Js 数组——filter()、map()、some()、every()、forEach()、lastIndexOf()、indexOf()

原文：[https://www.cnblogs.com/xiao-hong/p/3194027.html][https_www.cnblogs.com_xiao-hong_p_

深藏阁楼爱情的钟/ 2022年01月06日 00:37/ 0 赞/ 419 阅读

相关 map, filter, some, every , find, forEach, for..in, for...of等使用方法说明

let arr = [1, 2, 3, 4, 5]; // map 使用 (处理数组,返回数组) var res = arr.map

「爱情、让人受尽委屈。」/ 2021年09月18日 02:36/ 0 赞/ 286 阅读

相关 find(), findIndex(), filter(), forEach(), some(), every(), map(), reduce()方法

1. find()与findIndex() > find()方法，用于找出第一个符合条件的数组成员。它的参数是一个回调函数，所有数组成员依次执行该回调函数，直到找出第一个返

深碍√TFBOYSˉ_/ 2021年09月02日 07:18/ 0 赞/ 435 阅读