for in 和 for of的区别

简介: for in 和 for of的区别

1、for in


  • 1.一般用于遍历对象的可枚举属性。以及对象从构造函数原型中继承的属性。对于每个不同的属性,语句都会被执行。
  • 2.不建议使用 for in 遍历数组,因为输出的顺序是不固定的。
  • 3.如果迭代的对象的变量值是 null 或者 undefined, for in 不执行循环体,建议在使用 for in 循环之前,先检查该对象的值是不是 null 或者 undefined。


2、for of


  • 1.for…of 语句在可迭代对象(包括 Array,Map,Set,String,TypedArray,arguments 对象等等)上创建一个迭代循环,调用自定义迭代钩子,并为每个不同属性的值执行语句。


代码演示:


var s = {
    a: 1,
    b: 2,
    c: 3
};
var s1 = Object.create(s);
for (var prop in s1) {
    console.log(prop); //a b c
    console.log(s1[prop]); //1 2 3
}
for (let prop of s1) {
    console.log(prop); //报错如下 Uncaught TypeError: s1 is not iterable
}
for (let prop of Object.keys(s1)) {
    console.log(prop); // a b c
    console.log(s1[prop]); //1 2 3
}


相关文章
|
小程序 JavaScript
小程序用 rich-text长按复制事件
小程序用 rich-text长按复制事件
916 0
|
前端开发 JavaScript 安全
【面试题】路由的两种模式:hash模式和 history模式
【面试题】路由的两种模式:hash模式和 history模式
516 1
|
前端开发 容器
前端页面布局之【Grid布局】详解
前端页面布局之【Grid布局】详解
1322 0
|
移动开发 小程序
微信小程序web-view嵌入uni-app H5页面,通过H5页面跳转企业微信客户聊天窗口如何操作?
微信小程序web-view嵌入uni-app H5页面,通过H5页面跳转企业微信客户聊天窗口如何操作?
|
JavaScript
Vue2中子组件调用父组件的方法,父组件调用子组件的方法,父子组件互相传值和方法调用
Vue2中子组件调用父组件的方法,父组件调用子组件的方法,父子组件互相传值和方法调用
Vue2中子组件调用父组件的方法,父组件调用子组件的方法,父子组件互相传值和方法调用
|
前端开发 JavaScript UED
第五章(原理篇) 微前端技术之模块联邦与动态加载
第五章(原理篇) 微前端技术之模块联邦与动态加载
962 0
|
数据采集 消息中间件 JavaScript
浏览器渲染揭秘:从加载到显示的全过程;浏览器工作原理与详细流程
了解浏览器工作原理与流程,能有效帮助前端开发与性能优化。 博客不应该只有代码和解决方案,重点应该在于给出解决方案的同时分享思维模式,只有思维才能可持续地解决问题,只有思维才是真正值得学习和分享的核心要素。如果这篇博客能给您带来一点帮助,麻烦您点个赞支持一下,还可以收藏起来以备不时之需,有疑问和错误欢迎在评论区指出~
|
存储 缓存 网络协议
|
JavaScript 前端开发 搜索推荐
Vue 路由的hash模式和history模式有什么区别?
在Vue.js框架中,路由管理是单页面应用(SPA)不可或缺的功能。Vue 路由提供了两种模式:hash模式和history模式,这两种模式主要负责处理URL的变更而无需重新加载整个页面,实现前端路由的功能。
1018 19
|
Python
Python软件包管理工具pip实战篇
详细介绍了Python软件包管理工具pip的使用方法,包括安装、搜索、卸载软件包,修改软件源,导出和安装依赖列表,以及查看pip版本和配置信息等操作,并提供了相关命令示例。
647 0
Python软件包管理工具pip实战篇

热门文章

最新文章