Array.prototype 的泛型应用分析


Posted in Javascript onApril 30, 2010

题目
请说明下面语句的输出:

x = {shift:[].shift}; 
x.shift(); 
console.info(x.length);

如果你回答正确,那么说明你已经了解 Array 函数的泛型应用。在理解这到题目之前,我 我们首先要了解数组(Array)的 shift 定义。

MDC 中已经对相关的说明描述得非常的清楚

shift is intentionally generic; this method can be called or 
applied to objects resembling arrays. Objects which do not 
contain a length property reflecting the last in a series of 
consecutive, zero-based numerical properties may not behave 
in any meaningful manner.

同时,EMCAScript 中的定义也同时定义了对于 shift 操作对于对象 length 属性的改变, 那么基本上我们可以了解到上题中的答案为
0

扩散思维
如果对于上面的题目还无法理解,那么我们更清楚的说明 Array.prototype.shift 对对象 的 length 的影响。
x = {}; 
Array.prototype.shift.call(x); 
console.info(x.length);

很明显,对于对象如果为定义 length 属性,则 shift 则会自动加上 length 属性并设置 为 0 。

既然已经说到这里,那么下面的题目输出什么留给大家去思考。

x = function (a, b, c) {}; 
Array.prototype.shift.call(x); 
console.info(x.length);

重新认识泛型
很明显,上面的题目有可能还是无法说明本篇文章的题目。泛型(Generic)应用其实 期前也说明过,但这里主要说明 Array 方法对于“类数组”的操作使用。

强制转换为数组

var args = Array.prototype.slice.call(arguments);

这个用法比较火星,其实期前也用过,详细参见这里。

迭代数据

Array.prototype.forEach.call(arguments, function(i) { 
console.info(i); 
});

如果对象能够被递归,则出了“传统”的 for、while 等语句以外,还可以考虑使用 Array 的 forEach 属性(注意 IE 会是悲剧)。Array 的 forEach 方法详见这里。

其他的 Array 扩展用法可以散发自己的思维,如果对应浏览器的 Array 没有对应的实现方 法,可以参见这里。

其实,不仅仅是 Array 方法,很多浏览器原生对象的方法都是泛型,我们完全可以利用这 这些特性使代码更为的清晰
使用原生方法,效率更高。

Javascript 相关文章推荐
Javascript实例教程(19) 使用HoTMetal(5)
Dec 23 Javascript
使用jQuery简化Ajax开发 Ajax开发入门
Oct 14 Javascript
jQuery $.get 的妙用 访问本地文本文件
Jul 12 Javascript
ztree获取选中节点时不能进入可视区域出现BUG如何解决
Dec 03 Javascript
AngularJs实现分页功能不带省略号的代码
May 30 Javascript
javascript解析ajax返回的xml和json格式数据实例详解
Jan 05 Javascript
JS 组件系列之 bootstrap treegrid 组件封装过程
Apr 28 Javascript
详解vue中computed 和 watch的异同
Jun 30 Javascript
vue 实现 tomato timer(蕃茄钟)实例讲解
Jul 24 Javascript
动态加载、移除js/css文件的示例代码
Mar 20 Javascript
vue之延时刷新实例
Nov 14 Javascript
Vue实现计算器计算效果
Aug 17 Javascript
jQuery 锚点跳转滚动条平滑滚动一句话代码
Apr 30 #Javascript
JavaScipt中的Math.ceil() 、Math.floor() 、Math.round() 三个函数的理解
Apr 29 #Javascript
匹配任意字符的正则表达式写法
Apr 29 #Javascript
jquery ajax提交表单数据的两种实现方法
Apr 29 #Javascript
jQuery 动画弹出窗体支持多种展现方式
Apr 29 #Javascript
jQuery 工具函数学习资料
Apr 29 #Javascript
IE JS无提示关闭窗口不提示的方法
Apr 29 #Javascript
You might like
分享下php5类中三种数据类型的区别
2015/01/26 PHP
浅谈Coreseek、Sphinx-for-chinaese、Sphinx+Scws的区别
2016/12/15 PHP
PHP类与对象后期静态绑定操作实例详解
2018/12/20 PHP
TP5框架页面跳转样式操作示例
2020/04/05 PHP
Apache+PHP+MySQL搭建PHP开发环境图文教程
2020/08/06 PHP
JS控件autocomplete 0.11演示及下载 1月5日已更新
2007/01/09 Javascript
js停止输出代码
2008/07/20 Javascript
腾讯UED 漂亮的提示信息效果代码
2011/09/12 Javascript
JavaScript高级程序设计 阅读笔记(十七) js事件
2012/08/14 Javascript
Get中文乱码IE浏览器Get中文乱码解决方案
2013/12/26 Javascript
jQuery删除节点的三个方法即remove()detach()和empty()
2013/12/27 Javascript
node.js开发中使用Node Supervisor实现监测文件修改并自动重启应用
2014/11/04 Javascript
通过JS判断联网类型和连接状态的实现代码
2015/04/01 Javascript
js实现字符串转日期格式的方法
2015/05/20 Javascript
基于javascript实现根据身份证号码识别性别和年龄
2016/01/22 Javascript
Angular Renderer (渲染器)的具体使用
2018/05/03 Javascript
jQuery实现的自定义轮播图功能详解
2018/12/28 jQuery
VUE注册全局组件和局部组件过程解析
2019/10/10 Javascript
vuex中遇到的坑,vuex数据改变,组件中页面不渲染操作
2020/11/16 Javascript
Python中的并发编程实例
2014/07/07 Python
python Celery定时任务的示例
2018/03/13 Python
Python下使用Scrapy爬取网页内容的实例
2018/05/21 Python
python实现日志按天分割
2019/07/22 Python
Django实现跨域的2种方法
2019/07/31 Python
大学生简历中个人的自我评价
2013/10/06 职场文书
营业员实习自我鉴定
2013/12/07 职场文书
农林环境专业求职信
2014/03/13 职场文书
2014年教师业务学习材料
2014/05/12 职场文书
2015年国庆节慰问信
2015/03/23 职场文书
钓鱼岛事件感想
2015/08/11 职场文书
上班旷工检讨书
2015/08/15 职场文书
志愿者服务宣传标语口号
2015/12/26 职场文书
导游词之无锡梅园
2019/11/28 职场文书
JavaScript中关于预编译、作用域链和闭包的理解
2021/03/31 Javascript
浅谈Redis中的RDB快照
2021/06/29 Redis
使用springMVC所需要的pom配置
2021/09/15 Java/Android