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 相关文章推荐
jquery中键盘事件小结
Feb 24 Javascript
关于JS中的apply,call,bind的深入解析
Apr 05 Javascript
喜大普奔!jQuery发布 3.0 最终版
Jun 12 Javascript
老生常谈 js中this的指向
Jun 30 Javascript
js模态对话框使用方法详解
Feb 16 Javascript
基于jquery trigger函数无法触发a标签的两种解决方法
Jan 06 jQuery
React组件中的this的具体使用
Feb 28 Javascript
vue中v-for加载本地静态图片方法
Mar 03 Javascript
JavaScript常见事件对象与操作实例总结
Jan 05 Javascript
vue+elementUI实现表单和图片上传及验证功能示例
May 14 Javascript
JS实现鼠标按下拖拽效果
Jul 23 Javascript
SpringBoot+Vue 前后端合并部署的配置方法
Dec 30 Vue.js
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
php GeoIP的使用教程
2011/03/09 PHP
php指定函数参数默认值示例代码
2013/12/04 PHP
nginx+thinkphp下解决不支持pathinfo模式
2015/07/01 PHP
PHP url的pathinfo模式加载不同控制器的简单实现
2016/08/12 PHP
php中数组最简单的使用方法
2020/12/27 PHP
如何用js控制css中的float的代码
2007/08/16 Javascript
$.ajax json数据传递方法
2008/11/19 Javascript
JS 文件传参及处理技巧分析
2010/05/13 Javascript
Express.JS使用详解
2014/07/17 Javascript
js获取及判断键盘按键的方法
2015/12/01 Javascript
js 动态添加元素(div、li、img等)及设置属性的方法
2016/07/19 Javascript
详解js中的apply与call的用法
2016/07/30 Javascript
使用JavaScript实现表格编辑器(实例讲解)
2017/08/02 Javascript
AngularJS表单验证功能
2017/10/19 Javascript
koa上传excel文件并解析的实现方法
2018/08/09 Javascript
vue实现的仿淘宝购物车功能详解
2019/01/27 Javascript
详解JS浏览器事件循环机制
2019/03/27 Javascript
150行代码带你实现微信小程序中的数据侦听
2019/05/17 Javascript
webpack4 SplitChunks实现代码分隔详解
2019/05/23 Javascript
[01:30:54]《加油DOTA》 第三期
2014/08/18 DOTA
python代码制作configure文件示例
2014/07/28 Python
微信 用脚本查看是否被微信好友删除
2016/10/28 Python
Python学习笔记之读取文件、OS模块、异常处理、with as语法示例
2019/06/04 Python
Anaconda+Pycharm环境下的PyTorch配置方法
2020/03/13 Python
Sunglasses Shop德国站:欧洲排名第一的太阳镜网站
2017/08/01 全球购物
在线购买世界上最好的酒:BoozeBud
2018/06/07 全球购物
酒店应聘自荐信
2013/11/09 职场文书
2014端午节活动策划方案
2014/01/27 职场文书
高二学生评语大全
2014/04/25 职场文书
人事任命书格式
2014/06/05 职场文书
班训口号大全
2014/06/18 职场文书
机关领导查摆四风思想汇报
2014/09/13 职场文书
小学红领巾广播稿(3篇)
2014/09/13 职场文书
公务员廉洁从政心得体会
2016/01/19 职场文书
nginx静态资源的服务器配置方法
2022/07/07 Servers
MySQL 原理与优化之原数据锁的应用
2022/08/14 MySQL