第5章引用类型 (一)_因为数值 5 虽然小于 10,但在进行字符串比较时, "10"则位于"5"的前面-CSDN博客

引用类型的值 (对象) 是引用类型的一个实例。在 ECMAScript 中，引用类型是一种数据结构，用于将数据和功能组合在一起。它也常被称为类，但这种称呼并不妥当。尽管 ECMAScript 从技术上讲是一门面向对象的语言，但它不具备传统的面向对象语言所支持的类和接口等基本结构。引用类型有时候也被称为对象定义，因为它们描述的是一类对象所具有的属性和方法。

如前所述，对象是某个特定引用类型的实例。新对象是使用 new 操作符后跟一个构造函数来创建的。构造函数本身就是一个函数，只不过该函数是出于创建新对象的目的而定义的。请看下面这行代码：

var person = new Object();

这行代码创建了 Object 引用类型的一个新实例，然后把该实例保存在了变量 person 中。使用的构造函数是 Object ，它只为新对象定义了默认的属性和方法。ECMAScript 提供了很多原生引用类型 (例如 Object) ，以便开发人员用以实现常见的计算任务。

5.1 Object 类型

到目前为止，我们看到的大多数引用类型值都是 Object 类型的实例；而且， Object 也是ECMAScript 中使用最多的一个类型。虽然 Object 的实例不具备多少功能，但对于在应用程序中存储和传输数据而言，它们确实是非常理想的选择。

创建 Object 实例的方式有两种。第一种是使用 new 操作符后跟 Object 构造函数，如下所示：

var person = new Object();

person.name = "Nicholas";

person.age = 29;

另一种方式是使用对象字面量表示法，对象字面量是对象定义的一种简写形式，目的在于简化创建包含大量属性的对象的过程。下面这个例子就使用了对象字面量语法定义了与前面那个例子中相同的 person 对象：

var person = {

age: 29

};

在这个例子中，左边的花括号 ({) 表示对象字面量的开始，因为它出现在了赋值操作符的后面。然后，我们定义了 name 属性，之后是一个冒号，再后面是这个属性的值。在对象字面量中，使用逗号来分隔不同的属性，因此 "Nicholas" 后面是一个逗号。但是，在 age 属性的值 29 的后面不能添加逗号，因为 age 是这个对象的最后一个属性。在最后一个属性后面添加逗号，会在 IE 及 Opera 中导致错误。

在使用对象字面量语法时，属性名也可以使用字符串，如下面这个例子所示：

var person = {

"name" : "Nicholas",

"age" : 29

};

以上代码也会得到与前面例子相同的结果：创建一个带有 name 和 age 属性的新对象。

另外，使用对象字面量语法时，如果留空其花括号，则可以定义只包含默认属性和方法的对象，如下所示：

var person = {} ; // 与 new Object() 相同

person.name = "Nicholas";

person.age = 29;

这个例子与本节前面的例子是等价的，只不过看起来似乎有点奇怪。关于对象字面量语法，我们推荐只在考虑对象属性名的可读性时使用。

在通过对象字面量定义对象时，实际上不会调用 Object 构造函数 (Firefox 除外)。

虽然可以使用前面介绍的任何一种方法来定义对象，但开发人员更青睐对象字面量语法，因为这种语法要求的代码量少，而且能够给人封装数据的感觉。实际上，对象字面量也是向函数传递大量可选参数的首选方式，例如：

function displayInfo (args) {

var output = "";

if(typeof args.name == "string") {

output += "Name: " + args.name + "\n";

}

if(typeof args.age == "number") {

output += "Age: " + args.age + "\n";

}

alert(output);

}

displayInfo ({

age: 29

});

displayInfo ({

});

在这个例子中，函数 displayInfo() 接受一个名为 args 的参数。这个参数可能带有一个名为 name 或 age 的属性，也可能这两个属性都有或者都没有。在这个函数内部，我们通过 typeof 操作符来检测每个属性是否存在，然后再基于相应的属性来构建一条要显示的消息。然后，我们调用了两次这个函数，每次都使用一个对象字面量来指定不同的数据。这两次调用传递的参数虽然不同，但函数都能正常执行。

这种传递参数的模式最适合需要向函数传入大量可选参数的情形。一般来讲，命名参数虽然容易处理，但在有多个可选参数的情况下就会显得不够灵活。最好的做法是对那些必需值使用命名参数，而使用对象字面量来封装多个可选参数。

一般来说，访问对象属性时使用的都是点表示法，这也是很多面向对象语言中通用的语法。不过，在 JavaScript 也可以使用方括号表示法来访问对象的属性。在使用方括号语法时，应该将要访问的属性以字符串的形式放在方括号中，如下面的例子所示：

alert(person["name"]); // "Nicholas"

alert(person.name); // "Nicholas"

从功能上看，这两种访问对象属性的方法没有任何区别。但方括号语法的主要优点是可以通过变量来访问属性，例如：

var propertyName = "name";

alert(person[propertyName]); // "Nicholas"

通常，除非必须使用变量来访问属性，否则我们建议使用点表示法。

5.2 Array 类型

除了 Object 之外，Array 类型恐怕是 ECMAScript 中最常用的类型了。而且，ECMAScript 中的数组与其他多数语言中的数组有着相当大的区别。虽然 ECMAScript 数组与其他语言的数组都是数据的有序列表，但与其他语言不同的是，ECMAScript 数组的每一项可以保存任何类型的数据。也就是说，可以用数组的第一个位置来保存字符串，用第二个位置来保存数值，用第三个位置来保存对象，以此类推。而且，ECMAScript 数组的大小是可以动态调整的，即可以随着数据的添加自动增长以容纳新增数据。

创建数组的基本方式有两种。第一种是使用 Array 构造函数，如下面的代码所示：

var colors = new Array();

如果预先知道数组要保存的项目数量，也可以给构造函数传递该数量，得到的数组就会具有那么多的位置 (其中每一项的初始值都是 undefined) 。例如，下面的代码将创建包含 20 个项的数组：

var colors = new Array(20);

也可以向 Array 构造函数传递数值中应该包含的项。以下代码创建了一个包含 3 个字符串值的数组：

var colors = new Array("red", "blue", "green");

当然，给构造函数传递一个值也可以创建数组。但这时候问题就复杂一点了，因为如果传递的是数值，则会按照该数值创建包含给定项数的数组；而如果传递的是其他类型的参数，则会创建包含那个值的只有一项的数组。下面就有两个例子：

var colors = new Array(3); // 创建一个包含 3 项的数组

var names = new Array("Greg"); // 创建一个包含 1 项，即字符串 "Greg" 的数组

另外，在使用 Array 构造函数时也可以省略 new 操作符。如下面的例子所示，省略 new 操作符的结果相同：

var colors = Array(3); // 创建一个包含 3 项的数组

var names = Array ("Greg"); // 创建一个包含 1 项，即字符串 "Greg" 的数组

创建数组的第二种基本方式是使用数组字面量表示法。数组字面量由一对包含数组项的方括号表示，多个数组项之间以逗号隔开，如下所示：

var colors = ["red", "blue", "green"]; // 创建一个包含 3 个字符串的数组

var names = []; // 创建一个空数组

var values = [1,2, ]; // 不要这样！这样会创建一个包含 2 或 3 项的数组

var options = [ , , , , , ]; // 不要这样！这样会创建一个包含 5 或 6 项的数组

以上代码的第一行创建了一个包含 3 个字符串的数组。第二行使用一对空方括号创建了一个空数组。第三行展示了在数组字面量的最后一项添加逗号的结果：在 IE 中，values 会成为一个包含 3 个项且每项的值分别为 1、2 和 undefined 的数组；在其他浏览器中， values 会成为一个包含 2 项且值分别为 1 和 2 的数组。原因是 IE 的 ECMAScript 实现在数组字面量方面存在 bug 。由于这个 bug 导致的另一种情况如最后一行代码所示，该行代码可能会创建包含 5 项的数组 (在 Firefox 、 Opera 、Safari 和 Chrome 中)，也可能会创建包含 6 项的数组 (在 IE 中)。在像这种省略值的情况下，每一项都将获得 undefined 值；这个结果与调用 Array 构造函数时传递项数在逻辑上是相同的。但是由于 IE 的实现与其他浏览器不一致，因此我们强烈建议不要使用这种语法。

与对象一样，在使用数组字面量表示法时，也不会调用 Array 构造函数 (Firefox 除外)。

在读取和设置数组的值时，要使用方括号并提供相应值的基于 0 的数字索引，如下所示：

var colors = ["red", "blue", "green"]; // 定义一个字符串数组

alert(colors[0]); // 显示第一项

colors[2] = "black"; // 修改第三项

colors[3] = "brown"; // 新增第四项

方括号中的索引表示要访问的值。如果索引小于数组中的项数，则返回对应项的值，就像这个例子中的 colors[0] 会显示 "red" 一样。设置数组的值也使用相同的语法，但会替换指定位置的值。如果设置某个值的索引超过了数组现有项数，如这个例子中的 colors[3] 所示，数组就会自动增加到该索引值加 1 的长度。

数组的项数保存在其 length 属性中，这个属性始终会返回 0 或更大的值，如下面这个例子所示：

var colors = ["red", "blue", "green"]; // 创建一个包含 3 个字符串的数组

var names = []; // 创建一个空数组

alert(colors.length); // 3

alert(names.length); // 0

数组的 length 属性很有特点 -- 它不是只读的。因此，通过设置这个属性，可以从数组的末尾移除项或向数组中添加新项。请看下面的例子：

var colors = ["red", "blue", "green"]; // 创建一个包含 3 个字符串的数组

colors.length = 2;

alert(colors[2]); // undefined

这个例子中的数组 colors 一开始有 3 个值。将其 length 属性设置为 2 会移除最后一项 (位置为 2 的那一项)，结果再访问 colors[2] 就会显示 undefined 了。如果将其 length 属性设置为大于数组项数的值，则新增的每一项都会取得 undefined 值，如下所示：

var colors = ["red", "blue", "green"]; // 创建一个包含 3 个字符串的数组

colors.length = 4;

alert(colors[3]); // undefined

在此，虽然 colors 数组包含 3 个项，但把它的 length 属性设置成了 4 。于是，这个数组中位置为 3 的那一项就获得了 undefined 值，数组的项数也增加到 4 。

利用 length 属性也可以方便地在数组末尾添加新项，如下所示：

var colors = ["red", "blue", "green"]; // 创建一个包含 3 个字符串的数组

colors[colors.length] = "black"; // (在位置3) 添加一种颜色

colors[colors.length] = "brown"; // (在位置4)再添加一种颜色

由于数组最后一项的索引始终是 length - 1 ，因此下一个新项的位置就是 length 。每当在数组末尾添加一项后，其 length 属性都会自动更新以反应这一变化。换句话说，上面例子第二行中的 colors[colors.length] 为位置 3 添加一个值，最后一行的 colors[colors.length] 则为位置 4 添加了一个值。当把一个值放在超出当前数组大小的位置上时，数组就会重新计算其长度值，即长度值等于最后一项的索引加 1 ，如下面的例子所示：

var colors = ["red", "blue", "green"] ; // 创建一个包含 3 个字符串的数组

colors[99] = "black"; // (在位置99) 添加一种颜色

alert(colors.length); // 100

在这个例子中，我们向 colors 数组的位置 99 插入了一个值，结果数组新长度 (length) 就是 100 (99 + 1) 。而从位置 3 到位置 98 的每一项，都将获得 undefined 值。

5.2.1 转换方法

如前所述，所有对象都具有 toLocalString() 、 toString() 和 valueOf() 方法。其中，调用数组的 toString() 和 valueOf() 方法会返回相同的值，即由数组中每个值的字符串形式拼接而成的一个以逗号分隔的字符串。实际上，为了创建这个字符串串会调用数组每一项的 toString() 方法。来看下面这个例子：

var colors = ["red", "blue", "green"]; // 创建一个包含 3 个字符串的数组

alert(colors.toString()); // red,blue,green

alert(colors.valueOf()); // red,blue,green

alert(colors); // red,blue,green

在这里，我们首先显示调用了 toString() 和 valueOf() 方法，以便返回数组的字符串表示，每个值的字符串表示拼接成了一个字符串，中间以逗号分隔。最后一行代码直接将数组传递给了 alert() 。由于 alert() 要接收字符串参数，所以它会在后台调用 toString() 方法，由此会得到与直接调用 toString() 方法相同的结果。

另外，toLocaleString() 方法经常也会返回与 toString() 和 valueOf() 方法相同的值，但也不总是如此。当调用数组的 toLocaleString() 方法时，它也会创建一个数组值的以逗号分隔的字符串。而与前两个方法唯一的不同之处在于，这一次为了取得每一项的值，调用的是每一项的 toLocaleString() 方法，而不是 toString() 方法。请看下面这个例子：

var person1 = {

toLocaleString : function(){

return "Nikolaos";

toString : function(){

return "Nicholas";

}

} ;

var person2 = {

toLocaleString : function(){

return "Grigorios";

toString : function(){

return "Greg";

}

};

var people = [person1, person2];

alert(people); // Nicholas,Greg

alert(people.toString()); // Nicholas,Greg

alert(people.toLocaleString()); // Nikolaos,Grigorios

我们在这里定义了两个对象： person1 和 person2 。而且还分别为每个对象定义了一个 toString() 方法和一个 toLocaleString() 方法，这两个方法返回不同的值。然后，创建一个包含前面定义的两个对象的数组。在将数组传递给 alert() 时，输出结果是 "Nicholas,Greg"，因为调用了数组每一项的 toString() 方法 (同样，这与下一行显式调用 toString()方法得到的结果相同)。而当调用数组的 toLocaleString() 方法时，输出结果是 "Nikolaos,Grigorios" ，原因是调用了数组每一项的 toLocaleString() 方法。

数组继承的 toLocaleString()、toString() 和 valueOf() 方法，在默认情况下都会以逗号分隔的字符串的形式返回数组项。而如果使用 join() 方法，则可以使用不同的分隔符来构建这个字符串。join() 方法只接受一个参数，即用作分隔符的字符串，然后返回包含所有数组项的字符串。请看下面的例子：

var colors = ["red", "green", "blue"];

alert(colors.join(",")); // red, green, blue

alert(colors.join("||")); // red||green||blue

在这里，我们使用 join() 方法重现了 toString() 方法的输出。在传递逗号的情况下，得到了以逗号分隔的数组值。而在最后一行代码中，我们传递了双竖线符合，结果就得到了字符串 "red||green||blue" 。

如果数组中的某一项的值是 null 或者 undefined ，那么该值在 join() 、toLocaleString() 、toString() 和 valueOf() 方法返回的结果中以空字符串表示。

5.2.2 栈方法

ECMAScript 数组也提供了一种让数组的行为类似于其他数据结构的方法。具体说来，数组可以表现得就像栈一样，后者是一种可以限制插入和删除项的数据结构。栈是一种LIFO (last-in-first-out ，后进先出)的数据结构，也就是最新添加的项最早被移除。而栈中项的插入 (叫做推入) 和移除 (叫弹出)，只发生在一个位置 -- 栈的顶部。ECMAScript 为数组专门提供了 push() 和 pop() 方法，以便实现类似栈的行为。

push() 方法可以接收任意数量的参数，把它们逐个添加到数组末尾，并返回修改后数组的长度。而 pop() 方法则从数组末尾移除最后一项，减少数组的 length 值，然后返回移除的项。请看下面的例子：

var colors = new Array(); // 创建一个数组

var count = colors.push("red", "green"); // 推入两项

alert(count); // 2

count = colors.push("black"); // 推入另一项

alert(count); // 3

var item = colors.pop() // 取得最后一项

alert(item); // "black"

alert(colors.length); // 2

以上代码中的数组可以看作是栈 (代码本身没有任何区别；而 push() 和 pop() 都是数组默认的方法)。首先，我们使用 push() 将两个字符串推入数组的末尾，并将返回的结果保存在变量 count 中 (值为2) 。然后，再推入一个值，而结果仍然保存在 count 中。因为此时数组中包含 3 项，所以 push() 返回 3 。在调用 pop() 时，它会返回数组的最后一项，即字符串 "black" 。此后，数组中仅剩两项。

可以将栈方法与其他数组方法连用，像下面这个例子一样：

var colors = ["red", "blue"];

colors.push("brown"); // 添加另一项

colors[3] = "black"; // 添加一项

alert(colors.length); // 4

var item = colors.pop(); // 取得最后一项

alert(item); // "black"

在此，我们首先用两个值来初始化一个数组。然后，使用 push() 添加第三个值，再通过直接在位置 3 上复制来添加第四个值。而在调用 pop() 时，该方法返回了字符串 "black"，即最后一个添加到数组的值。

5.2.3 队列方法

栈数据结构的访问规则是 LIFO (后进先出) ，而队列数据结构的访问规则是 FIFO (first-in-first-out，先进先出)。队列在列表的末端添加项，从列表的前端移除项。由于 push() 是向数组末端加项的方法，因此要模拟队列只需一个从数组前端取得项的方法。实现这一操作的数组方法就是 shift() ，它能够移除数组中的第一个项并返回该项，同时将数组长度减 1 。结合使用 shift() 和 push() 方法，可以像使用队列一样使用数组：

var colors = new Array(); // 创建一个数组

var count = colors.push("red", "green"); // 推入两项

alert(count); // 2

count = colors.push("black"); // 推入另一项

alert(count); // 3

var item = colors.shift(); // 取得第一项

alert(item); // "red"

alert(colors.length); // 2

这个例子首先使用 push() 方法创建了一个包含 3 种颜色名称的数组。用 shift() 方法从数组中取得了第一项，即 "red" 。在移除第一项之后，“green” 就变成了第一项，而 "black" 则变成了第二项，数组也只包含两项了。

ECMAScript 还为数组提供了一个 unshift() 方法。顾名思义， unshift() 与 shift() 的用途相反：它能在数组前端添加任意个项并返回新数组的长度。因此，同时使用 unshift() 和 pop() 方法，可以从相反的方向来模拟队列，即在数组的前端添加项，从数组末端移除项，如下面的例子所示：

var colors = new Array(); // 创建一个数组

var count = colors.unshift("red", "green"); // 推入两项

alert(count); // 2

count = colors.unshift("black"); // 推入另一项

alert(count); // 3

var item = colors.pop(); // 取得最后一项

alert(item); // "green"

alert(colors.length); // 2

这个例子创建了一个数组并使用 unshift() 方法先后推入了 3 个值。首先是 "red" 和 "green" ，然后是 “black” ，数组中各项的顺序为 "black" 、"red" 、"green" 。在调用 pop() 方法时，移除并返回的最后一项，即 "green" 。

IE 对 JavaScript 的实现中存在一个偏差，其 unshift() 方法总是返回 undefined 而不是数组的新长度。

5.2.4 重排序方法

数组中已经存在两个可以直接用来重排序的方法：reverse() 和 sort() 。有读者可能猜到了，reverse() 方法会反转数组项的顺序。请看下面这个例子：

var values = [1,2,3,4,5];

values.reverse();

alert(values); // 5,4,3,2,1

在默认情况下，sort() 方法按升序排列数组项 -- 即最小的值位于最前面，最大的值排在最后面。为了实现排序，sort() 方法会调用每个数组项的 toString() 转型方法，然后比较得到的字符串，以确定如何排序。即使数组中的每一项都是数值， sort() 方法比较的也是字符串，如下所示：

var values = [0,1,5,10,15];

values.sort();

alert(values); // 0, 1, 10, 15, 5

可见，即使例子中值的顺序没有问题，但 sort() 方法也会根据测试字符串的结果改变原来的顺序。因为数值5虽然小于10，但在进行字符串比较时，“10” 则位于 “5” 的前面，于是数组的顺序就被修改了。不用说，这种排序方式在很多情况下都不是最佳方案。因此 sort() 方法可以接收一个比较函数作为参数，以便我们指定哪个值位于哪个值的前面。

比较函数接受两个参数，如果第一个参数应该位于第二个之前则返回一个负数，如果两个参数相等则返回 0 ，如果第一个参数应该位于第二个之后则返回一个正数。以下就是一个简单的比较函数：

function compare(value1, value2) {

if (value1 < value2) {

return -1;

} else if (value1 > value2) {

return 1;

} else {

return 0;

}

这个比较函数可以适用于大多数数据类型，只要将其作为参数传递给 sort() 方法即可，如下面这个例子所示：

var values = [0, 1, 5, 10, 15];

values.sort(compare);

alert(values); // 0,1,5,10,15

在将比较函数传递到 sort() 方法之后，数值仍然保持了正确的升序。当然，也可以通过比较函数产生降序排序的结果，只要交换比较函数返回的值即可：

function compare(value1, value2) {

if (value1 < value2){

return 1;

} else if (value1 > value2) {

return -1;

} else {

return 0;

}

var values = [0,1,5,10,15];

values.sort(compare);

alert(values); // 15,10,5,1,0

在这个修改后的例子中，比较函数在第一个值应该位于第二个之后的情况下返回 1，而在第一值应该在第二个之前的情况下返回 -1 。交换返回值的意思是让更大的值排位更靠前，也就是对数组按照降序排序。当然，如果只想反转数组原来的顺序，使用 reverse() 方法要更快一些。

reverse() 和 sort() 方法的返回值是经过排序之后的数组。

对于数值类型或者其 valueOf() 方法会返回数值类型的对象类型，可以使用一个更简单的比较函数。这个函数只要用第二个值减第一个值即可：

function compare (value1, value2) {

return value2 - value1;

}

由于比较函数通过返回一个小于零、等于零或大于零的值来影响排序结果，因此减法操作就可以适当地处理所有这些情况。

5.2.5 操作方法

(1)ECMAScript 为操作已经包含在数组中的项提供了很多方法。其中，concat() 方法可以基于当前数组中的所有项创建一个新数组。具体来说，这个方法会先创建当前数组一个副本，然后将接收到的参数添加到这个副本的末尾，最后返回新构建的数组。在没有给 concat() 方法传递参数的情况下，它只是复制当前数组并返回副本。如果传递给 concat()方法的是一或多个数组，该方法会将这些数组中的每一项都添加到结果数组中。如果传递的值不是数组，这些值就会被简单地添加到结果数组的末尾。下面来看一个例子：

var colors = ["red", "green", "blue"];

var colors2 = colors.concat("yellow", ["black", "brown"]);

alert(colors); // red, green, blue

alert(colors2); // red,green,blue,yellow,black,brown

以上代码开始定义了一个包含 3 个值的数组 colors 。然后，基于 colors 调用了 concat() 方法，并传入字符串 "yellow" 和一个包含 "black" 和 "brown" 的数组。最终，结果数组 colors2 中包含了 "red" 、"green" 、"blue" 、"yellow" 、"black" 和 "brown" 。至于原来的数组 colors ，其值仍然保持不变。

(2) 下一个方法是 slice() ，它能够基于当前数组中的一或多个项创建一个新数组。slice() 方法可以接受一或两个参数，即要返回项的起始和结束位置。在只有一个参数的情况下， slice() 方法返回从该参数指定位置开始到当前数组末尾的所有项。如果有两个参数，该方法返回起始和结束位置之间的项 -- 但不包括结束位置的项。注意，slice() 方法不会影响原始数组。请看下面的例子：

var colors = ["red", "green", "blue", "yellow", "purple"];

var colors2 = colors.slice(1);

var colors3 = colors.slice(1, 4);

alert(colors2); // green, blue, yellow, purple

alert(colors3); // green,blue,yellow

在这个例子中，开始定义的数组 colors 包含5项。调用 slice() 并传入 1 会得到一个包含 4 项的新数组；因为是从位置1开始复制，所以会包含 "green" 而不包含 "red"。这个新数组 colors2 中包含的是 "green" 、"blue"、"yellow" 和 "purple" 。接着，我们再次调用 slice() 并传入了 1 和 4，表示复制从位置1 开始，到位置3结束。结果数组 colors3 中包含 "green" 、"blue" 和 "yellow" 。

如果slice() 方法的参数中有一个负数，则用数组长度加上该数来去顶相应的位置。例如，在一个包含5项的数组上的调用 slice(-2,-1)与调用 slice(3,4)得到的结果相同。如果结束位置小于起始位置，则返回空数组。

(3)下面我们来介绍 splice() 方法 (这个方法会影响原数组) ，这个方法恐怕要算是最强大的数组方法了，它有很多种用法。splice()的主要用途是向数组的中部插入项，但使用这种方法的方式则有如下3种：

删除 -- 可以删除任意数量的项，只需指定2个参数：要删除的第一项的位置和要删除的项数。例如，splice(0, 2)会删除数组中的前两项。

插入 -- 可以向指定位置插入任意数量的项，只需提供3个参数：起始位置、0(要删除的项数)和要插入的项。如果要插入多个项，可以再传入第四、第五，以至任意多个项。例如，splice(2,0,"red","green")会从当前数组的位置2开始插入字符串 "red" 和 “green” 。

替换 -- 可以向指定位置插入任意数量的项，且同时删除任意数量的项，只需指定3个参数：起始位置、要删除的项数和要插入的任意数量的项。插入的项数不必与删除的项数相等。例如， splice(2,1,"red","green") 会删除当前数组位置 2 的项，然后再从位置2开始插入字符串 "red" 和 "green" 。

splice() 方法始终都会返回一个数组，该数组中包含从原始数组中删除的项 (如果没有删除任何项，则返回一个空数组)。下面的代码展示了上述 3 种使用 splice() 方法的方式：

var colors = ["red", "green", "blue"];

var removed = colors.splice(0,1); // 删除第一项

alert(colors); // green,blue

alert(removed); // red ，返回的数组中只包含一项

removed = colors.splice(1, 0, "yellow", "orange"); // 从位置 1 开始插入两项

alert(colors); // green, yellow, orange, blue

alert(removed); // 返回的是一个空数组

removed = colors.splice(1,1,"red","purple"); // 插入两项，删除一项

alert(colors); // green, red, purple, orange, blue

alert(removed); // yellow, 返回的数组中只包含一项

上面的例子首先定义了一个包含3项的数组 colors 。第一次调用 splice() 方法只是删除了这个数组的第一项，之后 colors 还包含 "green" 和 "blue" 两项。第二次调用 splice() 方法时在位置 1 插入了两项，结果 colors 中包含 "green" 、"yellow" 、"orange" 和 "blue"。这此一次操作没有删除项，因此返回了一个空数组。最后一次调用 splice() 方法删除了位置 1 处的一项，然后又插入了 "red" 和 "purple" 。在完成以上操作之后，数组 colors 中包含的是 "green" 、"red" 、 “purple” 、"orange" 和 "blue" 。