js 数组实现一个类似ruby的迭代器


Posted in Javascript onOctober 27, 2009

<?XML:NAMESPACE PREFIX = O />

分为如下几节:

·基本实现

·在迭代中引用原来的对象,或者直接改变数组的值而不是返回一个新数组

·向迭代传入无限多的参数

·基本实现
今天突然发现js的数组处理起来真是麻烦,代码一些就是一大堆,相比起ruby的迭代器来真是逊色不少,主要是要写的代码太多了,也许是js有特殊的处理数组的方式,真是我不知道而已,但是我真的想自己给js实现一个类似ruby的迭代器的东东,而且实现起来也不难,那就开始动手吧.

真的应该庆幸js是动态语言啊,如果是静态语言,实现起来很不方便(别说要我重新定义一个继承自array的类),不过用js实现起来就简单多了,直接给Array对象加一个方法即可,如下:

js 数组实现一个类似ruby的迭代器

额呵呵,迭代器其实已经实现了......好简单啊,是啊,不过这样的确方便了不少哦,看下面的用法就知道了:

首先我们定义一个数组:

js 数组实现一个类似ruby的迭代器

1:用法一:

迭代使用每个数组元素:

js 数组实现一个类似ruby的迭代器

声明:这里可以缩写成:aa.each(function(val){alert(val)});,以下的也同理,为了清晰,分开写的 

执行结果是依次弹出每个数组元素的值,哦呵,就是这么简单,不用写可恶的for,如果代码很多的时候,这点节省也会省出不少的代码量哦

2:用法二:

迭代处理每个数组元素并返回一个处理后哦数组:

js 数组实现一个类似ruby的迭代器

结果如何?如你所想,首先弹出的是"1,2,3,4",之后弹出的是"2,4,6,8",每个元素都被处理了,并且作为新数组返回,额呵呵,很简单的功能,如果你觉得没什么用的话,那好吧,还是去写for循环吧,如果你喜欢这种写法,那好吧,还有很多可以改进的地方,也留给大家去探索,反正这样目前对我来说已经足够用来节省很多代码了.

3:更多:

还可以给数组增加更多有用的方法,例如:随机打乱顺序(棋牌游戏?)等,不过真希望js可以在方法名中包含更多的标点符号,那样就可以定义 each?或者each!这种警示性方法了,可惜可惜

·在迭代中引用原来的对象,或者直接改变数组的值而不是返回一个新数组

我这里有一个可以说是改进版的迭代器,因为我突然要在func函数里引用原来的迭代对象,于是做了如下修改

js 数组实现一个类似ruby的迭代器

变化并不大,也兼容前面所讲的所有功能,而且增加了对数组对象的引用

js 数组实现一个类似ruby的迭代器

我们可以在func函数里引用原来的数组对象,和当前元素的索引位置,这样可以增加很多功能哦,首先可以直接修改原来数组的值,!!!不过如果你在func函数里删除了某个数组元素,可能会出现不可预料的错误哦!!!,下面来做个试验,看看会出现什么结果:

js 数组实现一个类似ruby的迭代器

哦,我们在func函数里删除了值为2的元素,结果呢,依次弹出1,3,4,undefined,也就是迭代函数无法知道你的数组长度改变了,多循环了一次,如何解决这个问题呢?

js 数组实现一个类似ruby的迭代器

初步想法是,判断一下元素是否为空,如果为空,就不做任何操作,&&操作符的前面如果为假,就不会执行后面的语句.今天发现这种方法有所欠考虑,因为我漏处理了一个元素,仔细想想就知道了,所以需要在处理函数里加一个offset变量,指引当前的偏移量,每次删除元素就将offset变量减一,索引以index+offset为准,这样可以解决删除元素的问题,但是不能解决增加元素的问题,所以这个迭代器里不能动态增加数组元素,否则会出现错误,注意注意

先到此为止吧.

·向迭代传入无限多的参数

又回来了,这次我们要让这个迭代可以传递更多的有用的自定义参数,而不是系统自定的,当然,前面的所有操作都是被兼容的,所有的修改都不会破坏前面的操作的兼容性.

我们将主方法修改如下:

js 数组实现一个类似ruby的迭代器

OK,加了个参数,只是一个参数,没有什么大惊小怪,但是它已经可以完成所有的参数传递了,看例子:

js 数组实现一个类似ruby的迭代器

还是刚才的例子,我们要删除数组中的一个元素,我们通过传递进来的参数来确定删除哪个值,我们用一个对象作为参数传进来,这个对象是个json对象,欧耶,json可以承载任意多的参数,想传多少就传多少,不是很简单么,好像我们已经实现了很多功能了.但是还没有完,更多的需要自己去探索.

只用拓展ie的forEach就行了,ff下已经支持了,而且你这种写法貌似效率很低

Javascript 相关文章推荐
javascript之AJAX框架使用说明
Apr 24 Javascript
基于jquery的无缝循环新闻列表插件
Mar 07 Javascript
使用JavaScript实现Java的List功能(实例讲解)
Nov 07 Javascript
js实现div闪烁原理及实现代码
Jun 24 Javascript
9款2014最热门jQuery实用特效推荐
Dec 07 Javascript
动态加载css方法实现和深入解析
Jan 18 Javascript
JS字符串统计操作示例【遍历,截取,输出,计算】
Mar 27 Javascript
JS实现的简单折叠展开动画效果示例
Apr 28 Javascript
js控制随机数生成概率代码实例
Mar 21 Javascript
JavaScript实现多张图片放大镜效果示例【不限定图片尺寸,rem单位】
May 14 Javascript
微信小程序动态设置图片大小的方法
Nov 21 Javascript
vue+iview实现手机号分段输入框
Mar 25 Vue.js
jquery 操作单选框,复选框,下拉列表实现代码
Oct 27 #Javascript
javascript获得CheckBoxList选中的数量
Oct 27 #Javascript
基于jQuery的日期选择控件
html 锁定页面(js遮罩层弹出div效果)
Oct 27 #Javascript
javascript 读取XML数据,在页面中展现、编辑、保存的实现
Oct 27 #Javascript
Ajax+Json 级联菜单实现代码
Oct 27 #Javascript
javascript 关于# 和 void的区别分析
Oct 26 #Javascript
You might like
解析PHP中数组元素升序、降序以及重新排序的函数
2013/06/20 PHP
浅析51个PHP处理字符串的函数
2013/08/02 PHP
php json转换成数组形式代码分享
2014/11/10 PHP
php中mysql操作buffer用法详解
2015/03/19 PHP
php+ajax实现无刷新数据分页的办法
2015/11/02 PHP
PHP面向对象学习之parent::关键字
2017/01/18 PHP
JS中批量给元素绑定事件过程中的相关问题使用闭包解决
2013/04/15 Javascript
jquery可见性过滤选择器使用示例
2013/06/24 Javascript
jQuery中bind,live,delegate与one方法的用法及区别解析
2013/12/30 Javascript
用于deeplink的js方法(判断手机是否安装app)
2014/04/02 Javascript
JavaScript常用数组算法小结
2016/02/13 Javascript
详解Vue.js——60分钟组件快速入门(上篇)
2016/12/05 Javascript
详解Vue自定义过滤器的实现
2017/01/10 Javascript
VUE元素的隐藏和显示(v-show指令)
2017/06/23 Javascript
vue element-ui 绑定@keyup事件无效的解决方法
2018/03/09 Javascript
解决vue路由后界面没有变化,但是链接有的问题
2018/09/01 Javascript
React生命周期原理与用法踩坑笔记
2020/04/28 Javascript
[01:42]辉夜杯战队访谈宣传片—FANTUAN
2015/12/25 DOTA
python显示天气预报
2014/03/02 Python
python中的多线程实例教程
2014/08/27 Python
Python实现的字典值比较功能示例
2018/01/08 Python
django富文本编辑器的实现示例
2019/04/10 Python
Pandas的read_csv函数参数分析详解
2019/07/02 Python
Python的matplotlib绘图如何修改背景颜色的实现
2019/07/16 Python
pytorch 固定部分参数训练的方法
2019/08/17 Python
python中有关时间日期格式转换问题
2019/12/25 Python
PyInstaller将Python文件打包为exe后如何反编译(破解源码)以及防止反编译
2020/04/15 Python
python获取命令行参数实例方法讲解
2020/11/02 Python
Selenium Webdriver元素定位的八种常用方式(小结)
2021/01/13 Python
Converse匡威法国官网:美国著名帆布鞋品牌
2018/12/05 全球购物
Java如何格式化日期
2012/08/07 面试题
2014年技术部工作总结
2014/12/12 职场文书
安全生产先进个人事迹材料
2014/12/30 职场文书
小学三八妇女节活动总结
2015/02/06 职场文书
2016年“5.12”国际护士节活动总结
2016/04/06 职场文书
python实现简单的聊天小程序
2021/07/07 Python