Array.prototype.concat不是通用方法反驳[译]


Posted in Javascript onSeptember 20, 2012

ECMAScript 5.1规范§15.4.4.4 中说到:

concat函数是有意设计成通用的;它并不要求它的this值必须得是个Array对象.因此,它可以被转移到其它类型的对象上作为方法来调用.

本文中的代码都使用了[]来作为Array.prototype的快捷方式.这已经是很常用的技巧了,虽然可读性差点:你通过一个对象实例访问到了Array.prototype上的方法.但是,这样的访问方式在现代的JavaScript引擎中非常之快,以至于我怀疑,说不定在这种调用方式下,这些JavaScript引擎可能已经不再创建数组实例了.本文中所有的例子都在Firefox和V8中尝试运行过.

让我们看一下concat到底是不是个通用方法:如果它是一个通用方法,则不管this的值是一个真实数组还是个类数组对象(拥有length属性,能通过索引访问每个元素),方法的返回结果都应该是一样的.我们首先尝试在数组上调用concat方法:

> ["hello"].concat(["world"]) 
["hello", "world"] > [].concat.call(["hello"], ["world"]) // 和上面的一样 
["hello", "world"]

然后,我们使用一个类数组对象来进行上面的连接操作.结果应该是一样的.

> [].concat.call({ 0: "hello", length: 1 }, ["world"]) 
[ { '0': 'hello', length: 1 }, 'world' ]

特殊变量arguments也是一个类数组对象.结果仍然不是我们所期望的:
> function f() { return [].concat.call(arguments, ["world"]) } 
> f("hello") 
[ { '0': 'hello' }, 'world' ]

真正的通用方法应该是这样的Array.prototype.push:

> var arrayLike = { 0: "hello", length: 1 }; 
> [].push.call(arrayLike, "world") 
2 
> arrayLike 
{ '0': 'hello', '1': 'world', length: 2 }

译者注:浏览器只是按照标准来实现,所以并不存在bug的问题.

Javascript 相关文章推荐
pjblog中的UBBCode.js
Apr 25 Javascript
用jscript实现新建word文档
Jun 15 Javascript
javascript 获取页面的高度及滚动条的位置的代码
May 06 Javascript
javascript常用功能汇总
Jul 05 Javascript
详解Angularjs中的依赖注入
Mar 11 Javascript
半个小时学json(json传递示例)
Dec 25 Javascript
JS实现touch 点击滑动轮播实例代码
Jan 19 Javascript
js实现简单的二级联动效果
Mar 09 Javascript
Ajax高级笔记 JavaScript高级程序设计笔记
Jun 22 Javascript
javaScript中封装的各种写法示例(推荐)
Jul 03 Javascript
vue 动态绑定背景图片的方法
Aug 10 Javascript
JavaScript前端面试组合函数
Jun 21 Javascript
JavaScript 用Node.js写Shell脚本[译]
Sep 20 #Javascript
一个简单的网站访问JS计数器 刷新1次加1次访问
Sep 20 #Javascript
javascript分页代码(当前页码居中)
Sep 20 #Javascript
javascript获取作用在元素上面的样式属性代码
Sep 20 #Javascript
一个基于jquery的文本框记数器
Sep 19 #Javascript
html中的input标签的checked属性jquery判断代码
Sep 19 #Javascript
基于jquery打造的百分比动态色彩条插件
Sep 19 #Javascript
You might like
在PHP中养成7个面向对象的好习惯
2010/07/17 PHP
使用GD库生成带阴影文字的图片
2015/03/27 PHP
Laravel框架路由和控制器的绑定操作方法
2018/06/12 PHP
取得父标签
2006/11/14 Javascript
jquery获取table中的某行全部td的内容方法
2013/03/08 Javascript
jquery选择器大全 全面详解jquery选择器
2014/03/06 Javascript
JS遍历Json字符串中键值对先转成JSON对象再遍历
2014/08/15 Javascript
用js提交表单解决一个页面有多个提交按钮的问题
2014/09/01 Javascript
Node.js的Koa框架上手及MySQL操作指南
2016/06/13 Javascript
关于BootStrap modal 在IOS9中不能弹出的解决方法(IOS 9 bootstrap modal ios 9 noticework)
2016/12/14 Javascript
百度地图API之百度地图退拽标记点获取经纬度的实现代码
2017/01/12 Javascript
ES6中的rest参数与扩展运算符详解
2017/07/18 Javascript
jQuery实现打开网页自动弹出遮罩层或点击弹出遮罩层功能示例
2017/10/19 jQuery
HTML5+JS+JQuery+ECharts实现异步加载问题
2017/12/16 jQuery
基于vue展开收起动画的示例代码
2018/07/05 Javascript
JS实现根据数组对象的某一属性排序操作示例
2019/01/14 Javascript
微信小程序下拉框搜索功能的实现方法
2019/07/31 Javascript
解决layui 表单元素radio不显示渲染的问题
2019/09/04 Javascript
Python中优化NumPy包使用性能的教程
2015/04/23 Python
django的settings中设置中文支持的实现
2019/04/28 Python
Python中Numpy mat的使用详解
2019/05/24 Python
python之生产者消费者模型实现详解
2019/07/27 Python
Pycharm使用远程linux服务器conda/python环境在本地运行的方法(图解))
2019/12/09 Python
python手写均值滤波
2020/02/19 Python
HTML5 使用 sessionStorage 进行页面传值的方法
2018/07/02 HTML / CSS
HTML5 拖放(Drag 和 Drop)详解与实例代码
2017/09/14 HTML / CSS
意大利消费电子产品购物网站:SLG Store
2019/12/26 全球购物
经济学博士求职自荐信范文
2013/11/23 职场文书
留学生如何写好自荐信
2013/12/27 职场文书
酒店管理求职信范文
2014/04/06 职场文书
经典禁毒标语
2014/06/16 职场文书
出纳岗位职责
2015/01/31 职场文书
会计稽核岗位职责
2015/04/13 职场文书
中标通知书范本
2015/04/17 职场文书
新学期小学班主任工作计划
2019/06/21 职场文书
详解使用内网穿透工具Ngrok代理本地服务
2022/03/31 Servers