删除数组元素
视频锁定
{$ currentTime | date:'mm:ss' $}
{$ timeLeft | date:'mm:ss' $}
虽然令人费解,但是 JavaScript 的数组对象上确实没有一个叫做 delete 或者 remove 的方法,这就使得我们需要自己扩展其数组对象。一般来说,我们可以扩展 JavaScript 解 释器环境中内置的对象,这种方式的好处在于,扩展之后的对象可以适用于其后的任意场景,而不用每次都显式的声明。而这种做法的坏处在于,修改了内置对象,则可能产生一些难以预料的错误,比如遍历数组实例的时候,可能会产生令人费解的异常。
数组中的每个元素都是一个对象,那么,我们可以使用 delete 来删除元素吗?来看看下边这个小例子:
var array = ["one", "two","three","four"];
//数组中现在的内容为:
//one,two,three,four
//array.length == 4
delete array[2];
然后,我们再来看看这个数组的内容:
one, two, undefined, four
//array.length == 4
可以看到,delete 只是将数组 array 的第三个位置上的元素删掉了,可是数组的长度没有改变,显然这个不是我们想要的结果,不过我们可以借助数组对象自身的 slice 方法来做到。 一个比较好的实现,是来自于 jQuery 的设计者 John Resig:
//Array Remove - By John Resig (MIT Licensed)
Array.prototype.remove = function(from, to) {
var rest = this.slice((to || from) + 1 || this.length);
this.length = from < 0 ? this.length + from : from;
return this.push.apply(this, rest);
};
这个函数扩展了 JavaScript 的内置对象 Array,这样,我们以后的所有声明的数组都会自动的拥有 remove 能力,我们来看看这个方法的用法:
var array = ["one", "two", "three", "four", "five", "six"];
print(array);
array.remove(0);//删除第一个元素
print(array);
array.remove(-1);//删除倒数第一个元素
print(array); array.remove(0,2);//删除数组中下标为0-2的元素(3个)
print(array);
会得到这样的结果:
one,two,three,four,five,six
two,three,four,five,six
two,three,four,five
five
也就是说,remove 接受两个参数,第一个参数为起始下标,第二个参数为结束下标,其中第二个参数可以忽略,这种情况下会删除指定下标的元素。当然,不是每个人都希望影响整个原型链(原因在下一个小节里讨论),因此可以考虑另一种方式:
//Array Remove - By John Resig (MIT Licensed)
Array.remove = function(array, from, to) {
var rest = array.slice((to || from) + 1 || array.length);
array.length = from < 0 ? array.length + from : from;
return array.push.apply(array, rest);
};
其操作方式与前者并无二致,但是不影响全局对象,代价是你需要显式的传递需要操作的数组作为第一个参数:
var array = ["one", "two", "three", "four", "five", "six"];
Array.remove(array, 0, 2);//删除0, 1, 2三个元素
print(array);
这种方式,相当于给 JavaScript 内置的 Array 添加了一个静态方法。
在线练习
{$ activeFileHint $}