for in,forEach,for of

news/2024/7/19 12:55:24 标签: js

for in

什么都可以遍历(noodlist会显示原型上的属性)

for in多用于遍历对象,他会返回对象的属性名而for in不推荐遍历数组

为什么for in不推荐遍历数组
1.for in返回的是每个item的索引如果想对数组的每一项进行操作的话就会很复杂
2.for in返回的索引是字符串类型而不是number类型,如果我们像用这个索引加减来操作数组的话就会产生差错

for in的细节

1.遍历的属性名包括自身原型上的属性
在这里插入图片描述
2.遍历不一定按数组的下标顺序遍历

forEach

1.for…of 可以迭代数组伪数组以及任何可以迭代的对象(maps、sets、DOM集合)也就是:拥有迭代器对象(iterator)的集合

常见的伪数组:arguments,getElementsByTagName和document.querySelectorAll以及getElementsByClassName等获取的NodeList对象和jQuery

对象,比如 $(“div”)
1.forEach是不能使用任何手段跳出循环的
2.关于他的参数
第一个参数是item

在这里插入图片描述
第二个参数是索引
在这里插入图片描述

第三个参数是当前遍历的数组
在这里插入图片描述
第四个参数是this指向,但是注意要写成function形式要是箭头函数默认直线外层函数(这里要是写成箭头函数第四个参数要是写成arrs了this也是指向window)
在这里插入图片描述
forEach要注意的点
第二个参数index不会随着函数体内部对它的增减而发生变化
在这里插入图片描述

for of

1.for…of 可以迭代数组伪数组以及任何可以迭代的对象(maps、sets、DOM集合)也就是:拥有迭代器对象(iterator)的集合

常见的伪数组:arguments,getElementsByTagName和document.querySelectorAll以及getElementsByClassName等获取的NodeList对象和jQuery
对象,比如 $(“div”)

NodeList:包括document.querySelectorAll,getElementsByTagName返回的节点

2.for of遍历的只是数组内的元素不包括原型属性和索引
3.可以适用break终端循环

map

只能遍历数组
1.map不改变原数组但是会 返回新数组
好像就这一点。。


http://www.niftyadmin.cn/n/1371497.html

相关文章

迭代器,生成器

迭代器 for of不支持遍历普通对象,这里的普通对象指的是没有Symbol.iterator属性的对象。 当使用for of去遍历某一个数据结构的时候,首先去找Symbol.iterator,找到了就去遍历,没有找到的话不能遍历 对象的Symbol.iterator属性&am…

http知识点2

HTTP有哪些方法? HTTP1.0定义了三种请求方法: GET, POST 和 HEAD方法 HTTP1.1新增了五种请求方法:OPTIONS, PUT, DELETE, TRACE 和 CONNECT GET和POST有什么区别? 数据传输方式不同:GET请求通过URL传输数据&#xff0…

关于兼容问题

IE条件注释法 css 属性前缀法 选择器前缀法 图片来自:https://www.cnblogs.com/applejp/p/4180682.html

内存泄漏js

内存泄漏 就是不用的变量js无法进行垃圾回收 造成内存泄漏的原因 1.意外的全局变量(全局变量指挂载在window上面的变量) 全局变量的生命周期最长,直到页面关闭前,它都存活着,所以全局变量上的内存一直都不会被回收…

axios-retry可以让一个失败的网络请求再次自动发送n(自定义)次数

axios-retry可以让一个失败的网络请求再次自动发送n(自定义)次数 安装 npm install axios-retry引入 import axiosRetry from axios-retry;使用 axiosRetry(axios, { retries: 3 });图片来自:https://juejin.cn/post/7053471988752318472

nginx反向代理,vue2反向代理,vue3反向代理

正向代理和反向代理 反向代理(Reverse Proxy)对应的是正向代理(Forward Proxy),他们的区别: 正向代理: 一般的访问流程是客户端直接向目标服务器发送请求并获取内容,使用正向代理后…

关于canvas和canvas案例

Canvas常见API 1.this.canvas.getContext(‘2d’) 初始化画布 // 获取canvas元素 this.canvas document.getElementById(tutorial) // 获取绘制二维上下文 this.ctx this.canvas.getContext(2d) 2.this.ctx.moveTo ,this.ctx.lineTo(150, 50) moveTo 移动画笔到…

BFC理解

图片来自:https://zhuanlan.zhihu.com/p/45515245 图片来自:https://zhidao.baidu.com/question/2059953894551502627.html 图片来自:https://juejin.cn/post/6914831351271292936?utm_sourcegold_browser_extension#heading-12