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. tmp_获取下一个回文数

    直接拿之前一次竞赛中写的code,稍微完善了点,后面有机会在优化 uint64_t GetNextPalindrome(uint64_t data) { //100以内的数字已经特殊考虑过,不存在差值 ...

  2. 《零基础入门学习Python》【第一版】视频课后答案第001讲

    测试题答案: 0. Python 是什么类型的语言? Python是脚本语言 脚本语言(Scripting language)是电脑编程语言,因此也能让开发者藉以编写出让电脑听命行事的程序.以简单的方 ...

  3. 通过session模拟登陆

    import requests # 这个练习对比的是上一个登陆练习,这个是不用自己传入cookie参数,而是利用session方法登陆 # 实例化一个session session = request ...

  4. Java中的数据类型和引用

    JAVA数据类型分primitive数据类型和引用数据类型. Java中的primitive数据类型分为四类八种.primitive也不知道怎么翻译比较贴切, 暂且叫他基本数据类型吧, 其实直接从英文 ...

  5. HDU 4605 Magic Ball Game 主席树

    题意: 给一棵\(n(1 \leq n \leq 10^5)\)个节点的二叉树,除叶子节点外,每个点都有左儿子和右儿子. 每个点上都有一个权值. 游戏规则是这样的:在根节点放一个权值为\(X\)的小球 ...

  6. Django Model one

    models :URL---->http://www.cnblogs.com/wupeiqi/p/6216618.html null                     数据库中字段是否可以 ...

  7. 封装BackgroundWorker控件(提供源代码下载,F5即可见效果)

    Demo源码 背景 经常做些小程序或者小DEMO的时候会用到异步,多线程来执行一些比较耗时的工作同时将进度及时进行反馈.我通常会使用位于[ System.ComponentModel]命名空间下的Ba ...

  8. 使用Jquery与vuejs操作dom比较

    jquery实现添加功能 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> ...

  9. 零基础学习 Python 之数字与运算

    写在之前 大家好,这里是零基础学习 Python 系列,在这里我将从最基本的 Python 写起,然后再慢慢涉及到高阶以及具体应用方面.我是完全自学的 Python,所以很是明白自学对于一个人的考验, ...

  10. 【JavaScript】关于 setInterval() 调用函数方法的一次实验

    实验主题: setInterval() 方法是 JS 中比较常用的一个方法.setInterval() 方法可以按照指定的周期 ( 毫秒 ) 来调用函数方法或计算表达式. setInterval() ...