- 当前位置：首页 >系统运维 >从 forEach 开始谈谈遍历技巧
从 forEach 开始谈谈遍历技巧
发布时间：2025-11-05 09:24:32 来源：云智核 作者：系统运维
forEach
今天从 forEach 开始谈谈遍历吧。开始
forEach 作为一个比较出众的谈谈遍历操作，之前有很多库都对其进行过各种包装，遍历然而我还是技巧发现很多人并不是非常理解 forEach。
比如第二个参数 this 的开始使用。
往常都习惯这么做：
const self = this arr.forEach(function(item) { // do something with this })然而如果使用第二个参数就可以这样：
arr.forEach(function(item) { // do something with this },谈谈 this)省去了一个中间的self，看起来更优美了
那么有没有更好的遍历处理方式呢?
有的：
arr.forEach(item => { // do something })由于 arrow function 的特性，自动绑定父 scope 的技巧 this， 会更加简洁，开始而且少了个function关键字，谈谈可读性更好。遍历
for
说到循环必定要说到for循环了。技巧js里面的开始for循环有好几种使用方式：
C 系列 for 循环：
for (let index = 0; index < arr.length; index++) { // do something }index 是 arr 的索引，在循环体中通过 arr[index] 调用当前的谈谈元素，我非常不喜欢这种方式，遍历因为要写两个分号!
还有另一种比较简单的方式：
for (let key in obj) { // do something }不过这个方式一般用来遍历对象，下文有说。
关于 for 循环还有 ES2015 规定的一种
for (let item of arr) { // do something }这种遍历方式和之前的***区别在于item，b2b信息网它是value而非key，可以直接迭代出内容。
不过这种方式我个人用的不多，因为很多情况下我更喜欢用array下的方法。对于对象的遍历更倾向于for...in
map 系列
这一块是js的函数式领域了。
Array.prototype下挂载着几个非常好用的遍历函数。比如map
它会遍历arr下的所有内容，做操作之后返回数据，形成一个新的数组：
const arr = [1, 2, 3] arr.map(current => current * 5)在 react 最常用。经常用来遍历数据，形成dom：
someRender() { return this.state.data.map((current, index) => { return <li key={index}>{ current }</li> }) }不过 map 有一点不好的地方在于不能控制循环的流程，如果不能完成，就返回undefined继续下一次迭代。所以遇到可能会返回undefined的情况应该用forEach或者for循环遍历
还有filter用法和map一模一样，只是它用来过滤数据。非常的好用。
arguments
说到遍历不得不提及arguments, 在function()中的所有参数，奇怪的服务器租用是它并不是一个数组。只是一个类数组。
一般需要转成数组：
function foo() { const args = Array.prototype.slice.call(arguments) return Array.isArray(args) }但是我个人并不认同这样的方法，有了新的 ES2015 就不要用这么丑的语法了
function foo(...args) { // args 是数组 }ES2015 的 rest 语法使得剩余参数都传入args里面，比之前的还要调Array的方法要轻松不少。
object
对象的遍历是非常常用的功能。
我个人更喜欢用for...in语法，但是有一点需要注意：
for (let index in obj) { if(obj.hasOwnProperty(index)) { // do something } }因为除非强制指定，否则对象都是不纯净的。都会有__proto__属性，也会被迭代出来。需要过滤一下。
好了，如何创建纯净的对象?
const plainObj = Object.create(null)最轻的obj结构，云服务器内部没有任何多余的属性。
- 上一篇：丁酉大炮的威力与历史影响（揭秘丁酉大炮的制造工艺与战争应用）
- 下一篇：Opera 9.5 正式版已经发布： Opera 9.5 已经解决了中文输入问题和字体选取混乱的问题。我们有新的字体替换机制用于 Opera 9.5 Beta 2 之后的版本 1. Flash Player 9 的插件取消了原来对非 gtk 程序调用的借口，导致非 GTK 浏览器无法调用 Flash 插件。受到影响的浏览器有 Opera 9.2x 和 Konqueror 。 2. 解决方法：使用 Opera 9.5 。 我们注意到这个问题对用户体验产生了重大影响，已经在 Opera 9.5 解决。我们专门写了一个调用该类插件的 wrapper 程序，即使在 64 位 Opera 上，调用 Flash 插件也没有问题。 Flash Player 10 下载地址： http://download.macromedia.com/....../flashplayer10_install_linux_051508.tar.gz 下载后将 libflash*.so 复制到/usr/lib/browser-plugins 目录下，重启 Opera 9.5 即可自动调用。
- 先安装cupsys，再安装打印机管理程式，及打印机驱动程式 sudo apt-get install cupsys gnome-cups-manager cupsys-driver-gimpprint 运行打印机管理程式，添加新的打印机 gnome-cups-manager #也可直接运行gnome-cups-add 来增加新的打印机 先择新增，再选网络打印机（Network Printer)，再选TCP/Socket,HP JetDirect,Raw connection项 Host处输入打印机IP：172.24.75.202,Port默认：9100,之后下一步 选择打印机厂商，这里选HP，在列表框中再选择打印机型号：LaserJet P1505 驱动选择：expert，再下一步就安装好了，可以打印测试页 另：http://localhost:631可进入WEB方式管理打印机，默认不能管理，可以设置/etc/cups/cups.conf 呵呵，想不到安装打印机就这么简单。
- 黑将s5重装win10教程（轻松学会黑将s5重装win10，让你的电脑焕然一新！）
- 戴尔E6430散热性能如何？（详解戴尔E6430散热性能及优化方法）
- 硬盘磁头卡住了该怎么办？（解决硬盘磁头卡住的方法和注意事项）
- 探索3DS裸眼3D的奇妙世界（体验无需眼镜的3D视觉盛宴）
- 全面解析ThinkPad超级本（ThinkPad超级本的是可靠、高效与便携）
- 技嘉Z77D3H超频教程（全面解析技嘉Z77D3H主板超频方法及技巧）
- 华硕FL5900U笔记本电脑的特点与优势（探索华硕FL5900U的卓越性能与出色设计）
- 电脑系统错误的修复与解决方法（探究电脑系统错误的成因，解析有效的修复方案）
- 探索Loock鹿客（了解Loock鹿客的创新科技和用户体验）
- 探索SRSZR7的卓越音质和出色性能（一款耳机产品带来的绝佳音频体验）
- 评测（一款高品质音频体验的选择）
- 360手机NS4（颠覆你对手机的认知，全新体验尽在360手机NS4）
- 红米Note2（红米Note2工艺设计精致，用户体验全方位升级）
- 创维变频洗衣机的性能源效率（提高生活品质的节能洗涤利器）
- Windows10系统安装教程（以简洁可行的方法为您详解Windows10系统安装教程）
- Windows操作系统双系统安装教程（轻松实现Windows双系统安装，享受多元化操作体验）
- 美的KFR35GW空调的优点和使用体验（高效制冷，舒适无忧；智能控制，方便省心）
- 华为荣耀7CPU表现如何？（详细分析华为荣耀7搭载的CPU性能及优势）
- 大白菜pe电脑修复系统教程（从零开始，轻松修复你的电脑问题）
随便看看
- Copyright © 2025 Powered by 从 forEach 开始谈谈遍历技巧,云智核 滇ICP备2023006006号-28sitemap