Front-end web developer——[to be a better man]
文章字体大小Font Size文章字体大小:12px, 14px

array

十二 21

上次写了一篇《Array.prototype.slice.call自解》,主要是讲我在学习Currying in Javascript时所遇到的一个小问题,即为什么很多人把[].slice()写成了Array.prototype.slice.call(ArrObj),有朋友说此文质量太差,所以偶重写一次,看看能不能说清楚问题。

Array.prototype.slice.call 其实是对slice方法进行的静态调用。这里说的静态调用,主要区别于OOP方式。OOP方式需要先建立对象,如下:

[].slice(begin,end);

在JS中,[]就是一个数组对象,在执行时,先会建立对象,再执行自身对象下的slice方法,对这个数组进行切割

而静态调用与OOP方式调用主要目的是静态方式的机器执行效率较高,因为不需要先经过建立对象,而不需要为对象增加内在开销,所以这种写法在较底层的JS程序(如JS框架,兼容性基础库)里面使用得比较多。

Array.prototype.slice就是这样的一个函数,如果要知道为什么不直接写slice而写那么长的三个单词,这不是三言两语说和清楚的,请看JavaScript中的prototype(原型)属性研究 ,如果简单点说,可以用伪代码表示:

Array.prototype.slice=function(begin,end){
  var arr=this;//this就是被切割的函数
  var newArr=我只要arr数组的begin到end中间的部分;//这才是真正的中文编程
  return newArr;//返回被切割后的新数组,强大吧!
}

然后,通过调用函数的call方法:call(thisObj,begin,end),把里面的this强制转换成将要被切割的数组,即术语中的改变函数的scope,从而完成切割。

使用情况:
这个语句通常用于把arguments转换为数组。

function fn() {
  a = Array.prototype.slice.call(arguments,0);
  alert(a);
}(1,2,3,4,5,6,7,'never-online.net/blog')

该代码片段摘自CSDN WEB开发社区的某帖的2楼。

函数的argements在JS1.5中只是一个类似数组的对象,有length属性,但并不是真正的数组,具体请看:Array-like Objects in JavaScript。(据说在ECMA script2中将会是个真正的数组了)

注意:这个语句可不能随便用哦,有的同学把String作为对象转进去,把abcde变为[a,b,c,d,e],这可不是万试万灵的哦,不同的浏览器对slice的解释是有所区别的哦。例如Prototype.js中的$A函数也可以把arguments转为单纯数组,但为了适应更多的情况,它直接使用循环来实现了。

相关文章:

  1. Currying JavaScript Functions
  2. JavaScript Currying Redux
  3. JavaScript currying
  4. functional.js 介绍及源码分析
  5. Array.prototype.slice.apply 使用技巧
  6. Array-like Objects in JavaScript
  7. JavaScript中的prototype(原型)属性研究
  8. http://topic.csdn.net/u/20080725/09/162cb47f-be44-44bf-adcf-2a0ea7538454.html

UPDATE:我写的研究和学习总结性的技术文章,除非是比较重要和大型的项目,否则不会给出直接的代码和可下载的例子,更加不会像幼儿园教小朋友那样手把手的第一步第二步,也不想那样做,以后也不打算那样做,因为我发现越来越多人根本就不想自己动手,习惯性的拿来主义不利于业界的长久发展。

Popularity: 10% [?]

06

UPDATE:20080530最新修改

UPDATE:20081221补充说明::oops: 小弟写这篇东西实在是班门弄斧了,这是当时我刚理解完时就写下的,说的口水多,没什么实例,非但没把问题说清楚也把大家搞糊涂了,实在不好意思。如果想要知道实例,请搜索一下Currying in Javascript 吧,用到Currying的地方,几乎都会出现这种写法。其实这里主要说的不是把参数换成数组,而是更玄妙一点的JS运用。这里见笑了,如果可以,以后会换个更直接明了的书写风格的。

同时更正了一处链接。

关于本文所说明的问题有更简洁的另一个解释方法:什么是Array.prototype.slice.call。

为了研究Currying in Javascript,翻阅了很多外文网站,为的是找一个比较好的Currying方案,找到的比较详细的有如下(文章内部链接可能包含更多的相关文章):

  1. Currying JavaScript Functions
  2. JavaScript Currying Redux
  3. JavaScript currying
  4. functional.js 介绍及源码分析

发现大多人都用了Array.prototype.slice.call(argments,0),一直不明白这句是干什么的。而昨天温习了slice()方法,再参考Function.call(thisArg[, arg1[, arg2[, ...]]]),还是不得而知(我脑筋转得慢:|)。上网查,第一时间查老外的Google.com in English也没解释,真到查找“Array.prototype.slice 用法”时,才得到数篇。虽然我很鄙视搞收集的人,搞得互联网文章像是天下一大抄似的,但现在却恨少,只得三篇(一模一样的三篇,责任编辑为admin或者超级管理员,作者是佚名。)

下面就我的理解,对Array.prototype.slice.call进行解说,菜鸟留下,大虾吐口水:
Update: 下面写的可能有点难懂,怕刚接触Javascript的人可能会看不懂,请大家看完后留个言,谢谢!

Array.prototype.slice.call(thisArg[, arg1[, arg2[, ...]]])

成员介绍:

Array [object]

Array对象(即数组对象)

prototype [property]

Javascript的原型,此prototype非Prototype.js,可以暂且理解为Java中的静态属性/方法。总之这个不好说,详细请看JavaScript中的prototype(原型)属性研究

slice [Function]

数组切分方法,很有用的一个方法,具体请看这里,或那里

call [Function]

神奇的方法,该方法是所有Function对象里的方法,所以slice就有这样一个方法。用于把Function对象里的this替换为目标对象。看这里

串起来就是: 阅读全文(Read the rest of this entry) »

Popularity: 96% [?]

05

为了研究Currying in Javascript,所以温习一下slice()方法。

Array.slice(begin[,end])

该slice方法返回数据的指定区段。该slice方法不会改变原始的数组,返回的是一个全新的数组拷贝,而不是原始数组引用,所以无论是改变原始数组还是新数组,双方均不受影响。该slice方法通过由零开始计算的数组下标来确定切割的部分,创建一个由下标begin开始,到下标end-1止的新数组(如果end未被指定,默认为最后一个元素)。如:
代码:

1
2
trees = ["oak", "ash", "beech", "maple", "sycamore"]
document.write(trees.slice(1,4))

输出:
ash,beech,maple
阅读全文(Read the rest of this entry) »

Popularity: 59% [?]