精华内容
下载资源
问答
  • 例,for(){}遍历数组 代码如下:[removed] <...i [removed]例,for in循环遍历数组 代码如下:<html><body>[removed]var xvar mycars = new Array()mycars[0] = “Saab”mycars[1] = “Volvo”mycar
  • js for循环 遍历数组 遍历对象属性

    千次阅读 2018-03-19 23:17:45
    1、js for循环 遍历对象属性var person = {fname:"John",lname:"...}控制台输出结果:fname=Johnlname=Doeage=252、js for循环 遍历数组var mycars = new Array("Saab","...

    1、js for循环 遍历对象属性


    var person = {fname:"John",lname:"Doe",age:25};


    for (x in person) {
        console.log(x + "=" + person[x]);
    }


    控制台输出结果:

    fname=John
    lname=Doe
    age=25




    2、js for循环 遍历数组


    var mycars = new Array("Saab","Volvo","BMW");


    for (x in mycars){
        console.log(x + "=" + mycars[x])
    }


    控制台输出结果:

    0=Saab
    1=Volvo
    2=BMW

    展开全文
  • js循环遍历数组(对象) 1,for循环 对于循环应该是最常用的一种遍历方式了,通常用来遍历数组结构。 let arr = ['a','b','c']; for (let i=0; i<arr.length; i++){ console.log(i,arr[i]); } //输出 //0 a //1 ...

    js循环遍历数组(对象)

    1,for循环

    对于循环应该是最常用的一种遍历方式了,通常用来遍历数组结构。

    let arr = ['a','b','c'];
    for (let i=0; i<arr.length; i++){
    	console.log(i,arr[i]);
    }
    //输出
    //0 a
    //1 b
    //2 c
    

    2,forEach循环

    forEach方法用于调用数组的每个元素,并将元素传递给回调函数。对于空数组不会执行回调函数。

    let arr = [1,2,3];
    arr.forEach(function(i,index){
    	console.log(i,index)
    })
    //输出
    // 1 0
    // 2 1
    // 3 2
    

    3,map方法

    map返回一个新数组,数组中的元素为原始数组元素调用函数处理后的值。

    let arr = [1,2,3];
    let newArr = arr.map(function(i){
    	console.log(i) // 1 2 3 
    	return i*2;
    })
    console.log(arr) //[1,2,3]
    console.log(newArr) //[2,4,6] 
    

    4,for…in循环

    for…in语句用于对数组或者对象的属性进行循环操作。

    for…in循环中的代码每执行一次,就会对数组或者对象的属性进行一次操作。

    //遍历对象时,拿到的是键名,不能直接获取键值。
    let obj={name:'programmer',age:'22',height:'180'};
    for(let key in obj){
    	console.log(key,obj[key])
    }
    //输出
    //name programmer
    //age 22
    //height 180
    //可以直接修改原对象
    for(let key in obj){
    	obj[key] = key
    }
    console.log(obj) //{name: "name", age: "age", height: "height"}
    
    //遍历数组时,拿到的是下标
    let arr = ['a','b','c'];
    for (let index in arr){
    	console.log(index,arr[index]);
    }
    //输出
    //0 a
    //1 b
    //2 c
    //可以直接修改原数组
    for(let index in arr){
    	arr[index] = index
    }
    console.log(arr)  // ["0", "1", "2"]
    

    5,for…of循环

    因为是es6引入到新特性中的,借鉴c ++,java,c#和python语言,引入for…of循环,作为遍历所有数据结构的统一方法。

    var arr = ['a', 'b', 'c', 'd'];
    for (let item of arr) {
    	console.log(item); // a b c d
    }
    //在遍历JSON时,我自己跟喜欢用for...of,因为可以直接操作item
    var arr = [{a:1,b:2},{a:3,b:4}];
    for (let item of arr) {
    	item.a = 999
    }
    console.log(arr) //[{a:999,b:2},{a:999,b:4}]
    

    6,while循环

    while用于循环作用基本一致,通常用来循环数组

    let cars=["BMW","Volvo","Saab","Ford"];
    let i=0;
    while (cars[i]){    //()里面是判断条件
    	console.log(cars[i]) // BMW Volvo Saab Ford
    	i++;
    };
    

    7,do while循环

    do while 是while的一个亲戚,它在循环开始前先执行一次操作,然后才进行判断,true就继续执行,false就结束循环。

    let i = 3;
    do{
    	console.log(i) // 3 2 1
    	i--;
    }
    while(i>0);
    

    第一回创作,在学习的道路上,记录一下我学到的小知识,要是有错误,请各位及时指正,万分感谢,要是有所不足,也请指出,我也会继续添加。

    遇到的难题,我也想学习到了,能总结、并且记录下来,好记性不如烂笔头,一只小菜鸟,以此篇开始记录我的成长之路

    展开全文
  • js循环遍历数组

    2019-12-13 15:57:53
    1.for循环 使用临时变量,将长度缓存起来,避免重复获取数组长度,当数组较大时优化效果才会比较明显。 1 2 3 for(j = 0,len=arr.length; j < len; j++) { } 2....

    1.for循环

    使用临时变量,将长度缓存起来,避免重复获取数组长度,当数组较大时优化效果才会比较明显。

    1

    2

    3

    for(j = 0,len=arr.length; j < len; j++) {

        

    }

     

    2.foreach循环

    遍历数组中的每一项,没有返回值,对原数组没有影响,不支持IE

    1

    2

    3

    4

    5

    6

    //1 没有返回值

    arr.forEach((item,index,array)=>{

        //执行代码

    })

    //参数:value数组中的当前项, index当前项的索引, array原始数组;

    //数组中有几项,那么传递进去的匿名回调函数就需要执行几次;

     

    3.map循环

    有返回值,可以return出来

    map的回调函数中支持return返回值;return的是啥,相当于把数组中的这一项变为啥(并不影响原来的数组,只是相当于把原数组克隆一份,把克隆的这一份的数组中的对应项改变了);

    1

    2

    3

    4

    5

    6

    7

    arr.map(function(value,index,array){

     

      //do something

     

      return XXX

     

    })

    1

    2

    3

    4

    5

    6

    var ary = [12,23,24,42,1]; 

    var res = ary.map(function (item,index,ary ) { 

        return item*10; 

    }) 

    console.log(res);//-->[120,230,240,420,10];  原数组拷贝了一份,并进行了修改

    console.log(ary);//-->[12,23,24,42,1];  原数组并未发生变化

     

    4.forof遍历

    可以正确响应break、continue和return语句

    1

    2

    3

    for (var value of myArray) {

    console.log(value);

    }

      

    5.filter遍历

    不会改变原始数组,返回新数组

    1

    2

    3

    4

    5

    var arr = [

      { id: 1, text: 'aa', done: true },

      { id: 2, text: 'bb', done: false }

    ]

    console.log(arr.filter(item => item.done))

    转为ES5

    1

    2

    3

    arr.filter(function (item) {

      return item.done;

    });

    1

    2

    3

    var arr = [73,84,56, 22,100]

    var newArr = arr.filter(item => item>80)   //得到新数组 [84, 100]

    console.log(newArr,arr)

      

    6.every遍历

    every()是对数组中的每一项运行给定函数,如果该函数对每一项返回true,则返回true。

    1

    2

    3

    4

    5

    var arr = [ 1, 2, 3, 4, 5, 6 ]; 

    console.log( arr.every( function( item, index, array ){ 

            return item > 3; 

        })); 

    false

     

    7.some遍历

    some()是对数组中每一项运行指定函数,如果该函数对任一项返回true,则返回true。

    1

    2

    3

    4

    5

    6

    var arr = [ 1, 2, 3, 4, 5, 6 ]; 

       

        console.log( arr.some( function( item, index, array ){ 

            return item > 3; 

        })); 

    true

      

    8.reduce

    reduce() 方法接收一个函数作为累加器(accumulator),数组中的每个值(从左到右)开始缩减,最终为一个值。

    1

    var total = [0,1,2,3,4].reduce((a, b)=>a + b); //10

    reduce接受一个函数,函数有四个参数,分别是:上一次的值,当前值,当前值的索引,数组

    1

    2

    3

    [0, 1, 2, 3, 4].reduce(function(previousValue, currentValue, index, array){

     return previousValue + currentValue;

    });

    reduce还有第二个参数,我们可以把这个参数作为第一次调用callback时的第一个参数,上面这个例子因为没有第二个参数,所以直接从数组的第二项开始,如果我们给了第二个参数为5,那么结果就是这样的:

    1

    2

    3

    [0, 1, 2, 3, 4].reduce(function(previousValue, currentValue, index, array){

     return previousValue + currentValue;

    },5);

     

    第一次调用的previousValue的值就用传入的第二个参数代替,

    9.reduceRight

    reduceRight()方法的功能和reduce()功能是一样的,不同的是reduceRight()从数组的末尾向前将数组中的数组项做累加。

    reduceRight()首次调用回调函数callbackfn时,prevValue 和 curValue 可以是两个值之一。如果调用 reduceRight() 时提供了 initialValue 参数,则 prevValue 等于 initialValuecurValue 等于数组中的最后一个值。如果没有提供 initialValue 参数,则 prevValue 等于数组最后一个值, curValue 等于数组中倒数第二个值。

    1

    2

    3

    4

    5

    var arr = [0,1,2,3,4];

     

    arr.reduceRight(function (preValue,curValue,index,array) {

        return preValue + curValue;

    }); // 10

    回调将会被调用四次,每次调用的参数及返回值如下:

    如果提供一个初始值initialValue5:

    1

    2

    3

    4

    5

    var arr = [0,1,2,3,4];

     

    arr.reduceRight(function (preValue,curValue,index,array) {

        return preValue + curValue;

    }, 5); // 15

    回调将会被调用五次,每次调用的参数及返回的值如下:

    同样的,可以对一个数组求和,也可以使用reduceRight()方法:

    1

    2

    3

    4

    5

    6

    7

    8

    9

    10

    11

    12

    13

    var arr = [1,2,3,4,5,6];

     

    console.time("ruduceRight");

    Array.prototype.ruduceRightSum = function (){

        for (var i = 0; i < 10000; i++) {

            return  this.reduceRight (function (preValue, curValue) {

                return preValue + curValue;

            });

        }

    }

    arr.ruduceRightSum();

    console.log('最终的值:' + arr.ruduceSum()); // 21

    console.timeEnd("ruduceRight"); // 5.725ms

    10.find

    find()方法返回数组中符合测试函数条件的第一个元素。否则返回undefined 

    1

    2

    3

    4

    5

    6

    7

    8

    9

    10

    11

    12

    13

    14

    15

    16

    17

    var stu = [

        {

            name: '张三',

            gender: '男',

            age: 20

        },

        {

            name: '王小毛',

            gender: '男',

            age: 20

        },

        {

            name: '李四',

            gender: '男',

            age: 20

        }

    ]

    1

    2

    3

    4

    5

    6

    7

    function getStu(element){

       return element.name == '李四'

    }

     

    stu.find(getStu)

    //返回结果为

    //{name: "李四", gender: "男", age: 20}

    ES6方法

    1

    stu.find((element) => (element.name == '李四'))

     

    11.findIndex

    对于数组中的每个元素,findIndex 方法都会调用一次回调函数(采用升序索引顺序),直到有元素返回 true。只要有一个元素返回 true,findIndex 立即返回该返回 true 的元素的索引值。如果数组中没有任何元素返回 true,则 findIndex 返回 -1。

    findIndex 不会改变数组对象。

    1

    2

    [1,2,3].findIndex(function(x) { x == 2; });

    // Returns an index value of 1.

    1

    2

    [1,2,3].findIndex(x => x == 4);

    // Returns an index value of -1.

    12.keys,values,entries

     ES6 提供三个新的方法 —— entries(),keys()和values() —— 用于遍历数组。它们都返回一个遍历器对象,可以用for...of循环进行遍历,唯一的区别是keys()是对键名的遍历、values()是对键值的遍历,entries()是对键值对的遍历

    1

    2

    3

    4

    5

    6

    7

    8

    9

    10

    11

    12

    13

    14

    15

    for (let index of ['a', 'b'].keys()) {

    console.log(index);

    }

    // 0

    // 1

    for (let elem of ['a', 'b'].values()) {

    console.log(elem);

    }

    // 'a'

    // 'b'

    for (let [index, elem] of ['a', 'b'].entries()) {

    console.log(index, elem);

    }

    // 0 "a"

    // 1 "b"

    展开全文
  • js----循环遍历数组(键和值)

    千次阅读 2017-11-20 23:22:58
    js------循环遍历数组

    循环遍历数组(key和value)

    for(var x in array){
        key= x;//键
        value = array[x];//值
    }
    展开全文
  • //每日前端夜话第472篇//正文共:1200字//预计阅读时间:7 分钟本文比较并总结遍历数组的四种方式:for 循环:for(letindex=0;indexconstelem=someArray[index];//···}for-in 循环:for(constkeyinsomeArray){...
  • 这里简单总结下前端中数组遍历的四种方式: 数组下标循环 for in 循环 for of 循环 foreach循环 例子 假设有如下数组:members,每个数组元素是一个字典/map,要遍历数组打印每个memberID的值。 var members =...
  • js 循环遍历数组

    2018-09-14 11:58:00
    var siteInfoData = res.data.data.siteInfoList; var siteInfoList = []; console.log(siteInfoData) for (var i = 0; i < siteInfoData.length; i++ ){ ...
  • 原文地址:... 例,for(){}遍历数组 var arr = new Array(13.5,3,4,5,6); for(var i=0;i){  arr[i] = arr[i]/2.0; } alert(arr);   或者
  • js中数组遍历,使用for然后再利用arr.length长度...例1,for(){}遍历数组 <!-- var arr = new Array(13.5,3,4,5,6); for(var i=0;i;i++){ arr[i] = arr[i]/2.0; } // www.jbxue.com alert(arr); //--> 例2
  • 遍历数组要怎么做,可能你首先想到的会是for循环,当然for循环在JavaScript 刚萌生的时候就出现了,想到它也是理所当然的 var a=[[1,2],[3,4],5] for(var i=0;i<a.length;i++){ console.log(a[i]); } ...
  • for-in循环和for循环遍历数组

    万次阅读 2017-09-26 01:22:02
    今天在写代码的时候在用for-in循环遍历数组的时候会出现一些莫名的东西出来,后面查了一下资料。才知道for-in 循环和for循环的区别。 for -in 循环 就是迭代,他迭代的是当前对象的所有的属性和方法,它本身会过滤...
  • 在做用户状态启用禁用的时候 element ui里的switch开关 只能绑定布尔值true跟false 但是后台返回的是0 或 1 所以用forEach switch 循环遍历数组data修改成我们想要的值 很方便 // res.data.forEach((item,index)=&...
  • el表达式循环遍历数组,list和json

    千次阅读 2018-09-19 14:47:23
    el表达式循环遍历数组,list和json 后台用的mvc,返回了一个map,map里面有数组和json,我在前台用${“数组‘}时打印出来是一个好像内存地址的东西,没有办法像用ajax那样,直接可以便利循环,后来查阅了一些网上大家...
  • 数组名 = 旧数组名.map(iterator => { return { 新字段名1: iterator.旧字段名1 新字段名2: iterator.旧字段名2 } }) 例子:
  • 使用map方法,贼简单,当时搞了好久,后来看到一位小...新数组名 = 旧数组名.map(iterator => { return { 新字段名1: iterator.旧字段名1 新字段名2: iterator.旧字段名2 } }) 试试很简单,举个例子: ...

空空如也

空空如也

1 2 3 4 5 ... 20
收藏数 1,887
精华内容 754
关键字:

循环遍历数组js