Array.prototype.slice 使用扩展

除了正常用法,slice 经常用来将 array-like 对象转换为 true array.

名词解释:array-like object – 拥有 length 属性的对象,比如 { 0: ‘foo', length: 1 }, 甚至 { length: ‘bar' }. 最常见的 array-like 对象是 arguments 和 NodeList.

查看 V8 引擎 array.js 的源码,可以将 slice 的内部实现简化为:


代码如下:

function slice(start, end) {
var len = ToUint32(this.length), result = [];
for(var i = start; i < end; i++) {
result.push(this[i]);
}
return result;
}

可以看出,slice 并不需要 this 为 array 类型,只需要有 length 属性即可。并且 length 属性可以不为 number 类型,当不能转换为数值时,ToUnit32(this.length) 返回 0.

对于标准浏览器,上面已经将 slice 的原理解释清楚了。但是恼人的 ie, 总是给我们添乱子:


代码如下:

var slice = Array.prototype.slice;
slice.call(); // => IE: Object expected.
slice.call(document.childNodes); // => IE: JScript object expected.

以上代码,在 ie 里报错。可恨 IE 的 Trident 引擎不开源,那我们只有猜测了:


代码如下:

function ie_slice(start, end) {
var len = ToUint32(this.length), result = [];

if(__typeof__ this !== 'JScript Object') throw 'JScript object expected';
if(this === null) throw 'Oject expected';

for(var i = start; i < end; i++) {
result.push(this[i]);
}
return result;
}

至此,把猥琐的 ie 自圆其说完毕。

关于 slice, 还有一个话题:用 Array.prototype.slice 还是 [].slice ? 从理论上讲,[] 需要创建一个数组,性能上会比 Array.prototype 稍差。但实际上,这两者差不多,就如循环里用 i++ 还是 ++i 一样,纯属个人习惯。

最后一个话题,有关性能。对于数组的筛选来说,有一个牺牲色相的写法:


代码如下:

var ret = [];
for(var i = start, j = 0; i < end; i++) {
ret[j++] = arr[i];
}

用空间换时间。去掉 push, 对于大数组来说,性能提升还是比较明显的。

一大早写博,心情不是很好,得留个题目给大家:


代码如下:

var slice = Array.prototype.slice;
alert(slice.call({0: 'foo', length: 'bar'})[0]); // ?
alert(slice.call(NaN).length); // ?
alert(slice.call({0: 'foo', length: '100'})[0]); // ?

(0)

相关推荐

  • 浅谈javascript的Array.prototype.slice.call

    写字前面 在js中我们经常会看到Array.prototype.slice.call(arguments,0)的写法,当然,这个方法的作用也许大家都明白,那就是把类数组对象转换成一个真正的数组.关于这个方法,我说说自己的理解. 这里涉及到slice()方法和call()方法,所以先简单说说这两个方法. slice()方法 数组和字符串都有这个slice方法,这个方法的作用是截取一段数据.它接收两个参数,第一个参数是要截取的位置索引,第二参数可选,表示要截取到的结束位置,但是不包括结束位置.在数组

  • javascript Array.prototype.slice使用说明

    除了正常用法,slice 经常用来将 array-like 对象转换为 true array. 名词解释:array-like object – 拥有 length 属性的对象,比如 { 0: 'foo', length: 1 }, 甚至 { length: 'bar' }. 最常见的 array-like 对象是 arguments 和 NodeList. 查看 V8 引擎 array.js 的源码,可以将 slice 的内部实现简化为: 复制代码 代码如下: function slice(s

  • javascript Array.prototype.slice的使用示例

    经常的,可以看到Array.prototype.slice(arguments, 0); 这个写法可以用于function() {} 内,这样可以将函数的参数列表转换成一个真正的数组.请看一个例子: 复制代码 代码如下: var slice = Array.prototype.slice;var toString = Object.prototype.toString;(function() {  var args = arguments;  console.log(args, toString

  • Array.prototype.slice.apply的使用方法

    复制代码 代码如下: function test(){ //将参数转为一个数组 var args = Array.prototype.slice.apply(arguments); alert(args); } arguments在JavaScript语法中是函数特有的一个对象属性(Arguments对象),用来引用调用该函数时传递的实际参数.这个对象很象数组,拥有length属性且使用下标的形式来获取其元素,但它又并非真正的Array对象.更多关于Arguments对象的资料请参阅<JavaS

  • Array.prototype.slice 使用扩展

    除了正常用法,slice 经常用来将 array-like 对象转换为 true array. 名词解释:array-like object – 拥有 length 属性的对象,比如 { 0: 'foo', length: 1 }, 甚至 { length: 'bar' }. 最常见的 array-like 对象是 arguments 和 NodeList. 查看 V8 引擎 array.js 的源码,可以将 slice 的内部实现简化为: 复制代码 代码如下: function slice(s

  • js利用prototype调用Array的slice方法示例

    复制代码 代码如下: <script type="text/javascript"> function fn(name){ if(typeof name === "string"){ var args = Array.prototype.slice.call( arguments, 1 ); for(var i=0;i<args.length;i++){ alert(args[i]);//结果: 111 222 } } } function cal

  • Array.prototype 的泛型应用分析

    题目 请说明下面语句的输出: 复制代码 代码如下: x = {shift:[].shift}; x.shift(); console.info(x.length); 如果你回答正确,那么说明你已经了解 Array 函数的泛型应用.在理解这到题目之前,我 我们首先要了解数组(Array)的 shift 定义. MDC 中已经对相关的说明描述得非常的清楚 复制代码 代码如下: shift is intentionally generic; this method can be called or a

  • array.prototype.silce.call 理解分析

    Array.prototype.slice.call(thisArg[, arg1[, arg2[, ...]]])成员介绍: Array   数组对象 prototype [property]是javascript中对象的属性,用来返回对象的原型引用,可以动态的给此添加方法和属性,对象如array,object,或者用户定义的对象,详细请看这里 slice [Function]用原array对象,截取指定部分返回一个新的Array 对象,详细请看这里 call [Function]   cal

  • 为JS扩展Array.prototype.indexOf引发的问题及解决办法

    Array没有indexOf方法,这样在一个数组中查找某个元素的索引时比较麻烦,为了调用方便,于是通过prototype原型扩展了Array.prototype.indexOf(),这样用起来就比较方便了.但是这个自定义的indexOf在对数组进行遍历的时候却出现了问题. 复制代码 代码如下: Array.prototype.indexOf = function(item) {  for (var i = 0; i < this.length; i++) {  if (this[i] == it

  • 为JS扩展Array.prototype.indexOf引发的问题探讨及解决

    Array没有indexOf方法,这样在一个数组中查找某个元素的索引时比较麻烦,为了调用方便,于是通过prototype原型扩展了Array.prototype.indexOf(),这样用起来就比较方便了.但是这个自定义的indexOf在对数组进行遍历的时候却出现了问题. Array没有indexOf方法,这样在一个数组中查找某个元素的索引时比较麻烦,为了调用方便,于是通过prototype原型扩展了Array.prototype.indexOf(),这样用起来就比较方便了. 复制代码 代码如下

随机推荐