ECMAScript、DOM 和 BOM 、ajax

HTML DOM 教程

HTML DOM 定义了访问和操作 HTML 文档的标准方法。

DOM 将 HTML 文档表达为树结构。

HTML DOM 树

换言之，HTML DOM 是关于如何获取、修改、添加或删除 HTML 元素的标准。

--------------------------------

HTML DOM 节点

在 HTML DOM 中，所有事物都是节点。DOM 是被视为节点树的 HTML。

DOM 节点

根据 W3C 的 HTML DOM 标准，HTML 文档中的所有内容都是节点：

• 整个文档是一个文档节点
• 每个 HTML 元素是元素节点
• HTML 元素内的文本是文本节点
• 每个 HTML 属性是属性节点
• 注释是注释节点

节点父、子和同胞

节点树中的节点彼此拥有层级关系。

父（parent）、子（child）和同胞（sibling）等术语用于描述这些关系。父节点拥有子节点。同级的子节点被称为同胞（兄弟或姐妹）。

• 在节点树中，顶端节点被称为根（root）
• 每个节点都有父节点、除了根（它没有父节点）
• 一个节点可拥有任意数量的子
• 同胞是拥有相同父节点的节点

下面的图片展示了节点树的一部分，以及节点之间的关系：

--------------------------------------------------------------

HTML DOM 方法

编程接口

可通过 JavaScript （以及其他编程语言）对 HTML DOM 进行访问。

所有 HTML 元素被定义为对象，而编程接口则是对象方法和对象属性。

方法是您能够执行的动作（比如添加或修改元素）。

属性是您能够获取或设置的值（比如节点的名称或内容）。

HTML DOM 对象 - 方法和属性

一些常用的 HTML DOM 方法：

• getElementById(id) - 获取带有指定 id 的节点（元素）
• appendChild(node) - 插入新的子节点（元素）
• removeChild(node) - 删除子节点（元素）

一些常用的 HTML DOM 属性：

• innerHTML - 节点（元素）的文本值
• parentNode - 节点（元素）的父节点
• childNodes - 节点（元素）的子节点
• attributes - 节点（元素）的属性节点

一些 DOM 对象方法

这里提供一些您将在本教程中学到的常用方法：

方法描述getElementById()返回带有指定 ID 的元素。getElementsByTagName()返回包含带有指定标签名称的所有元素的节点列表（集合/节点数组）。getElementsByClassName()返回包含带有指定类名的所有元素的节点列表。appendChild()把新的子节点添加到指定节点。removeChild()删除子节点。replaceChild()替换子节点。insertBefore()在指定的子节点前面插入新的子节点。createAttribute()创建属性节点。createElement()创建元素节点。createTextNode()创建文本节点。getAttribute()返回指定的属性值。setAttribute()把指定属性设置或修改为指定的值。

innerHTML 属性

获取元素内容的最简单方法是使用 innerHTML 属性。

innerHTML 属性对于获取或替换 HTML 元素的内容很有用

nodeName 属性

nodeName 属性规定节点的名称。

• nodeName 是只读的
• 元素节点的 nodeName 与标签名相同
• 属性节点的 nodeName 与属性名相同
• 文本节点的 nodeName 始终是 #text
• 文档节点的 nodeName 始终是 #document

注释： nodeName 始终包含 HTML 元素的大写字母标签名。

nodeValue 属性

nodeValue 属性规定节点的值。

• 元素节点的 nodeValue 是 undefined 或 null
• 文本节点的 nodeValue 是文本本身
• 属性节点的 nodeValue 是属性值

nodeType 属性

nodeType 属性返回节点的类型。nodeType 是只读的。

比较重要的节点类型有：

元素类型NodeType元素1属性2文本3注释8文档9

---------------------------

HTML DOM 访问

您能够以不同的方式来访问 HTML 元素：

• 通过使用 getElementById() 方法，  getElementById() 方法返回带有指定 ID 的元素：
• 通过使用 getElementsByTagName() 方法 ---  getElementsByTagName() 返回带有指定标签名的所有元素。
• 通过使用 getElementsByClassName() 方法

------------------------------------------------

HTML DOM - 修改

创建 HTML 内容:

    document.getElementById("p1").innerHTML    

AJAX 是一种在无需重新加载整个网页的情况下，能够更新部分网页的技术。 

---------------------

AJAX - 创建 XMLHttpRequest 对象

XMLHttpRequest 是 AJAX 的基础。 

XMLHttpRequest 对象

所有现代浏览器均支持 XMLHttpRequest 对象（IE5 和 IE6 使用 ActiveXObject）。

XMLHttpRequest 用于在后台与服务器交换数据。这意味着可以在不重新加载整个网页的情况下，对网页的某部分进行更新。

---------------------------

AJAX - 向服务器发送请求

XMLHttpRequest 对象用于和服务器交换数据 

向服务器发送请求

如需将请求发送到服务器，我们使用 XMLHttpRequest 对象的 open() 和 send() 方法：

   xmlhttp.open("GET","test1.txt",true);xmlhttp.send();  

方法描述open( method , url , async )

规定请求的类型、URL 以及是否异步处理请求。

• method ：请求的类型；GET 或 POST
• url ：文件在服务器上的位置
• async ：true（异步）或 false（同步）

send( string )

将请求发送到服务器。

• string ：仅用于 POST 请求

GET 还是 POST？

与 POST 相比，GET 更简单也更快，并且在大部分情况下都能用。

然而，在以下情况中，请使用 POST 请求：

• 无法使用缓存文件（更新服务器上的文件或数据库）
• 向服务器发送大量数据（POST 没有数据量限制）
• 发送包含未知字符的用户输入时，POST 比 GET 更稳定也更可靠

GET 请求

一个简单的 GET 请求：

   xmlhttp.open("GET","demo_get.asp",true);xmlhttp.send();  

POST 请求

一个简单 POST 请求：

   xmlhttp.open("POST","demo_post.asp",true);xmlhttp.send();  

如果需要像 HTML 表单那样 POST 数据，请使用 setRequestHeader() 来添加 HTTP 头。然后在 send() 方法中规定您希望发送的数据：

   xmlhttp.open("POST","ajax_test.asp",true);xmlhttp.setRequestHeader("Content-type","application/x-www-form-urlencoded");xmlhttp.send("fname=Bill&lname=Gates");  

方法描述setRequestHeader( header , value                )

向请求添加 HTTP 头。

• header : 规定头的名称
• value : 规定头的值

---------------------

通过 AJAX，JavaScript 无需等待服务器的响应，而是：

• 在等待服务器响应时执行其他脚本
• 当响应就绪后对响应进行处理

Async = true

当使用 async=true 时，请规定在响应处于 onreadystatechange 事件中的就绪状态时执行的函数：

   xmlhttp.onreadystatechange=function()  {  if (xmlhttp.readyState==4 && xmlhttp.status==200)    {    document.getElementById("myDiv").innerHTML=xmlhttp.responseText;    }  }xmlhttp.open("GET","test1.txt",true);xmlhttp.send();  

---------

AJAX - onreadystatechange 事件

xmlhttp.open("GET OR POST","url",true);

xmlhttp.send();

当使用 async=true 时，请规定在响应处于 onreadystatechange 事件中的就绪状态时执行的函数 

mlhttp.onreadystatechange=function()

  {

  if (xmlhttp.readyState==4 && xmlhttp.status==200)

    {

          } 

}

onreadystatechange 事件

当请求被发送到服务器时，我们需要执行一些基于响应的任务。

每当 readyState 改变时，就会触发 onreadystatechange 事件。

readyState 属性存有 XMLHttpRequest 的状态信息。

下面是 XMLHttpRequest 对象的三个重要的属性：

属性描述onreadystatechange存储函数（或函数名），每当 readyState 属性改变时，就会调用该函数。readyState

存有 XMLHttpRequest 的状态。从 0 到 4 发生变化。

• 0: 请求未初始化
• 1: 服务器连接已建立
• 2: 请求已接收
• 3: 请求处理中
• 4: 请求已完成，且响应已就绪

status

200: "OK"

404: 未找到页面

在 onreadystatechange 事件中，我们规定当服务器响应已做好被处理的准备时所执行的任务。

尽管 ECMAScript 是一个重要的标准，但它并不是 JavaScript 唯一的部分，当然，也不是唯一被标准化的部分。实际上，一个完整的 JavaScript 实现是由以下 3 个不同部分组成的： 
核心（ECMAScript） 
文档对象模型（DOM） 
浏览器对象模型（BOM）

DOM（文档对象模型）是 HTML 和 XML 的应用程序接口（API） 
“ECMAScript 可以为不同种类的宿主环境提供核心的脚本编程能力，因此核心的脚本语言是与任何特定的宿主环境分开进行规定的... .. 
简单地说，ECMAScript 描述了以下内容： 
语法 
类型 
语句 
关键字 
保留字 
运算符 
对象 
BOM（浏览器对象模型），可以对浏览器窗口进行访问和操作。

---------------------------------------------------------------- 
ECMAScript 语法 
1.区分大小写 
2.变量是弱类型：ECMAScript 中的变量无特定的类型 
3. 每行结尾的分号可有可无 
4.注释与 Java、C 和 PHP 语言的注释相同 
5.括号表示代码块 
------------------------------------------------------ 
ECMAScript 变量 
1.可以用一个 var 语句定义两个或多个变量： 

var 
test1 = "hi", test2 = "hello"; 
2. 

命名变量 

变量名需要遵守两条简单的规则： 
第一个字符必须是字母、下划线（_）或美元符号（$） 
余下的字符可以是下划线、美元符号或任何字母或数字字符 



3. 

变量声明不是必须的,最好不要这么做。

-------------------------------------------------------------------------- 
ECMAScript 关键字 
这些关键字标识了 ECMAScript 语句的开头和/或结尾。根据规定，关键字是保留的，不能用作变量名或函数名。 
下面是 ECMAScript 关键字的完整列表： 
break 
case 
catch 
continue 
default 
delete 
do 
else 
finally 
for 
function 
if 
in 
instanceof 
new 
return 
switch 
this 
throw 
try 
typeof 
var 
void 
while 
with 





注意：如果把关键字用作变量名或函数名，可能得到诸如 "Identifier Expected"（应该有标识符、期望标识符）这样的错误消息。 
------------------------------------------ 

ECMAScript 保留字 




ECMAScript 保留字 
ECMA-262 定义了 ECMAScript 支持的一套 保留字（reserved word）。 
保留字在某种意思上是为将来的关键字而保留的单词。因此保留字不能被用作变量名或函数名。

-------------------------------------------------------------------- 
ECMAScript 原始值和引用值 
变量可以存在两种类型的值，即原始值和引用值。 
原始值 
存储在栈（stack）中的简单数据段，也就是说，它们的值直接存储在变量访问的位置。 
ECMAScript 有 5 种原始类型（primitive type），即 Undefined、Null、Boolean、Number 和 String。ECMA-262 把术语 类型（type） 定义为值的一个集合，每种原始类型定义了它包含的值的范围及其字面量表示形式。 
引用值 
存储在堆（heap）中的对象，也就是说，存储在变量处的值是一个指针（point），指向存储对象的内存处。 
为变量赋值时，ECMAScript 的解释程序必须判断该值是原始类型，还是引用类型。要实现这一点，解释程序则需尝试判断 该值是否为 ECMAScript 的原始类型之一 ，即 Undefined、Null、Boolean、Number 和 String 型。由于这些原始类型占据的空间是固定的，所以可将他们存储在较小的内存区域 - 栈中。这样存储便于迅速查寻变量的值。 
ECMAScript 提供了 typeof 运算符来判断一个值是否在某种类型的范围内。可以用这种运算符判断一个值是否表示一种原始类型：如果它是原始类型，还可以判断它表示哪种原始类型 
--------------------------------------- 
ECMAScript 原始类型 
ECMAScript 有 5 种原始类型（primitive type），即 Undefined、Null、Boolean、Number 和 String。 
对变量或值调用 typeof 运算符将返回下列值之一： 
undefined - 如果变量是 Undefined 类型的 
boolean - 如果变量是 Boolean 类型的 
number - 如果变量是 Number 类型的 
string - 如果变量是 String 类型的 
object - 如果变量是一种引用类型或 Null 类型的 
1. Undefined 类型 
如前所述，Undefined 类型只有一个值，即 undefined。当声明的变量未初始化时，该变量的默认值是 undefined

2. Null 类型 
另一种只有一个值的类型是 Null，它只有一个专用值 null，即它的字面量。值 undefined 实际上是从值 null 派生来的，因此 ECMAScript 把它们定义为相等的。 
尽管这两个值相等，但它们的含义不同。undefined 是声明了变量但未对其初始化时赋予该变量的值，null 则用于表示尚未存在的对象（在讨论 typeof 运算符时，简单地介绍过这一点）。如果函数或方法要返回的是对象，那么找不到该对象时，返回的通常是 null。

3. Boolean 类型 
Boolean 类型是 ECMAScript 中最常用的类型之一。它有两个值 true 和 false （即两个 Boolean 字面量）。 
即使 false 不等于 0，0 也可以在必要时被转换成 false，这样在 Boolean 语句中使用两者都是安全的。

4. Number 类型 
ECMA-262 中定义的最特殊的类型是 Number 类型。这种类型既可以表示 32 位的整数，还可以表示 64 位的浮点数。 
直接输入的（而不是从另一个变量访问的）任何数字都被看做 Number 类型的字面量。例如，下面的代码声明了存放整数值的变量，它的值由字面量 86 定义 
var iNum = 86; 





提示： 尽管所有整数都可以表示为八进制或十六进制的字面量，但所有数学运算返回的都是十进制结果。 
对于浮点字面量的有趣之处在于，用它进行计算前，真正存储的是字符串。 
特殊的 Number 值 
几个特殊值也被定义为 Number 类型。前两个是 Number.MAX_VALUE 和 Number.MIN_VALUE，它们定义了 Number 值集合的外边界。所有 ECMAScript 数都必须在这两个值之间。不过计算生成的数值结果可以不落在这两个值之间。 
当计算生成的数大于 Number.MAX_VALUE 时，它将被赋予值 Number.POSITIVE_INFINITY，意味着不再有数字值。同样，生成的数值小于 Number.MIN_VALUE 的计算也会被赋予值 Number.NEGATIVE_INFINITY，也意味着不再有数字值。如果计算返回的是无穷大值，那么生成的结果不能再用于其他计算。 
事实上，有专门的值表示无穷大，（如你猜到的）即 Infinity。Number.POSITIVE_INFINITY 的值为 Infinity。Number.NEGATIVE_INFINITY 的值为 -Infinity。

最后一个特殊值是 NaN，表示非数（Not a Number）。NaN 是个奇怪的特殊值。一般说来，这种情况发生在类型（String、Boolean 等）转换失败时。例如，要把单词 blue 转换成数值就会失败，因为没有与之等价的数值。与无穷大一样，NaN 也不能用于算术计算。NaN 的另一个奇特之处在于，它与自身不相等，这意味着下面的代码将返回 false：

5. String 类型 
String 类型的独特之处在于，它是唯一没有固定大小的原始类型。可以用字符串存储 0 或更多的 Unicode 字符，有 16 位整数表示（Unicode 是一种国际字符集，本教程后面将讨论它）。 
字符串中每个字符都有特定的位置，首字符从位置 0 开始，第二个字符在位置 1，依此类推。这意味着字符串中的最后一个字符的位置一定是字符串的长度减 1：

字符串字面量是由双引号（"）或单引号（'）声明的。而 Java 则是用双引号声明字符串，用单引号声明字符。但是由于 ECMAScript 没有字符类型，所以可使用这两种表示法中的任何一种。

------------------------------------ 
ECMAScript 类型转换 
ECMAScript 的 Boolean 值、数字和字符串的原始值的有趣之处在于它们是伪对象，这意味着它们实际上具有属性和方法。 
Boolean 类型的 toString() 方法只是输出 "true" 或 "false"，结果由变量的值决定： 
Number 类型的 toString() 方法比较特殊，它有两种模式，即 默认模式 和 基模式 。采用默认模式，toString() 方法只是用相应的字符串输出数字值（无论是整数、浮点数还是科学计数法）, 采用 Number 类型的 toString() 方法的基模式，可以用不同的 基 输出数字，例如二进制的基是 2，八进制的基是 8，十六进制的基是 16。

转换成数字 
ECMAScript 提供了两种把非数字的原始值转换成数字的方法，即 parseInt() 和 parseFloat()。只有对 String 类型调用这些方法，它们才能正确运行；对其他类型返回的都是 NaN。

强制类型转换 
ECMAScript 中可用的 3 种强制类型转换如下： 
Boolean(value) - 把给定的值转换成 Boolean 型； 
Number(value) - 把给定的值转换成数字（可以是整数或浮点数）； 
String(value) - 把给定的值转换成字符串； 
用这三个函数之一转换值，将创建一个新值，存放由原始值直接转换成的值。这会造成意想不到的后果。 
Boolean() 函数 
当要转换的值是至少有一个字符的字符串、非 0 数字或对象时，Boolean() 函数将返回 true。如果该值是空字符串、数字 0、undefined 或 null，它将返回 false。 
Number() 函数 
Number() 函数的强制类型转换与 parseInt() 和 parseFloat() 方法的处理方式相似，只是它转换的是整个值，而不是部分值。

String() 函数- 
最后一种强制类型转换方法 String() 是最简单的，因为它可把任何值转换成字符串。 
要执行这种强制类型转换，只需要调用作为参数传递进来的值的 toString() 方法，即把 12 转换成 "12"，把 true   转换成 "true"，把 false 转换成 "false"，以此类推。 
强制转换成字符串和调用 toString() 方法的唯一不同之处在于，对 null 和 undefined 值强制类型转换可以生成字符串而不引发错误：

--------------------------------------------------------------------- 
ECMAScript 引用类型 
引用类型通常叫做类（class）, 也就是说，遇到引用值，所处理的就是对象. 
对象是由 new 运算符加上要实例化的对象的名字创建的。不过当有不止一个参数时，ECMAScript 要求使用括号。如果没有参数，如以下代码所示，括号可以省略 
Object 对象 
Object 对象自身用处不大，不过在了解其他类之前，还是应该了解它。因为 ECMAScript 中的 Object 对象与 Java 中的 java.lang.Object 相似，ECMAScript 中的所有对象都由这个对象继承而来，Object 对象中的所有属性和方法都会出现在其他对象中，所以理解了 Object 对象，就可以更好地理解其他对象。 
Object 对象具有下列属性： 
constructor 
对创建对象的函数的引用（指针）。对于 Object 对象，该指针指向原始的 Object() 函数。 
Prototype 
对该对象的对象原型的引用。对于所有的对象，它默认返回 Object 对象的一个实例。 
Object 对象还具有几个方法： 
hasOwnProperty(property) 
判断对象是否有某个特定的属性。必须用字符串指定该属性。（例如，o.hasOwnProperty("name")） 
IsPrototypeOf(object) 
判断该对象是否为另一个对象的原型。 
PropertyIsEnumerable 
判断给定的属性是否可以用 for...in 语句进行枚举。 
ToString() 
返回对象的原始字符串表示。对于 Object 对象，ECMA-262 没有定义这个值，所以不同的 ECMAScript 实现具有不同的值。 
ValueOf() 
返回最适合该对象的原始值。对于许多对象，该方法返回的值都与 ToString() 的返回值相同。 
注释：上面列出的每种属性和方法都会被其他对象覆盖。 
2. Boolean 对象 
3.Number 对象 
4.String 对象 
------------------------------------------------------ 
ECMAScript 一元运算符 
1.delete 
delete 运算符删除对以前定义的对象属性或方法的引用,如： 
var o = new Object; 
o.name = "David"; 
alert(o.name); 
//输出 
"David" 
delete 
o.name; 
alert(o.name); 
//输出 
"undefined"

2. void 
void 运算符对任何值返回 undefined。该运算符通常用于避免输出不应该输出的值，例如，从 HTML 的 <a> 元素调用 JavaScript 函数时。要正确做到这一点，函数不能返回有效值，否则浏览器将清空页面，只显示函数的结果。 
提示： 请记住，没有返回值的函数真正返回的都是 undefined。

3. 前增量/前减量运算符 (++n;--n) 
4. 后增量/后减量运算符n--;n++ 
5.一元加/减法

--------------------------------------------------------- 
ECMAScript 位运算符 
1.位运算 NOT 
位运算 NOT 由否定号（~）表示，它是 ECMAScript 中为数不多的与二进制算术有关的运算符之一。 
2. 位运算 AND 
位运算 AND 由和号（&）表示，直接对数字的二进制形式进行运算。 
3. 位运算 OR 
位运算 OR 由符号（|）表示，也是直接对数字的二进制形式进行运算。 
4. 位运算 XOR 
位运算 XOR 由符号（^）表示，当然，也是直接对二进制形式进行运算。 
5. 左移运算， 左移运算保留数字的符号位。 
6. 有符号右移运算 
有符号右移运算符由两个大于号表示（>>）。它把 32 位数字中的所有数位整体右移，同时保留该数的符号（正号或负号）。 
7. 无符号右移运算 
无符号右移运算符由三个大于号（>>>）表示，它将无符号 32 位数的所有数位整体右移。对于正数，无符号右移运算的结果与有符号右移运算一样。 
用有符号右移运算中的例子，把 64 右移 5 位，将变为 2： 
var iOld = 64; 
//等于二进制 
1000000 
var iNew = iOld >>> 5; 
//等于二进制 
10 十进制 2 

对于负数，情况就不同了。 
无符号右移运算用 0 填充所有空位。对于正数，这与有符号右移运算的操作一样，而负数则被作为正数来处理。 
--------------------------------------------------------------------- 
ECMAScript Boolean 运算符 
1.！ 
2.&& 
3.|| 
---------------------------------------------------- 
ECMAScript 乘性运算符

在处理特殊值时，ECMAScript 中的乘法/除法还有一些特殊行为： 
如果结果太大或太小，那么生成的结果是 Infinity 或 -Infinity。 
如果某个运算数是 NaN，结果为 NaN。 
Infinity 乘以 0，结果为 NaN。 
Infinity 乘以 0 以外的任何数字，结果为 Infinity 或 -Infinity。 
Infinity 乘以 Infinity，结果为 Infinity。 
--------------------------------------------------- 
某个运算数是 NaN，那么结果为 NaN。 
-Infinity 加 -Infinity，结果为 -Infinity。 
Infinity 加 -Infinity，结果为 NaN。 
+0 加 +0，结果为 +0。 
-0 加 +0，结果为 +0。 
-0 加 -0，结果为 -0。 
某个运算数是 NaN，那么结果为 NaN。 
Infinity 减 Infinity，结果为 NaN。 
-Infinity 减 -Infinity，结果为 NaN。 
Infinity 减 -Infinity，结果为 Infinity。 
-Infinity 减 Infinity，结果为 -Infinity。 
+0 减 +0，结果为 +0。 
-0 减 -0，结果为 -0。 
+0 减 -0，结果为 +0。 
某个运算符不是数字，那么结果为 NaN

-------------------------------------------------------------- 
ECMAScript 等性运算符 
ECMAScript 提供了两套等性运算符：等号和非等号用于处理原始值，全等号和非全等号用于处理对象

等号和非等号 
在 ECMAScript 中，等号由双等号（==）表示，当且仅当两个运算数相等时，它返回 true。非等号由感叹号加等号（!=）表示，当且仅当两个运算数不相等时，它返回 true。为确定两个运算数是否相等，这两个运算符都会进行类型转换。

执行类型转换的规则如下： 
如果一个运算数是 Boolean 值，在检查相等性之前，把它转换成数字值。false 转换成 0，true 为 1。 
如果一个运算数是字符串，另一个是数字，在检查相等性之前，要尝试把字符串转换成数字。 
如果一个运算数是对象，另一个是字符串，在检查相等性之前，要尝试把对象转换成字符串。 
如果一个运算数是对象，另一个是数字，在检查相等性之前，要尝试把对象转换成数字。 
在比较时，该运算符还遵守下列规则： 
值 null 和 undefined 相等。 
在检查相等性时，不能把 null 和 undefined 转换成其他值。 
如果某个运算数是 NaN，等号将返回 false，非等号将返回 true。 
如果两个运算数都是对象，那么比较的是它们的引用值。如果两个运算数指向同一对象，那么等号返回 true，否则两个运算数不等。 
重要提示： 即使两个数都是 NaN，等号仍然返回 false，因为根据规则，NaN 不等于 NaN。

全等号和非全等号 
等号和非等号的同类运算符是全等号和非全等号。这两个运算符所做的与等号和非等号相同，只是它们在检查相等性前，不执行类型转换。 
全等号由三个等号表示（===），只有在无需类型转换运算数就相等的情况下，才返回 true。 
非全等号由感叹号加两个等号（!==）表示，只有在无需类型转换运算数不相等的情况下，才返回 true。

-------------------------------------------------------------- 
ECMAScript 条件运算符 
var iMax = (iNum1 > iNum2) ? iNum1 : iNum2;

逗号运算符 
用逗号运算符可以在一条语句中执行多个运算。 
例如： 
var iNum1 = 1, iNum = 2, iNum3 = 3; 

逗号运算符常用变量声明中。 
ECMAScript 迭代语句（循环语句）

for-in 语句 
for 语句是严格的迭代语句，用于枚举对象的属性。 
for 
( 
property 
in 
expression) 
statement 

ECMAScript 标签语句 
有标签的语句 
可以用下列语句给语句加标签，以便以后调用：（类似于汇编里面的段语句。 
ECMAScript break 和 continue 语句 
break 和 continue 语句的不同之处 
break 语句可以立即退出循环，阻止再次反复执行任何代码。 
而 continue 语句只是退出当前循环，根据控制表达式还允许继续进行下一次循环。 
与有标签的语句一起使用 
break 语句和 continue 语句都可以与有标签的语句联合使用，返回代码中的特定位置。

在 ECMAScript 中，switch 语句可以用于字符串，而且能用不是常量的值说明情况： 
var BLUE = "blue", RED = "red", GREEN = "green";

switch (sColor) { 
case BLUE: alert("Blue"); 
break; 
case RED: alert("Red"); 
break; 
case GREEN: alert("Green"); 
break; 
default: alert("Other"); 
} 

=====================================

ECMAScript 函数 
函数是由这样的方式进行声明的：关键字 function、函数名、一组参数，以及置于括号中的待执行代码。 
函数如何返回值？ 
函数 sayHi() 未返回值，不过不必专门声明它（像在 Java 中使用 void 那样）。 
即使函数确实有值，也不必明确地声明它。该函数只需要使用 return 运算符后跟要返回的值即可。 
函数在执行过 return 语句后立即停止代码。因此，return 语句后的代码都不会被执行。 
如果函数无返回值，那么可以调用没有参数的 return 运算符，随时退出函数。 
-------- 
ECMAScript arguments 对象 
在函数代码中，使用特殊对象 arguments，开发者 无需明确指出参数名，就能访问它们。 
例如，在函数 sayHi() 中，第一个参数是 message。用 arguments[0] 也可以访问这个值，即第一个参数的值（第一个参数位于位置 0，第二个参数位于位置 1，依此类推）。 
因此，无需明确命名参数，就可以重写函数： 
function sayHi() { 
if ( 
arguments[0] 
== "bye") { 
return; 
}

alert(arguments[0]); 
} 

检测参数个数 
还可以用 arguments 对象检测函数的参数个数，引用属性 arguments.length 即可。

================ 
模拟函数重载 
用 arguments 对象判断传递给函数的参数个数，即可模拟函数重载：

--------------------------------------------- 
ECMAScript Function 对象（类） 
ECMAScript 的函数实际上是功能完整的对象。 
用 Function 类直接创建函数的语法如下： 
var function_name = new function( 
arg1, 
arg2, ..., 
argN,

function_body) 

在上面的形式中，每个 arg 都是一个参数，最后一个参数是函数主体（要执行的代码）。 这些参数必须是字符串。

注意： 尽管可以使用 Function 构造函数创建函数，但最好不要使用它，因为用它定义函数比用传统方式要慢得多。不过，所有函数都应看作 Function 类的实例。 
----- 
Function 对象的 length 属性 
ECMAScript 定义的属性 length 声明了函数期望的参数个数。

Function 对象的方法 
Function 对象也有与所有对象共享的 valueOf() 方法和 toString() 方法。这两个方法返回的都是函数的源代码，在调试时尤其有用。

================================== 
ECMAScript 闭包（closure） 
闭包，指的是词法表示包括不被计算的变量的函数，也就是说，函数可以使用函数之外定义的变量。 
在 ECMAScript 中使用全局变量是一个简单的闭包实例。请思考下面这段代码： 
var sMessage = "hello world";

function sayHelloWorld() { 
alert(sMessage); 
}

sayHelloWorld(); 

在上面这段代码中，脚本被载入内存后，并没有为函数 sayHelloWorld() 计算变量 sMessage 的值。该函数捕获   sMessage 的值只是为了以后的使用，也就是说，解释程序知道在调用该函数时要检查 sMessage 的值。sMessage 将在函数调用 sayHelloWorld() 时（最后一行）被赋值，显示消息 "hello world"。

复杂的闭包实例 
在一个函数中定义另一个会使闭包变得更加复杂。例如： 
var iBaseNum = 10;

function addNum(iNum1, iNum2) { 
function doAdd() { 
return iNum1 + iNum2 + iBaseNum; 
} 
return doAdd(); 
} 

这里，函数 addNum() 包括函数 doAdd() （闭包）。内部函数是一个闭包，因为它将获取外部函数的参数 iNum1 和 iNum2 以及全局变量 iBaseNum 的值。 addNum() 的最后一步调用了 doAdd()，把两个参数和全局变量相加，并返回它们的和。 
这里要掌握的重要概念是，doAdd() 函数根本不接受参数，它使用的值是从执行环境中获取的。

=================================== 
ECMAScript 面向对象技术 
面向对象术语 
对象 
ECMA-262 把对象（object）定义为“属性的无序集合，每个属性存放一个原始值、对象或函数”。严格来说，这意味着对象是无特定顺序的值的数组。 
尽管 ECMAScript 如此定义对象，但它更通用的定义是基于代码的名词（人、地点或事物）的表示。 
类 
每个对象都由类定义，可以把类看做对象的配方。类不仅要定义对象的接口（interface）（开发者访问的属性和方法），还要定义对象的内部工作（使属性和方法发挥作用的代码）。编译器和解释程序都根据类的说明构建对象。 
实例 
程序使用类创建对象时，生成的对象叫作类的实例（instance）。对类生成的对象的个数的唯一限制来自于运行代码的机器的物理内存。每个实例的行为相同，但实例处理一组独立的数据。由类创建对象实例的过程叫做实例化（instantiation）。 
在前面的章节我们提到过，ECMAScript 并没有正式的类。相反，ECMA-262 把对象定义描述为对象的配方。这是 ECMAScript 逻辑上的一种折中方案，因为对象定义实际上是对象自身。即使类并不真正存在，我们也把对象定义叫做类，因为大多数开发者对此术语更熟悉，而且从功能上说，两者是等价的。

面向对象语言的要求 
一种面向对象语言需要向开发者提供四种基本能力： 
封装 - 把相关的信息（无论数据或方法）存储在对象中的能力 
聚集 - 把一个对象存储在另一个对象内的能力 
继承 - 由另一个类（或多个类）得来类的属性和方法的能力 
多态 - 编写能以多种方法运行的函数或方法的能力 
ECMAScript 支持这些要求，因此可被是看做面向对象的。

对象的构成 
在 ECMAScript 中，对象由特性（attribute）构成，特性可以是原始值，也可以是引用值。如果特性存放的是函数，它将被看作对象的方法（method），否则该特性被看作对象的属性（property）。

========= 
ECMAScript 对象应用 
对象引用 
在前面的章节中，我们介绍了 引用类型的概念。在 ECMAScript 中，不能访问对象的物理表示，只能访问对象的引用。每次创建对象，存储在变量中的都是该对象的引用，而不是对象本身。 
对象废除 
ECMAScript 拥有无用存储单元收集程序（garbage collection routine），意味着不必专门销毁对象来释放内存。当再没有对对象的引用时，称该对象被废除（dereference）了。运行无用存储单元收集程序时，所有废除的对象都被销毁。每当函数执行完它的代码，无用存储单元收集程序都会运行，释放所有的局部变量，还有在一些其他不可预知的情况下，无用存储单元收集程序也会运行。 
把对象的所有引用都设置为 null，可以强制性地废除对象 
注意： 废除对象的所有引用时要当心。如果一个对象有两个或更多引用，则要正确废除该对象，必须将其所有引用都设置为 null。

使用晚绑定，无需检查对象的类型，只需检查对象是否支持属性和方法即可。ECMAScript 中的所有变量都采用晚绑定方法。这样就允许执行大量的对象操作，而无任何惩罚。 
====================================== 
ECMAScript 对象类型 
在 ECMAScript 中，所有对象并非同等创建的。 
一般来说，可以创建并使用的对象有三种：本地对象、内置对象和宿主对象。 
本地对象 
ECMA-262 把本地对象（native object）定义为“独立于宿主环境的 ECMAScript 实现提供的对象”。简单来说，本地对象就是 ECMA-262 定义的类（引用类型）。它们包括： 
Object 
Function 
Array 
String 
Boolean 
Number 
Date 
RegExp 
Error 
EvalError 
RangeError 
ReferenceError 
SyntaxError 
TypeError 
URIError 
内置对象 
ECMA-262 把内置对象（built-in object）定义为“由 ECMAScript 实现提供的、独立于宿主环境的所有对象，在 ECMAScript 程序开始执行时出现”。这意味着开发者不必明确实例化内置对象，它已被实例化了。ECMA-262 只定义了两个内置对象，即 Global 和 Math （它们也是本地对象，根据定义，每个内置对象都是本地对象）。 
宿主对象 
所有非本地对象都是宿主对象（host object），即由 ECMAScript 实现的宿主环境提供的对象。 
所有 BOM 和 DOM 对象都是宿主对象。 
======================== 
ECMAScript 对象作用域 
ECMAScript 只有公用作用域 
对 ECMAScript 讨论上面这些作用域几乎毫无意义，因为 ECMAScript 中只存在一种作用域 - 公用作用域。ECMAScript 中的所有对象的所有属性和方法都是公用的。因此，定义自己的类和对象时，必须格外小心。记住，所有属性和方法默认都是公用的！ 
建议性的解决方法 
许多开发者都在网上提出了有效的属性作用域模式，解决了 ECMAScript 的这种问题。 
由于缺少私有作用域，开发者确定了一个规约，说明哪些属性和方法应该被看做私有的。这种规约规定在属性前后加下划线： 
obj._color_ = "blue"; 

这段代码中，属性 color 是私有的。注意，下划线并不改变属性是公用属性的事实，它只是告诉其他开发者，应该把该属性看作私有的。 
有些开发者还喜欢用单下划线说明私有成员，例如：obj._color。

关键字 this 
this 的功能 
在 ECMAScript 中，要掌握的最重要的概念之一是关键字 this 的用法，它用在对象的方法中。关键字 this 总是指向调用该方法的对象

====================================================

ECMAScript 定义类或对象

1. 工厂方式

要解决该问题，开发者创造了能创建并返回特定类型的对象的工厂函数（factory function）。

 createCar() 函数，给它传递各个属性的默认值，而不是简单地赋予属性默认值：

function createCar(sColor,iDoors,iMpg) {  var oTempCar = new Object;  oTempCar.color = sColor;  oTempCar.doors = iDoors;  oTempCar.mpg = iMpg;  oTempCar.showColor = function() {    alert(this.color);  };  return oTempCar;}var oCar1 = createCar("red",4,23);var oCar2 = createCar("blue",3,25);oCar1.showColor();              //输出"red"oCar2.showColor();              //输出"blue" 

给 createCar() 函数加上参数，即可为要创建的 car 对象的 color、doors 和 mpg 属性赋值。这使两个对象具有相同的属性，却有不同的属性值。

前面的例子中，每次调用函数 createCar()，都要创建新函数 showColor()，意味着每个对象都有自己的 showColor() 版本。而事实上，每个对象都共享同一个函数。

有些开发者在工厂函数外定义对象的方法，然后通过属性指向该方法，从而避免这个问题：

  functionshowColor() {  alert(this.color);}function createCar(sColor,iDoors,iMpg) {  var oTempCar = new Object;  oTempCar.color = sColor;  oTempCar.doors = iDoors;  oTempCar.mpg = iMpg;  oTempCar.showColor= showColor;  return oTempCar;}var oCar1 = createCar("red",4,23);var oCar2 = createCar("blue",3,25);oCar1.showColor();              //输出"red"oCar2.showColor();              //输出"blue" 

在上面这段重写的代码中，在函数 createCar() 之前定义了函数 showColor()。在 createCar() 内部，赋予对象一个指向已经存在的 showColor() 函数的指针。从功能上讲，这样解决了重复创建函数对象的问题；但是从语义上讲，该函数不太像是对象的方法。

所有这些问题都引发了 开发者定义的构造函数的出现。

2.  构造函数方式

function Car(sColor,iDoors,iMpg) {  this.color= sColor;  this.doors= iDoors;  this.mpg= iMpg;  this.showColor= function() {    alert(this.color);  };}var oCar1 = newCar("red",4,23);var oCar2 = newCar("blue",3,25);      

首先在构造函数内没有创建对象，而是使用 this 关键字。使用 new 运算符构造函数时，在执行第一行代码前先创建一个对象，只有用 this 才能访问该对象。然后可以直接赋予 this 属性，默认情况下是构造函数的返回值（不必明确使用 return 运算符）。

现在，用 new 运算符和类名 Car 创建对象，就更像 ECMAScript 中一般对象的创建方式了。

3. 原型方式

该方式利用了对象的 prototype 属性，可以把它看成创建新对象所依赖的原型。

这里，首先用空构造函数来设置类名。然后所有的属性和方法都被直接赋予 prototype 属性。

function Car() {}Car.prototype.color = "blue";Car.prototype.doors = 4;Car.prototype.mpg = 25;Car.prototype.showColor = function() {  alert(this.color);};var oCar1 = new Car();var oCar2 = new Car();      

原型方式的问题

原型方式看起来是个不错的解决方案。遗憾的是，它并不尽如人意。

首先，这个构造函数没有参数。使用原型方式，不能通过给构造函数传递参数来初始化属性的值，因为 Car1 和 Car2 的 color 属性都等于 "blue"，doors 属性都等于 4，mpg 属性都等于       25。这意味着必须在对象创建后才能改变属性的默认值，这点很令人讨厌，但还没完。真正的问题出现在属性指向的是对象，而不是函数时。函数共享不会造成问题，但对象却很少被多个实例共享。请思考下面的例子：

function Car() {}Car.prototype.color = "blue";Car.prototype.doors = 4;Car.prototype.mpg = 25;Car.prototype.drivers= new Array("Mike","John");Car.prototype.showColor = function() {  alert(this.color);};var oCar1 = new Car();var oCar2 = new Car();oCar1.drivers.push("Bill");alert(oCar1.drivers);   //输出"Mike,John,Bill"alert(oCar2.drivers);   //输出"Mike,John,Bill"   

上面的代码中，属性 drivers 是指向 Array 对象的指针，该数组中包含两个名字 "Mike" 和 "John"。由于 drivers 是引用值，Car 的两个实例都指向同一个数组。这意味着给 oCar1.drivers 添加值 "Bill"，在 oCar2.drivers 中也能看到。输出这两个指针中的任何一个，结果都是显示字符串 "Mike,John,Bill"。

由于创建对象时有这么多问题，你一定会想，是否有种合理的创建对象的方法呢？答案是有，需要联合使用构造函数和原型方式。

4. 混合的构造函数/原型方式

联合使用构造函数和原型方式，就可像用其他程序设计语言一样创建对象。这种概念非常简单，即用构造函数定义对象的所有非函数属性，用原型方式定义对象的函数属性（方法）。结果是，所有函数都只创建一次，而每个对象都具有自己的对象属性实例。

我们重写了前面的例子，代码如下：

function Car(sColor,iDoors,iMpg) {  this.color = sColor;  this.doors = iDoors;  this.mpg = iMpg;  this.drivers = new Array("Mike","John");}Car.prototype.showColor = function() {  alert(this.color);};var oCar1 = new Car("red",4,23);var oCar2 = new Car("blue",3,25);oCar1.drivers.push("Bill");alert(oCar1.drivers);   //输出"Mike,John,Bill"alert(oCar2.drivers);   //输出"Mike,John"   

现在就更像创建一般对象了。所有的非函数属性都在构造函数中创建，意味着又能够用构造函数的参数赋予属性默认值了。因为只创建 showColor() 函数的一个实例，所以没有内存浪费。此外，给 oCar1 的 drivers 数组添加 "Bill" 值，不会影响到 oCar2 的数组，所以输出这些数组的值时，oCar1.drivers 显示的是 "Mike,John,Bill"，而 oCar2.drivers 显示的是 "Mike,John"。因为使用了原型方式，所以仍然能利用 instanceof 运算符来判断对象的类型。

这种方式是 ECMAScript 采用的主要方式，它具有其他方式的特性，却没有他们的副作用。不过，有些开发者仍觉得这种方法不够完美。

5. 动态原型方法

动态原型方法的基本想法与混合的构造函数/原型方式相同，即在构造函数内定义非函数属性，而函数属性则利用原型属性定义。唯一的区别是赋予对象方法的位置。下面是用动态原型方法重写的 Car 类：

function Car(sColor,iDoors,iMpg) {  this.color = sColor;  this.doors = iDoors;  this.mpg = iMpg;  this.drivers = new Array("Mike","John");    if (typeofCar._initialized == "undefined") {    Car.prototype.showColor = function() {      alert(this.color);    };            Car._initialized= true;  }}          

直到检查 typeof Car._initialized 是否等于 "undefined" 之前，这个构造函数都未发生变化。这行代码是动态原型方法中最重要的部分。如果这个值未定义，构造函数将用原型方式继续定义对象的方法，然后把 Car._initialized 设置为 true。如果这个值定义了（它的值为 true 时，typeof 的值为 Boolean），那么就不再创建该方法。简而言之，该方法使用标志（_initialized）来判断是否已给原型赋予了任何方法。该方法只创建并赋值一次，传统的 OOP 开发者会高兴地发现，这段代码看起来更像其他语言中的类定义了。