美文网首页JavaScript
JavaScript----map、foreach、for、fo

JavaScript----map、foreach、for、fo

作者: 扮猪老虎吃 | 来源:发表于2020-11-06 17:41 被阅读0次

    map()

    map方法返回一个新的数组,数组中的元素为原始数组调用函数处理后的值
    注意map方法不会改变原始数组

    let arr = [0,2,4,6,8];
    let str = arr.map(function(item,index,arr){
        console.log(this);
        console.log(item);
        console.log('原数组arr:',arr);   // 会执行五次
        return item/2;
    },this);
    console.log(str); //[0,1,2,3,4],
    
    运行结果: 原数组不发生改变
    {}
    0
    原数组arr: [ 0, 2, 4, 6, 8 ]
    {}
    2
    原数组arr: [ 0, 2, 4, 6, 8 ]
    {}
    4
    原数组arr: [ 0, 2, 4, 6, 8 ]
    {}
    6
    原数组arr: [ 0, 2, 4, 6, 8 ]
    {}
    8
    原数组arr: [ 0, 2, 4, 6, 8 ]
    [ 0, 1, 2, 3, 4 ]
    

    foreach

    foreach方法没有返回一个新数组&没有返回值

    let arr = [0,2,4,6,8]
    let sum =0;
    let str = arr.forEach((item,index,arr) => {
        sum += item;
        console.log("item的值为:", item)
        console.log("index的值为:", index)
        console.log("arr的值为:", arr)
        console.log("sum的值为:",sum);
    })
    console.log(str)
    
    运行结果: 返回值为undefined
    item的值为: 0
    index的值为: 0
    arr的值为: [ 0, 2, 4, 6, 8 ]
    sum的值为: 0
    item的值为: 2
    index的值为: 1
    arr的值为: [ 0, 2, 4, 6, 8 ]
    sum的值为: 2
    item的值为: 4
    index的值为: 2
    arr的值为: [ 0, 2, 4, 6, 8 ]
    sum的值为: 6
    item的值为: 6
    index的值为: 3
    arr的值为: [ 0, 2, 4, 6, 8 ]
    sum的值为: 12
    item的值为: 8
    index的值为: 4
    arr的值为: [ 0, 2, 4, 6, 8 ]
    sum的值为: 20
    undefined
    

    map和foreach的联系与区别

    • 联系

    1.都是循环遍历数组中的每一项
    2.每次执行匿名函数都支持三个参数,参数分别为:
       item(当前每一项),index(索引值),arr(原数组)
    3.匿名函数中的this都是指向window
    4.只能遍历数组
    5.不能停止遍历,除非程序报错

    • 区别

    返回值

    • 示例说明区别
    let arr = [0,2,4,6,8]
    let a = arr.forEach(function(item,index,arr){ 
        return 123
    });
    let b = arr.map(function(item,index,arr){
        return 123
    }); 
    console.log(a);    //undefined
    console.log(b);    //[ 123, 123, 123, 123, 123 ]
    
    • 运行结果:
    undefined
    [ 123, 123, 123, 123, 123 ]
    

    for

    let arr = [0,2,4,6,8]
    for (let index = 0; index < arr.length; index++) {  
        console.log(arr[index]);  
    }  
    
    ES5开始,可以用foreach代替for实现遍历
    let arr = [0,2,4,6,8]
    arr.forEach(function (value) {  
        console.log(value);  
    });
    

    for in

    • 循环下标,遍历数组。
    let arr = [0,2,4,6,8]
    for (let index in arr) { 
      console.log(arr[index]);  
    }  
    

    for of

    • 循环元素(项),遍历数组
    let arr = [0,2,4,6,8]
    for (let value of arr) { 
      console.log(value);  
    }  
    

    相关文章

      网友评论

        本文标题:JavaScript----map、foreach、for、fo

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