美文网首页
JS 循环 OR 数组遍历

JS 循环 OR 数组遍历

作者: Cherry丶小丸子 | 来源:发表于2019-05-29 18:15 被阅读0次

    while OR do-while

    //while语句
    while(){
        //......
    }
    
    //do-while语句
    do{
        //......
    }while(){
        //......
    }
    

    for

    for(var i = 0; i < array.length; i++){
        //......
    }
    

    forEach

    //currentValue  当前元素
    //index         当前元素的索引值。
    //arr           当前元素所属的数组对象。
    //thisValue     传递给函数的值一般用 "this" 值。如果这个参数为空, "undefined" 会传递给 "this" 值
    objArr.forEach(function(currentValue,index,arr){
        console.log(value);
    },thisValue);
    
    //用forEach遍历数组的话,不能中断循环(使用break或者return)
    //如果要提前终止,必须把forEach()方法放在一个try块中,并能抛出一个异常。如果forEach()调用的函数抛出foreach.break异常,循环会提前终止。
    function foreach(a,f,t){
        try {
            a.forEach(f,t)
        }catch(e){
            if(e === foreach.break)return;
            else throw e;
        }
    }
    foreach.break = new Error("StopIteration");
    

    for-in

    for-in 语句用于遍历数组或者对象的属性(键名)
    //index  必须。当前元素的索引值
    let objArr = [ 'a', 'b', 'c' ];
    for(var index in objArr){
        console.log(index) // 0 1 2
        console.log(objArr[index]) // a b c
    }
    
    let es6 = {
        edition: 6,
        committee: "TC39",
        standard: "ECMA-262"
    };      
    for (let e in es6) {
        console.log(e); // edition committee standard
        console.log(es6[e]); // 6 TC39 ECMA-262
    }
    //for-in循环实际是为循环”enumerable“对象而设计的
    ****数组上不建议使用for-in循环****
    以上代码会出现的问题:
    1.index 值是字符串(String)类型,可能无意间进行字符串的计算“2”+1=“21”等,所以不能直接进行几何运算
    2.循环不仅会遍历数组元素,还会遍历任意其他自定义添加的属性,如,objArr上面包含自定义属性,objArr.name,那这次循环中也会出现此name属性
    3.某些情况下,上述代码会以随机顺序循环数组
    

    for-of

    //currentValue  必须。当前元素的值
    for(let currentValue of objArr){
        console.log(currentValue)
    }
    JavaScript6里引入了一种新的循环方法,它就是for-of循环,它既比传统的for循环简洁,同时弥补了forEach和for-in循环的短板。
    
    如果循环普通对象,会报错 // TypeError: es6[Symbol.iterator] is not a function 或者 // Uncaught TypeError: es6 is not iterable
    解决方法是,使用Object.keys方法将对象的键名生成一个数组,然后遍历这个数组
    for (let key of Object.keys(someObject)) {
        console.log(key + ': ' + someObject[key]);
    }
    
    如果使用for of 想要获取当前索引值
    var arr = [ 'a', 'b', 'c' ];
    for( let [ index,currentValue ] of new Map( arr.map( ( item, i ) => [ i, item ] ) ) ) {
        console.log(index, currentValue);
    }
    或者
    for( let [ index,currentValue ] of arr.entries() ) {
        console.log(index, currentValue);
    }
    
    
    
    for-of可以循环遍历很多东西
    1、循环一个数组(Array)
    2、循环一个字符串
    3、循环一个类型化的数组(TypedArray)
    4、循环一个Map
    5、循环一个set
    6、循环一个 DOM collection(节点)
    7、循环一个拥有enumerable属性的对象
    8、循环一个生成器(generators)
    

    map

    //currentValue  必须。当前元素的值
    //index 可选。当前元素的索引值
    //arr   可选。当前元素属于的数组对象
    //thisValue  对象作为该执行回调时使用,传递给函数,用作 "this" 的值。如果省略了 thisValue,或者传入 null、undefined,那么回调函数的 this 为全局对象。
    
    array.map(function(currentValue,index,arr), thisValue)
    
    map() 方法返回一个新数组,数组中的元素为原始数组元素调用函数处理后的值。
    map() 方法按照原始数组元素顺序依次处理元素。
    注意: map() 不会对空数组进行检测。
    注意: map() 不会改原始数组。
    

    filter

    filter() 方法创建一个新的数组,新数组中的元素是通过检查指定数组中符合条件的所有元素。
    注意: filter() 不会对空数组进行检测。
    注意: filter() 不会改变原始数组。
    
    array.filter(function(currentValue,index,arr), thisValue)
    
    var ages = [32, 33, 16, 40];
    ages.filter(function(currentValue){
        return currentValue >= 18; //32,33,40
    })
    

    some、every

    some() 方法用于检测数组中的元素是否满足指定条件(函数提供)。
    some() 方法会依次执行数组的每个元素:
    如果有一个元素满足条件,则表达式返回true , 剩余的元素不会再执行检测。
    如果没有满足条件的元素,则返回false。
    注意: some() 不会对空数组进行检测。
    注意: some() 不会改变原始数组。
    
    var resSome = array.some(function(currentValue,index,arr),thisValue)
    
    every() 方法用于检测数组所有元素是否都符合指定条件(通过函数提供)。
    every() 方法使用指定函数检测数组中的所有元素:
    如果数组中检测到有一个元素不满足,则整个表达式返回 false ,且剩余的元素不会再进行检测。
    如果所有元素都满足条件,则返回 true。
    注意: every() 不会对空数组进行检测。
    注意: every() 不会改变原始数组。
    
    var resEvery = array.every(function(currentValue,index,arr), thisValue)
    

    reduce、reduceRight

    //total           必需。初始值, 或者计算结束后的返回值。
    //currentValue    必需。当前元素
    //currentIndex    可选。当前元素的索引
    //arr             可选。当前元素所属的数组对象。
    //initialValue    传递给函数的初始值
    
    array.reduce(function(total, currentValue, currentIndex, arr), initialValue)
    
    reduce() 方法接收一个函数作为累加器,数组中的每个值(从左到右)开始缩减,最终计算为一个值。
    reduce() 可以作为一个高阶函数,用于函数的 compose。
    注意: reduce() 对于空数组是不会执行回调函数的。
    
    let arr = [1,2,3];
    let ad = arr.reduce(function(i,j){
     return i+j;
    })
    // 6
    
    reduceRight和reduce相反,是从右到左
    

    Object.keys()遍历对象的属性,返回一个数组

    Object.getOwnPropertyNames()遍历对象的属性

    相关文章

      网友评论

          本文标题:JS 循环 OR 数组遍历

          本文链接:https://www.haomeiwen.com/subject/fufutctx.html