js中forEach,for in,for of的区别

<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport"
          content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
</head>
<body>
<script>
    var arr = [1,2,3];
    arr.four = 4;
    console.log(arr);

    arr.forEach(value => {
        /*if(value > 2) {
            break
    }*/
        console.log(value)//1,2,3
    })

    for(let i in arr) {
        console.log(i); // ‘0‘ ‘1‘ ‘2‘ ‘four‘ 相当于对象的key值
        console.log(arr[i]) // 1,2,3,4 相当于对象的value值
    }

    for (let i of arr) {
        if(i > 2) {
            break
        }
        console.log(i); // 1,2,3  数值中的每一项的值
        console.log(arr[i]);//2,3,undefined 相当于arr[1],arr[2],arr[3]
    }

    for (let i of ‘my‘) {
        console.log(i); // ‘m‘ ‘y‘
    }

    for (let i of arr) {
        if(i > 2) {
            break
        }
        console.log(i); // 1,2
    }

</script>
</body>
</html>

总结:如果遍历数组最好用for of,遍历对象用for in
for of遍历数组和forEach遍历数组的区别:for of能用break语句,forEach不能

时间: 2024-08-28 01:11:54

js中forEach,for in,for of的区别的相关文章

JS中apply()与call()的含义与区别

JavaScript中,apply()与call()的含义一样,均为改变调用函数中的this指向.其中apply()与call()的第一个参数表示所要指向的对象,若调用函数无参数可不写,则默认为window.第一个参数后的参数表示调用函数的参数,其中apply()第一个参数后面的参数为一个数组,call()第一个参数后面为0或多个参数. 例: 1 window.x = 100; 2 3 4 var obj = {}; 5 obj.x = 1; 6 obj.test = function(a) {

js中对象的浅拷贝和深拷贝的区别

js中对象的浅拷贝和深拷贝的区别 浅度拷贝:复制一层对象的属性,并不包括对象里面的为引用类型的数据,当改变拷贝的对象里面的引用类型时,源对象也会改变. 深度拷贝:重新开辟一个内存空间,需要递归拷贝对象里的引用,直到子属性都为基本类型.两个对象对应两个不同的地址,修改一个对象的属性,不会改变另一个对象的属性. 数据的类型: 一般数据(值传递):字符,数值,布尔,undefined 拷贝(复制)时,传递的是值,修改新数据,不会影响老数据 复杂数据(引用传递):对象 拷贝(复制)时,传递的是内存地址的

详解JS中Number()、parseInt()和parseFloat()的区别

转载:详解JS中Number().parseInt()和parseFloat()的区别 三者的作用: Number(): 可以用于任何数据类型转换成数值: parseInt().parseFloat(): 专门用于把字符串转换成数值: 一.Number( ): (1)如果是Boolean值,true和false将分别转换为1和0. (2)如果是数字值,只是简单的传入和返回. (3)如果是null值,返回0. (4)如果是undefined,返回NaN. (5)如果是字符串,遵循下列规则: 如果字

js中数组遍历for与for in区别(强烈建议不要使用for in遍历数组)

转自: http://www.cnblogs.com/javaee6/p/4142270.html?utm_source=tuicool&utm_medium=referral js中遍历数组的有两种方式 1 2 3 4 5 6 7 8 9 var array=['a'] //标准的for循环 for(var i=1;i<array.length;i++){     alert(array[i]) } //foreach循环 for(var i in array){     alert(ar

JS中style.display和style.visibility的区别

在JS中可以通过设置style.display或者style.visibility属性来控制元素是否显示,在style.display=block和style.visibility=visible的时候,元素被显示,在style.display=none和style.visibility=hidden的时候,元素被隐藏.它们之间最大的区别是通过style.display=none隐藏的时候,元素不占据原来的位置,从文档流中脱离,后续的元素填补其位置.通过style.visibility=hidd

JS中的substring和substr函数的区别

1. 在JS中, 函数声明: stringObject.substring(start,stop) start是在原字符串检索的开始位置,stop是检索的终止位置,返回结果中不包括stop所指字符. 如:"hamburger".substring(4,8) returns "urge" 2. substr(start,length) 如:当DETAIL_TYPE 的值为1111053 时,substr(DETAIL_TYPE,1,6)  = 111105 从DETA

js中call、apply和bind的区别

前言 关于js中call.apply和bind这三者的区别,这应该是一个老生常谈的问题,也是前端面试时经常会遇到的一道题目,因此也抽空把它理一遍. 作用 call.apply和bind都是一个javascript中的方法,他们的共同作用就是改变函数执行时的上下文,即改变函数执行时this的指向.我们来看下面的例子: 1 function Animal(name) { 2 this.name = name; 3 } 4 Animal.prototype.getName = function() {

深入了解JS中通过[]和.获取对象属性的区别

一般来说,'.'运算符和[]可以相互替代,比如 1 let obj = { 2 name : 'sena' 3 }; 4 5 console.log(obj.name) // 'sena' 6 console.log(obj[name]) // 'sena' 在这之上,我们需要了解关于他们的一些限制 .运算符:  右侧必须是一个属性名称命名的简单标识符 [] :  右侧必须是一个计算结果为字符串的表达式 先复习一下JS中的标识符: /* 标识符 - 在JS中所有的可以由我们自主命名的都可以称为是

js中forEach的用法

<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>forEach的用法</title></head><body><span id="number"></span><input type="text" id="