for in是ES5标准,for of是ES6标准;

for in是遍历对象属性,for of是遍历对象元素。

for of兼容性还不够,移动端安卓微信浏览器貌似不支持,苹果的可以;web端IE支持也不够,chrome可以。

先说结论:

  1. 推荐在循环对象属性的时候,使用for...in,在遍历数组的时候的时候使用for...of

  2. for...in循环出的是key,for...of循环出的是value

  3. 注意,for...of是ES6新引入的特性。修复了ES5引入的for...in的不足

  4. for...of不能循环普通的对象,需要通过和Object.keys()搭配使用

var student={
name:'wujunchuan',
age:,
locate:{
country:'china',
city:'xiamen',
school:'XMUT'
}
}
for(let key in student){
console.log(key); //输出的是属性
console.log(student[key]); //输出的是属性值
} //name age locate
var student={
name:'wujunchuan',
age:,
locate:{
country:'china',
city:'xiamen',
school:'XMUT'
}
}
for(let key of Object.keys(student)){
console.log(key); //使用Object.keys()方法获取对象key的数组
console.log(student[key]) ;//输出的是属性值
}
var arr= ['a','b','c']
for(let key in arr){
console.log(key);//输出的是 键名 0 1 2
console.log(arr[key]);//输出的是 键值 a b c
}
var arr= ['a','b','c','d','e']
for(let value of arr){
console.log(value);//输出的是 键值 a b c d e
}
var arr= ['a','b','c','d','e']
for(let key of arr.keys()){
console.log(key);//输出的是键名 0 1 2 3 4
}
var arr= ['a','b']
for(let case of arr.entries()){
console.log(case);//输出的是键值对 [0,'a'] [1,'b']
}

javascript总for of和for in的区别?的更多相关文章

  1. javascript中apply、call和bind的区别,容量理解,值得转!

    a)  javascript中apply.call和bind的区别:http://www.cnblogs.com/cosiray/p/4512969.html b)  深入浅出 妙用Javascrip ...

  2. javascript中三目运算符和if else有什么区别

    javascript中三目运算符和if else有什么区别今天写了一个图片轮播的小demo,用到了判断先试了一下if else,代码如下:if(n >= count-1){n =0;}else{ ...

  3. JavaScript中var和this定义变量的区别

    JavaScript中var和this定义变量的区别 在js中声明变量时可以使用var和this,但使用this的有很大一部分参考书是没有的,经过查阅相关资料总结如下: 用var和this声明变量,存 ...

  4. javascript中back(-1)和go(-1)的区别

    javascript中back(-1)和go(-1)的区别 一.总结 一句话总结: 数据 history.back(-1):直接返回当前页的上一页,数据全部消息,是个新页面 history.go(-1 ...

  5. JavaScript中基本数据类型和引用数据类型的区别(栈——堆)

    JavaScript中基本数据类型和引用数据类型的区别 1.基本数据类型和引用数据类型 ECMAScript包括两个不同类型的值:基本数据类型和引用数据类型. 基本数据类型指的是简单的数据段,引用数据 ...

  6. javascript总述

    一.JavaScript核心 一个完整的JavaScript应该由下列三个不同的部分组成. 1.核心(ECMAScript) 2.文档对象模型(DOM,Document Object Model) 3 ...

  7. JavaScript 中 Number()、parseInt()、parseFloat()的区别

    Number(): 概述:Number 对象由 Number() 构造器创建,是经过封装的能让你处理数字值的对象.在非构造器上下文中 (如:没有 new 操作符),Number 能被用来执行类型转换. ...

  8. 一张图轻松搞懂javascript event对象的clientX,offsetX,screenX,pageX区别

    总是会被javascript的event对象的clientX,offsetX,screenX,pageX 弄得头晕,于是决定做个图来区分一下(画得我手那个酸呀....) 先总结下区别: event.c ...

  9. Javascript中event.srcElement和event.target的区别

    event.srcElement 可以捕获当前事件作用的对象,如event.srcElement.tagName可以捕获活动标记名称.注意获取的标记都以大写表示,如"TD",&qu ...

随机推荐

  1. Python爬虫系列-Requests库详解

    Requests基于urllib,比urllib更加方便,可以节约我们大量的工作,完全满足HTTP测试需求. 实例引入 import requests response = requests.get( ...

  2. python-for循环与while循环

    while 循环 格式: while 条件 为 True: 代码块 while True: rayn_age = 18 age = input('请输入你的年龄:') age = int(age) i ...

  3. GoF23种设计模式之行为型模式之模板方法

    概述 定义一个操作中的算法的骨架,而将一些步骤延迟到子类中. TemplateMethod使得子类可以不改变一个算法的结构即可重定义该算法的某些特定步骤. 适用性 1.一次性实现一个算法的不变的部分, ...

  4. 【全面】Linux基础知识和基本操作语句大全(一)

    接触Linux已经有一段时间了,由于实际需要,三三两两地掌握了一些基本语法和实用语句,主要都是在日常开发中用得比较多的,条理不是特别清晰,请见谅!下面开始上硬货!! 基本操作: 关闭Linux系统的命 ...

  5. python并发编程之线程剩余内容(线程队列,线程池)及协程

    1. 线程的其他方法 import threading import time from threading import Thread,current_thread def f1(n): time. ...

  6. LeetCode(268) Missing Number

    题目 Given an array containing n distinct numbers taken from 0, 1, 2, -, n, find the one that is missi ...

  7. 【HIHOCODER 1176】 欧拉路·一

    描述 小Hi和小Ho最近在玩一个解密类的游戏,他们需要控制角色在一片原始丛林里面探险,收集道具,并找到最后的宝藏.现在他们控制的角色来到了一个很大的湖边.湖上有N个小岛(编号1..N),以及连接小岛的 ...

  8. LightOj:1422-Halloween Costumes

    传送门:http://www.lightoj.com/volume_showproblem.php?problem=1422 Halloween Costumes problem descriptio ...

  9. HBase0.94.2-cdh4.2.0需求评估测试报告1.0之五

    根据以上图分析得出以下结论: 1. 在上面的hbase配置下,顺序和随机写记录(每条记录1K),每写入86-87M(大小可配)左右数据生成一个磁盘文件(store file). 2. 在上面的hbas ...

  10. WPF触控程序开发(二)——整理的一些问题

    上一篇(WPF触控程序开发)介绍了几个比较不错的资源,比较基础.等到自己真正使用它们时,问题就来了,现把我遇到的几个问题罗列下,大家如有遇到其他问题或者有什么好的方法还望赐教. 问题1.如何获取触控点 ...