网页中的JavaScript

变量的声明和赋值

var count;定义变量

count = 5;赋值

var” － 用于声明变量的关键字

“count” － 变量名

同时声明和赋值变量

var count = 10;

声明多个变量

var x, y, z = 10;

运算符号

运算符对一个或多个变量或值（操作数）进行运算，并返回一个新值

根据所执行的运算，运算符可分为以下类别：

算术运算符 +、-、 * 、 / 、%、++、--、-(求反)

比较运算符 ==、!=、>、>=、<、<=

逻辑运算符 &&、||、！

逻辑控制语句

if条件语句

if(条件) { //JavaScript代码; } else { //JavaScript代码; }

switch多分支语句

switch (表达式) { case 常量1 : JavaScript语句1; break; case 常量2 : JavaScript语句2; break; ... default : JavaScript语句3; }

for、while循环语句

for(初始化; 条件; 增量) { 语句集; } while(条件) { 语句集; }

注释

单行注释以 // 开始，以行末结束

例如： <SCRIPT language=“javascript”> //表示JavaScript代码的开始

多行注释以 /* 开始，以 */ 结束，符号 /*…… */ 指示中间的语句是该程序中的注释。

例如： /* helloWorld.html 2007-9-29 第一个JavaScript程序 */

类型转换

parseInt (String) 将字符串转换为整型数字

如: parseInt (“86”)将字符串“86”转换为整型值86

parseFloat(String) 将字符串转换为浮点型数字

如: parseInt (“34.45”)将字符串“34.45”转换为浮点值34.45

2、数据类型

与其他C++、Java等强类型语言不同，JavaScript是一种弱类型的语言，因此当你定义变量时不需要指定变量的数据类型，变量可以存储任何类型的值，而不受值的数据类型限制。但是数据类型对于任何语言来说都是很重要的。如果说语句是语言的结构，数据类型则是语言的血脉，算法和设计思想则是语言的灵魂。 在JavaScript中，数据存在两种截然不同的存储方式。其中一种是直接存储数据，称为值类型数据；另一种是存储数据的空间地址来间接保存数据，称为引用型数据（也称为指针型数据）。不同类型的数据，它们的行为方式存在很大的不同。如果要准确处理数据，需要读者对这两种类型的数据有比较深刻的理解。

数值

JavaScript语言包含三种基本的数据类型：数值、字符串和布尔型。下面我们分别进行讲解。数值是所有语言的最基本数据类型。对于JavaScript来说，数值是不区分整型和浮点数，所有数值都为浮点型数值来表示。 除了基本的数值之外，JavaScript还提供了特殊的数值，Number对象只读属性常量。

运算符	数据类型	优先级	结合性
Infinity	无穷大		非数值
Number.MAX_VALUE	可表示的最大数值	Number.MIN_VALUE	可表示的最小数值
Number.NaN	非数值	Number.POSITIVE_INFINITY	正无穷大
Number.NEGATIVE_INFINITY	负无穷大

字符串

字符串也是一种基本数据类型。它由Unicode字符、数字、标点符号等组成的序列，一般字符处必须使用单引号或双引号包括起来。单引号中可以包含双引号，双引号中也可以包含单引号。所有字符应该在同一行内书写。

布尔型

布尔型数据是最简单，也是最常用的一种类型，它只包括2个常量值，即true和false，表示逻辑的真与假。如果把布尔型常量转换为数值，则true为1，而false为0。

null和undefined

在JavaScript中关键字null表示空值的意思，它表示对象为空，或者变量没有引用任何对象。如果当一个变量的值为null，则表明它的值不是有效的对象、数组、数值、字符串和布尔型等。如果使用alert(typeof(null))来检测null值的类型，则返回object，说明它是一个对象类型。 而undefined与null不同，它表示无值的意思，并且具有独一无二的类型，它区别任何对象、数组、数值、字符串和布尔型。alert(typeof(undefined))的返回值为undefined。

其他数据类型

除了上面介绍的3中基本的数据类型外，JavaScript还提供了各种复杂的数据类型。这类数据一般通过指针引用数据在内存中的位置，故称为引用型数据。引用类型的数据包括：数组、对象和函数等。有关这些复杂数据结构，我们将在下面各节中进行详细讲解。

3、函数

从某种意义上来看，JavaScript是一种函数式编程，话句话说就是JavaScript语言以函数为核心进行编程。如果随意打开一个JS文件或者包含JavaScript脚本的页面，你都能够看到函数在整个代码中的分量。可以毫不夸张的说，要精通JavaScript语言，必须先精通函数的应用。

定义函数

使用函数的第一步当然是要定义函数，定义函数的方法有两种： 方法一，使用function语句声明函数，此时函数被视为一种静态的方法。 方法二，通过Function对象来构造函数，此时函数被视为一种动态对象。 使用function来定义函数有两种方式： //方式1：命名函数 function f(){ return "Hello,World！"; } //方式2：匿名函数 var f = function(){ return "Hello,World！"; }

创建函数 function 函数名( 参数1,参数2，… ) { 语句; } 调用函数 函数调用一般和表单元素的事件一起使用，调用格式为： 事件名＝“函数名” ;

定义函数

命名函数的方法也被称为声明式函数，而匿名函数的方法也被称为引用式函数或者函数表达式，也就是说把函数看做一个复杂的表达式，并把表达式赋予给变量f。习惯上，人们更喜欢把命名式定义的函数称为函数常量，而把匿名函数称为函数对象，把引用了函数对象的变量称为函数引用。

使用Function对象构造函数的示例如下： var f = new Function("this.name = 'Hello，World！'"); var a = new f(); alert(a.name); 在上面代码中，首先构造一个Function对象的实例（对象），并初始化函数的内容，然后再把该函数实例f引用并赋值给变量a，最后调用该函数的name属性。 在实际开发中，使用function定义函数要比Function对象构造函数快得多、方便得多。Function仅用于某些动态要求很高的特殊场合。但是不管采用那种方式，JavaScript的函数都是Function对象的一个实例，因此有人也把Function对象称为函数模板或者元类。

调用函数

调用函数使用小括号运算符来实现。在括号运算符内部可以包含多个参数列表，参数之间通过逗号进行分隔。例如，在下面这个简单示例中使用小括号调用函数f，并把返回值传递给alert()方法。 function f(){ return "Hello,World！"; } document.write(f()); 一个函数可以包含多个return语句，但是在调用函数时一般只有一个return语句被执行，且该return语句后面的表达式的值作为函数的返回值返回。当然函数的返回值没有类型限制，它可以返回任意类型的值。

函数的参数

参数包括形参和实参。 所谓形参就是在定义函数时，传递给函数的参数，由于它仅是一个代词，因此被称为形参，即形式上参数。当函数被调用时，会传给函数实际的参数，这些参数被称为实参。例如，在下面这个函数中，参数a和b就是形参，而调用函数中的23和34就是实参。 function add(a,b) { return a+b; } alert(add(23,34)); 函数的形参没有限制，可以包括零个或多个。函数形参的数量可以通过函数的length属性获取。例如，针对上面函数可以使用下面语句读取函数的形参个数： alert(add.length);

函数的参数

在正常情况下，函数的形参和实参在数量是相同的，但是JavaScript没有硬性规定两者必须对应。如果形参数大于实参数，则多出的形参值为undefined；相反如果实参数大于形参数，则多出的实参就无法被形参标识符访问，从而被忽略掉。例如，针对上面的函数示例，你可以输入下面实参进行调用： alert(add(2,3,4)); 则将忽略第3个实参的值，最后提示的结果为5。同样，如果输入下面实参进行调用： alert(add(2)); 由于实参仅为一个，而形参为两个。于是，系统就用undefined值来代替，任何与undefined值进行运算的结果都将返回NaN。

函数的参数

为了方便用户对于函数参数的跟踪和控制，JavaScript还提供了一个Arguments数据集合（对象），利用该集合对象可以快速操纵函数的实参。使用arguments.length可以获取函数实参的个数，利用该集合的下标可以准确获取实际传递给函数的每个参数值。

函数常量

在实际开发中函数常被当作数据来进行处理。你可以把函数视为一个值赋予给变量，或者作为一个参数传递给另一个函数，这也是函数式编程的一个重要特征。 匿名函数 匿名函数就是没有名称的函数。当只需要一次性函数时，使用匿名函数是一个不错的选择，这样就不会直接把函数存放在内存中，因此使用匿名函数会更加有效率。例如，在下面示例中匿名函数被调用之后，被赋予给变量z，然后提示z变量的返回值。 var z = function(x, y) { return (x + y) / 2; }(23, 35); alert(z);

函数常量

函数作为值 函数实际也是一种结构复杂数据，因此你可以把它作为值赋予给其他变量。例如，在下面这个示例中，把函数当作一个值赋予给变量a，然后利用小括号来调用这个新实例化的函数变量。 var a = function(x,y) { return (x+y)/2; } alert( a(12,33) );

函数常量

函数作为参数 函数作为值可以进行传递，因此你可以把函数作为参数传递给一个函数，也可以作为返回值。通过这种方式增强了函数的抽象能力和灵活程度。

函数常量

函数作为表达式 函数既然可以当作值来使用，因此也可以参与到表达式运算中。例如，对于下面这个简单的函数： var a = function(x) { alert(x); } a(50); 我们可以直接使用表达式来编写： (function(x) { alert(x); })(50); 这样一看是不是更简洁、直观。其中第1个小括号运算符包含的是一个匿名函数，第2个小括号调用第1个小括号包含的函数，并传递参数和返回值。

4、JavaScript中的对象

对象（Object）是面向对象编程的核心概念。所谓对象就是已经命名的数据集合，也是一种比数组更复杂的一种数据结构。在JavaScript中对象是由new运算符生成，生成对象的函数被称为类或者构造函数，习惯上称之为对象类型。生成的对象被称为类的对象实例，简称为对象。例如： var o = new Object(); //构造原型对象 var date = new Date(); //构造日期对象 var ptn = new RegExp("ab+c","i"); //构造正则表达式对象 对象包含属性、方法和各种标识符。你可以通过点号运算符（.）来访问对象的属性，也可以通过集合运算符（[]）来访问对象的属性，例如，a.x等价于a[" x "]。对象的方法可以像普通的方法一样被调用，同时可以使用关键字this来代表当前对象，例如，a.x等价于this.x。这里的this代词总是指向真正调用这个方法的对象。

对象的属性和方法

在JavaScript中，Object对象是所有对象的父类。所有JavaScript核心对象必须拥有Object类的原始属性和方法。 constructor属性 它是构造函数（即对象类）本身的引用，因此常用它来准确识别运行时对象的类型，这犹如HTML中标签的id属性。

对象的属性和方法

toString()方法 该方法能够返回对象的字符串表示。当在字符串环境中使用对象时，JavaScript系统就会调用toString()方法把对象转换成字符串。例如，在下面这个示例中，定义数组对象test[]，然后把数组第3个元素赋予给变量对象o，然后调用toString()方法把对象o转换为字符串，并用typeof()方法获取转换后的对象的数据类型，则返回为string类型。 <script language="javascript" type="text/javascript"> var test = new Array(1,2,3,4) var o = test[2]; document.write(typeof(o.toString())); </script>

对象的属性和方法

valueOf()方法 valueOf()方法能够返回对象的原始值（如果存在），对于类型为Object的对象，该方法只返回自身。例如，在下面这个示例中，返回的就不是string类型，而是number类型。因为valueOf()方法仅获取o对象的值，而不是对象本身。 <script language="javascript" type="text/javascript"> var test = new Array(1,2,3,4) var o = test[2]; document.write(typeof(o.valueOf())); </script>

增加和删除对象属性

为对象增加属性的方法有很多种。例如，使用点语法来增加。 var o = new Object(); o.x = 50; o.y = 100; 或者使用大括号来增加： var o = { x:50, y:100 }

增加和删除对象属性

增加多组属性，则可以使用下面方法： var a = new Array(2); a[0] = new Object(); a[0].x = 10; a[0].y = 20; a[1] = new Object(); a[1].x = 20; a[1].y = 30; a[2] = new Object(); a[2].x = 30; a[2].y = 40; 或者： var os = [ {x:10,y:20}, {x:20,y:30}, {x:30,y:40} ];

增加和删除对象属性

使用构造函数来增加属性也很方便，代码如下： function f(x,y){ this.x = x; this.y = y; } var o = [new f(10,20),new f(20,30),new f(40,50)];

增加和删除对象属性

删除属性可以使用delete运算符。例如： delete o.x; 属性被删除之后，在对象中就不会存在该属性的空间。由于一般对象的属性都是比较固定的，建议不要随意上删除对象的属性。

销毁对象

在JavaScript中要销毁对象，必须先清除对象的所有外部引用。例如，在下面这个示例中如果要销毁对象a，则需要清除对象b和c。 var a = new Array(1,2) var b = a; var c = b; 清除对象引用的方法是设置它们的值为null。代码如下： a = null; b = null; c = null; 注意：要清楚delete运算符与对象注销是两个不同的概念，使用时应注意区别。

内置对象

JavaScript提供了丰富的内置对象，除了Object基本对象之外，还包括Math对象、Date对象、Error对象、Array对象、String对象和RegExp对象。其中Array对象、String对象和RegExp对象比较实用，对于初学者来说可能会感觉操作起来会很复杂。我们将在下面章节分别进行讲解，JavaScript内置对象的详细说明和使用可以参阅相关JavaScript参考手册。

1、JavaScript中的数组

数组（Array）就是一组数据的集合。集合为数据存储提供了有序的物理空间，同时也提供了一组数据处理的功能。在JavaScript中，数组与对象是两种最重要的引用类型的数据，在复杂脚本中数组的实际应用价值是非常高的，它拥有众多方法和属性，具有强大的数据处理能力，很多时候被用作数据周转或暂寄的空间。

定义数组

定义数组通过构造函数Array()和运算符new来实现。具体实现方法如下： 方法一，定义空数组： var a = new Array(); 通过这种方式定义的数组是一个没有任何元素的空数组。 方法二，定义带有参数的数组： var a = new Array(1,2,3,"4","5"); 数组中每个参数都表示数组的一个元素值，数组的元素没有类型限制。你可以通过数组下标来定位每个元素，操作数组的值；通过数组的length属性确定数组的长度。 方法三，定义指定长度的空数组： var a = new Array(6); 采用这种方式定义的数组拥有指定的元素个数，但是没有为元素初始化赋值，这时它们的初始值都是undefined。

定义数组时，也可以省略new运算符，直接使用Array()函数来实现，这时Array()就不是构造函数了。例如，下面这两个句子的功能是相同的。 var a = new Array(6); var a = Array(6); 方法四，定义数组常量： var a = [1,2,3"4","5"]; 使用数组常量来定义数组要比使用Array()函数定义数组速度要快，操作更方便。

存取数组元素

使用[]运算符可以存取数组元素的值。在方括号左边是数组的引用，方括号内是非负整数值的表达式。例如，通过下面方式可以读取数组中第3个元素的值，即显示为“3“。 var a = [1,2,3,"4","5"]; alert(a[2]); 通过下面方式可以修改元素的值： var a = [1,2,3,"4","5"]; a[2]=2; alert(a[2]);

数组的存取和增删

JavaScript为数组对象提供了众多方法，灵活使用这些方法可以提高你的开发水平。利用数组的length属性和数组下标，可以遍历数组元素，从而实现动态控制数组元素。例如，在下面示例中通过for语句遍历数组元素，并把数组元素输出显示出来（如图14.27所示）。 var str = ""; var a = [1, 2, 3, 4, 5]; for(var i = 0 ; i < a.length; i ++ ){ str += a[i] + ","; } document.write(a + "<br />"); document.write(str);

数组的大小不是固定的，你可以随时增加和删除数组元素。

实现的方法如下：

方法一，通过改变数组的length属性来实现。 var a = [1, 2, 3, 4, 5]; a.length = 4; document.write(a); 在上面示例中，我们可以看到当改变数组的长度时，会自动在数组的末尾增加或删除元素，以实现改变数组的大小。另外，使用delete运算符也可以删除数组元素的值，但是不能够删除数组元素，也不会改变length属性的值。

方法二，使用push()和pop()方法来操作数组。它们把数组看作如同堆栈类型的数据结构，这种结构的特点就是先出后进。使用push()方法可以在数组的末尾插入一个或多个元素，而使用pop()方法可以依次把它们从数组中推出去。例如： var a = []; //定义一个空数组 a.push(1,2,3); //得到数组a[1,2,3] a.push(4,5); //得到数组a[1,2,3,4,5] a.pop(); //得到数组a[1,2,3,4]

方法三，使用unshift()和shift()方法。这也是一对堆栈方法，但是它们作用于数组的头部。与push()和pop()方法操作类似。例如： var a = []; //定义一个空数组 a.unshift(1,2,3); //得到数组a[1,2,3] a.unshift(4,5); //得到数组a[4,5,1,2,3] a.shift(); //得到数组a[5,1,2,3] 方法四，使用splice()方法。该方法是一个通用删除和插入元素的方法，它可以在数组指定的位置开始删除或插入元素，因此该方法可以包含3个参数。第1个参数指定插入的起始位置，第2个参数指定要删除元素的个数，第3个参数开始表示插入的具体元素。例如，在下面这个示例中，splice()方法从第2个元素后开始截2个元素，然后把这个截取的新子数组（[3,4]）赋予给变量b，而原来的数组a的值为[1,2,5,6]。 var a = [1,2,3,4,5,6]; var b = a.splice(2,2); document.write(a + "<br />"); document.write(b);

数组高级操作

把数组转换为字符串 这是一种比较常见的操作，因为我们经常需要把字符串劈开为一组数组，或者把数组合并为字符串。实现这样的操作可以借助Array对象的join()方法来实现。例如，在下面这个示例中join()方法使用参数提供的连字符把数组a中的元素连接在一起，生成一个字符串。如果join()方法不提供参数，则默认以逗号连接每个元素。 var a = [1,2,3,4,5]; var a = a.join("-"); document.write("a类型 = " + typeof(a)+"<br />"); document.write("a的值 = " + a);

把字符串折分成数组(split). 如： <script type="text/javascript"> var str="a,b,c"; var arry = str.split(","); alert(arry.length); //output: 3; </script>

转换数组元素的排列顺序 使用reverse()方法可以颠倒数组元素的顺序。例如，在下面这个示例中reverse()方法把数组[1,2,3,4,5]元素的顺序调整为[5,4,3,2,1]。当然该方法是在原数组基础上进行操作的，不会新建数组。 var a = [1,2,3,4,5]; var a = a.reverse(); document.write(a);

数组元素排序 sort()方法能够对于数组中的元素进行排序，排序的方法通过其参数来决定。这个参数是一个比较两个元素值的闭包。如果省略参数，则sort()方法将按默认的规则对数组进行排序。例如： var a = [3,2,5,1,4]; var b = a.sort(); 则b为[1,2,3,4,5]。

连接数组 concat()方法能够把该方法中的参数追加到指定数组中，形成一个新的连接数组。例如： var a = [1,2,3,4,5]; var b = a.concat(4,5); document.write(b); 上面示例将返回新数组[1,2,3,4,5,4,5]。如果concat()方法中的参数包含数组，则把数组元素展开添加到数组中。例如： var a = [1,2,3,4,5]; var b = a.concat([4,5],[1,[2,3]]); document.write(b); 则上面示例将返回数组[1,2,3,4,5,4,5,1,2,3]。

截取子数组 slice()方法将返回数组中指定的片段，所谓片段就是数组中的一个子数组。该方法包含两个参数，它们指定要返回子数组在原数组中的起止点。例如，在下面示例中将返回数组a中第3个元素到第6个元素前面的3个元素组成的子数组（即[3,4,5]）。 var a = [1,2,3,4,5,6,7,8,9]; var b = a.slice(2,5); document.write(b); 请注意，slice()方法的第1个参数指定的元素是被截取的范围之内，而第2个参数指定的元素不被截取。