我们都知道在 JavaScript 中 for...in 和 for...of 都可以迭代一个数组,但他们之间也有着很大的区别:

区别一:用于迭代器的返回值不同

  for...in 和 for...of 最明显的区别莫过于他们用于迭代器的返回值不同,for...in 迭代的是对象的键,而 for...of 迭代的是对象的值。我们可以通过下面的例子对二者进行区分:

const array = [3,4,5]

for (let i in array) {
console.log(i) //0,1,2
} for (let i of array) {
console.log(i) //3,4,5
}

  

区别二:功能权限不同

  另一个区别在于,for...in 可以操作任何对象,提供了查看对象属性的一种方法。但是 for...of 关注迭代对象的值,内置对象Map和Set已经实现了Symbol.iterator 方法,让我们可以访问它们的值:

const fruits = new Set(['apple','pear','mango'])
fruits['peach'] = 'Princess Peach! Make a wish!' for(let fruit in fruits) {
console.log(fruit) //peach
} for (let fruit of fruits) {
console.log(fruit) //apple pear mango
}

  但是这样的特性仅仅在 ES6 及以上才生效。

区分 for...in 和 for...of的更多相关文章

  1. java中Action层、Service层和Dao层的功能区分

    Action/Service/DAO简介: Action是管理业务(Service)调度和管理跳转的. Service是管理具体的功能的. Action只负责管理,而Service负责实施. DAO只 ...

  2. 区分元素特性attribute和对象属性property

    × 目录 [1]定义 [2]共有 [3]例外[4]特殊[5]自定义[6]混淆[7]总结 前面的话 其实attribute和property两个单词,翻译出来都是属性,但是<javascript高 ...

  3. 关于CLR、CIL、CTS、CLS、CLI、BCL和FCL 的区分与总结

    关于CLR.CIL.CTS.CLS.CLI.BCL和FCL 的区分与总结 如果要想深入学习.NET平台,那么标题中的这些关键字对你来说并不陌生,这些名词构成了.NET庞大的生态系统,为了宏观认识.NE ...

  4. web开发中不同设备浏览器的区分

    通常区分不同设备浏览器是用JavaScript中的navigator.userAgent.toLowerCase()方式获取浏览器的userAgent信息 //使用javascript判断是否是iPh ...

  5. JavaScript区分click事件和mousedown(mouseup、mousemove)方法

    在前端开发工作中,会遇到这样问题:针对同一个dom元素,即希望为它绑定click事件,又想该元素可以允许拖拽的效果.而使用拖拽的效果,我们一般就会用到mousedown,mousemove和mouse ...

  6. 如何区分/dev/input/event

    方法是把每一个/dev/input/event打开.通过ioctl函数来读取设备name,每一个设备name是固定的,可以根据name区分event.我这是查找触摸事件为例:代码如下: static ...

  7. web也是区分前端与后端的,session\cookie辨析

    <1>Ajax交互方式 Ext.Ajax.request( { //被用来向服务器发起请求默认的url url : "", //请求时发送后台的参数,既可以是Json对 ...

  8. 《征服 C 指针》摘录1:什么是空指针?区分 NULL、0 和 '\0'

    一.什么是空指针? 空指针 是一个特殊的指针值. 空指针 是指可以确保没有向任何一个对象的指针.通常使用宏定义 NULL 来表示空指针常量值. 空指针 确保它和任何非空指针进行比较都不会相等,因此经常 ...

  9. OSS层基础:平台区分

    #define PLATFORM_WINDOWS 1 #define PLATFORM_MAC 2 #define PLATFORM_UNIX 3 #if defined(_WIN32) #defin ...

  10. Windows内核开发中如何区分文件对象究竟是文件还是文件夹?

    今天有同行问了一个问题,Windows文件过滤驱动里的如何去区分一个对象是文件还是文件夹?我花了1小时左右翻阅了一些微软的文档以及以前的遗留代码,发现在WDK的帮助文档中是这么定义的: FILE_OB ...

随机推荐

  1. 染色板QPlette

    QPalette::Window 背景颜色 QPalette::WindowText 文本颜色 QPalette::Background 同QPalette::Window QPalette::For ...

  2. 在Docker中使用Microsoft SQL Server数据库

    下图中对SQL Server容器创建及数据库创建等操作进行了记录,方便自己日后查看.(文中的 * 仅表示隐藏自己的个人信息,手动马赛克,哈哈-) Docker下载可看上一篇博文mac系统,docker ...

  3. mybatis重新回顾

    此次在项目中相遇了mybatis,重新回顾下. 1.resulMap解决了结果集的列名字跟实体setter和getter不匹配的问题 其中property是实体的setter和getter对象,col ...

  4. 【算法】dsu on tree初探

    dsu on tree的本质是树上的启发式合并,它利用启发式合并的思想,可以将O(N^2)的暴力优化成O(NlogN),用于不带修改的子树信息查询. 具体如何实现呢?对于一个节点,继承它重儿子的信息, ...

  5. linux内存查看、清理、释放命令

    echo 1 > /proc/sys/vm/drop_caches 清理前 # free -h total used free shared buffers cached Mem: 19G 19 ...

  6. java 多线程并发问题

    问题:50个线程,先查询数据库的一个记录 t,然后对这个记录+1,最后更新到数据库 (更新的时候,不允许使用 update  test_concurrent set sum =sum -1 where ...

  7. 微信小程序中promise的使用

    简介 相信看到这篇文章的同学,都已经对微信小程序的api文档有所了解了,也都经历了微信小程序api回调函数嵌套的痛苦,才会想要通过Promise解决回调地狱这个问题,我下面就直接介绍怎么在小程序中使用 ...

  8. Laravel Vuejs 实战:开发知乎 (9)定义话题与问题关系

    1.话题[Topic] 执行命令: php artisan make:model Topic –cmr 修改****_**_**_create_topics_table.php数据库迁移文件如下: c ...

  9. C# 动态类型 以及 脚本调用(scriptRunTime)

    在使用中让我感觉 好像 JavaScript中的 动态类型囧 先看动态类型 class Program { static void Main(string[] args) { var streamRe ...

  10. buuctf——facebook1

    分为注册和登陆两个页面 据大佬wp登陆页面又盲注,但我没测试 直接注册后登陆 注册后发现,会显示输入的url 根据目录扫描,发现robots.txt和flag.php robots.txt有源码备份 ...