javascript高级程序设计--学习笔记3 （第5章）

第5章 浏览器中的JavaScript

Object类型

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

var person = new Object();person.name = "Nicholas";person.age = 29;

另一种方式是使用对象字面量表示法。对象字面量是对象定义的一种简写形式，目的在于简化创建包含大量属性的对象的过程。

var person = {　　name : "Nicholas",　　age : 29};

在这个例子中，左边的花括号（{）表示对象字面量的开始，因为它出现在了表达式上下文（expression context）中。ECMAScript 中的表达式上下文指的是能够返回一个值（表达式）。赋值操作符表示后面是一个值，所以左花括号在这里表示一个表达式的开始。同样的花括号，如果出现在一个语句上下文（statement context）中，例如跟在if 语句条件的后面，则表示一个语句块的开始。

我们定义了name 属性，之后是一个冒号，再后面是这个属性的值。在对象字面量中，使用逗号来分隔不同的属性，因此"Nicholas"后面是一个逗号。但是，在age 属性的值29 的后面不能添加逗号，因为age 是这个对象的最后一个属性。在最后一个属性后面添加逗号，会在IE7 及更早版本和Opera 中导致错误。

在使用对象字面量语法时，属性名也可以使用字符串。

var person = {    "name" : "Nicholas",    "age" : 29,    5 : true};

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

var person = {}; //与new Object()相同person.name = "Nicholas";person.age = 29;

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

访问对象属性时使用的都是点表示法，在JavaScript 也可以使用方括号表示法来访问对象的属性。

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

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

var propertyName = "name";alert(person[propertyName]); //"Nicholas"

如果属性名中包含会导致语法错误的字符，或者属性名使用的是关键字或保留字，也可以使用方括号表示法。

person["first name"] = "Nicholas";

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

Array 类型

ECMAScript数组的每一项可以保存任何类型的数据，而且，ECMAScript数组的大小是可以动态调整的，即可以随着数据的添加自动增长以容纳新增数据。

创建数组的基本方式有两种。第一种是使用Array构造函数。

var colors = new Array();

如果预先知道数组要保存的项目数量，也可以给构造函数传递length。

var colors = new Array(20);  //length 值为20

检测数组

使用 instanceof 操作符确定某个对象是不是数组。

if (value instanceof Array){    //对数组执行某些操作}

栈方法

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  返回length
count = colors.push("black"); // 推入另一项alert(count); //3  返回length
var item = colors.pop(); // 取得最后一项alert(item); //"black"alert(colors.length); //2

队列方法

使用shift() ，它能够移除数组中的第一个项并返回该项，同时将数组长度减 1。结合使用 shift() 和 push() 方法，可以像使用队列一样使用数组。

var colors = new Array(); //创建一个数组var count = colors.push("red", "green"); //推入两项alert(count); //2count = colors.push("black"); //推入另一项alert(count); //3var item = colors.shift(); // 取得第一项alert(item); //"red"alert(colors.length); //2

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

IE7 及更早版本对 JavaScript 的实现中存在一个偏差，其 unshift() 方法总是返回 undefined 而不是数组的新长度。IE8 在非兼容模式下会返回正确的长度值。

重排序方法

reverse() 和 sort()。

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

var values = [0, 1, 5, 10, 15];values.sort();alert(values); //0,1,10,15,5

数值 5 虽然小于 10，但在进行字符串比较时， "10" 则位于 "5" 的前面，于是数组的顺序就被修改了。

因此 sort() 方法可以接收一个比较函数作为参数，以便我们指定哪个值位于哪个值的前面。

操作方法

concat()方法可以基于当前数组中的所有项创建一个新数组。

这个方法会先创建当前数组一个副本，然后将接收到的参数添加到这个副本的末尾，最后返回新构建的数组。在没有给concat()方法传递参数的情况下，它只是
复制当前数组并返回副本。

var colors = ["red", "green", "blue"];var colors2 = colors.concat("yellow", ["black", "brown"]);alert(colors); //red,green,bluealert(colors2); //red,green,blue,yellow,black,brown

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,purplealert(colors3); //green,blue,yellow

splice()

删除：可以删除任意数量的项，只需指定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()方法始终都会返回一个数组，该数组中包含从原始数组中删除的项（如果没有删除任何项，则返回一个空数组）

var colors = ["red", "green", "blue"];var removed = colors.splice(0,1); // 删除第一项alert(colors); // green,bluealert(removed); // red，返回的数组中只包含一项

removed = colors.splice(1, 0, "yellow", "orange"); // 从位置1 开始插入两项alert(colors); // green,yellow,orange,bluealert(removed); // 返回的是一个空数组
removed = colors.splice(1, 1, "red", "purple"); // 插入两项，删除一项alert(colors); // green,red,purple,orange,bluealert(removed); // yellow，返回的数组中只包含一项