我们都知道在 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. Springboot项目搭建(3)-shiro登录

    shiro简述+实现简单登录:https://www.jianshu.com/p/7f724bec3dc3

  2. Azure IoT Hub 十分钟入门系列 (2)- 使用模拟设备发送设备到云(d2c)的消息

    本文主要分享一个案例: 10分钟- 使用Python 示例代码和SDK向IoT Hub 发送遥测消息 本文主要有如下内容: 了解C2D/D2C消息: 了解IoT Hub中Device的概念 了解并下载 ...

  3. C语言与汇编的嵌入式编程:统计字符串中各字符出现的次数

    原始C语言: #include<stdio.h> void main(){ ]; char pipei[] = "abcdefghijklmnopqrstuvwxyz" ...

  4. 原生js登录创建cookie

    原生js创建cookie,功能:点击登录按钮时,将用户名.密码存为cookie:页面再次加载时,自动读取cookie中的用户名.密码. <html><head><titl ...

  5. 【MYSQL建库和建表】MYSQL建库和建表

    1.Navicat创建Mysql数据库 2.创建创建用户表和索引 CREATE TABLE `t_user` ( `id` ) NOT NULL AUTO_INCREMENT COMMENT '主键' ...

  6. ABC156E

    题目链接 也是简单的组合数学问题,每个位置可以移动走,也可以移动来,那么我们就需要找最终的状态,也就是最终的0的个数 假设有m个0,就有n-m个非0空位,选择0的组合数为\(\textrm{C}_{n ...

  7. Python爬虫老是被封的解决方法【面试必问】

    在爬取的过程中难免发生 ip 被封和 403 错误等等,这都是网站检测出你是爬虫而进行反爬措施,在这里为大家总结一下 Python 爬虫动态 ip 代理防止被封的方法. PS:另外很多人在学习Pyth ...

  8. CSS - 引入方法

    1. 外部样式表 <head> <link rel="stylesheet" type="text/css" href="style ...

  9. RS232与RS485

    1.RS232实物图与引脚图? 2.RS485实物图与引脚图?

  10. 给博客页面添加 live2d 小萝莉

    添加依赖 在页脚HTML代码的地方添加下面的代码: <script src="https://eqcn.ajz.miesnfu.com/wp-content/plugins/wp-3d ...