JavaScript高级程序设计（第3版）学习笔记 概述
在JavaScript面世之初，没有人会想到它会被应用的如此广泛，也远比一般人想象中的要复杂强大的多，在我自己学习的过程中，曾经有过多次震撼，只是常常没有过多久，很多美轮美奂的用法就又模糊起来，希望通过对JavaScript高级程序设计（第3版）的专题学习笔记，能够较为系统的将基础知识梳理一次，也能够将自己平常学习与工作过程中遇到的一些美妙用法记录下来，便于自己再次学习，当然，也希望可以给有需要的朋友们一些力所能及的帮助。
相关术语
先简要说一下和JavaScript相关的一些背景术语，就不详细讨论JavaScript的历史了，想了解的朋友可以参考原书。
- ECMA：欧洲计算机制造商协会（Standard ECMA-262European Computer Manufacturers Association）。
- TC39：ECMA第39号技术委员会（Technical Committee#39），由来自一些关注脚本语言发展的公司的程序员组成，负责制定一种通用、跨平台、供应商中立的脚本语言。
- ECMAScript：由ECMA制定，在ECMA-262中定义的脚本语言标准。ECMAScript只是一个脚本语言标准，你尽可以在自己的环境中取实现它，这个环境，就称为ECMAScript的宿主环境，Web浏览器可以说是ECMAScript目前最重要的宿主环境了，而不同的Web浏览器，对ECMAScript标准的支持也不尽相同。除Web浏览器，Adobe ActionScript也实现了ECMAScript。一般的宿主环境，除了实现ECMAScript标准，也会有各自的扩展，以便与环境更好的交互。
- ES3、ES5：ECMAScript目前最新的版本是5.1版，发布于2011年7月，可以从其官方网站免费下载。最主要的两个版本是第3版和第5版，分别简称为ES3和ES5，目前五大浏览器（IE、Firefox、Chrome、Safari、Opera）都已经开始不同程度的支持ES5了，但目前在Web浏览器上兼容性最好的还是第3版。介于向后兼容和安全上的考虑，第5版提供了普通和严格两种模式，后面会再讨论相关内容。
- LiveScript、JavaScript、JScript：LiveScript是Netscape最初开发JavaScript时的名称，在发布时，为了赶上Java的时髦，临时修改为JavaScript了，而JScript则是微软为了防止版权冲突而给自己的脚本语言起的名称。对于开发者来说，他们都只是ECMAScript的实现。一般来说，JavaScript的除了实现ECMAScript外，还会包括针对浏览器的扩展（BOM：浏览器对象模型）和针对XML/HTML API的扩展（DOM：文档对象模型）。
- DOM：文档对象模型（Document Object Model），DOM标准由负责制定WEB通信标准的W3C（World Web Consortium，万维网联盟）制定。DOM并非针对JavaScript的，很多别的语言也都实现了DOM。目前DOM共有三级标准（DOM1、DOM2、DOM3），有时，也将DOM标准之前称为DOM0级，现代浏览器几乎全部支持DOM2级标准，也部分支持DOM3级标准了。
- BOM：浏览器对象模型（Browser Object Model）。
使用JavaScript
在HTML中使用JavaScript的方式主要有：
- 使用<script>标签元素引入外部文件（推荐），将代码写入外部文件中。
- 使用<script>标签元素嵌入JavaScript代码。
- 直接在HTML中嵌入JavaScript代码，比如在HTML元素中的事件处理程序。
<script>标签元素：
| 属性 | 是否必填 | 适用范围 | 说明 |
| async | 可选 | 外部文件 | 表示应该立即下载脚本，但不应妨碍页面中的其它操作，比如下载资源或其它脚本文件 |
| charset | 可选 | 外部文件 | 表示通过src指定的代码的字符集 |
| defer | 可选 | 外部文件，IE4-7也支持嵌入代码 | 表示脚本可以延迟到文档完全解析和显示之后再执行 |
| language | 可选（已废弃） | 原用于表示编写代码的脚本语言 | |
| src | 可选，使用外部文件时为必填选项 | 外部文件 | 表示包含要执行的外部文件 |
| type | 可选，默认text/javascript | 可以看成是language的替代属性，表示编写代码使用的脚本语言的内容类型（也称为MIME类型）。 |
说明：
（1）外部文件
A、在XHTML文档中，导入外部文件时，可以使用简写方式<script/>但是在HTML中只能<script></script>。
B、导入外部文件时，src属性是必须的，这个时候嵌入在<script></script>中的代码（如果有）会被忽略。
C、src属性也可以指定来自外部域的JavaScript文件，这一点让<script>元素异常强大，也备受争议，因为可能会让人恶意注入脚本。
D、外部文件只需要包含<script></script>中的代码即可，不需要包括<script>元素本身；外部文件一般扩展名为.js，但这不是强制的。
（2）在<script>元素中内嵌代码时，只需要指定type属性，但代码中不能出现</script>字符串，否则会解析出错。例如：
代码如下:
<script type="text/javascript">
//document.writeln('</script>');会将字符串中的</script>作为前面的标签结束符来解析，从而出现异常
document.writeln('</scr'+'ipt>');//通过将</script>分开，从而避免作为<script>的结束标签解析
</script>
（3）关于type属性，虽然text/javascript和java/ecmascript都已经不被推荐使用，但一直以来使用的都还是test/javascript，实际上，服务器在传送JavaScript文件时使用的MIME类型通常是application/x-javascript，但在type中设置这个值可能导致脚本被忽略，另外，在非IE浏览器中还可以使用application/javascript和application/ecmascript。type如果没有指定，默认值为text/javascript。
（4）只要不包含async和defer，浏览器会按照<script>在页面中出现的顺序依次解析；设置了defer时，会立即下载<script>元素，但是延迟执行，在规范中，要求多个含defer属性的脚本顺序执行且在DOMContentLoaded事件前执行，但是在实现中不一定满足这些要求；在HTML5中添加了async属性，和defer类似，也只是适用于外部文件，告诉浏览器立即下载文件，但延迟执行，不同的是，多个含async的脚本即便在规范中也没有规定执行的顺序，异步脚本再load事件前执行，但可能在DOMContentLoaded之前或之后执行。
（5）在阅读之前的代码或者用一些IDE生成代码时，常常可以看到下面的结构：
代码如下:
<script type="text/javascript">
//<![CDATA[
// 这里首先是以//开始的JavaScript注释
// 然后<![CDATA[...]]>结构是XHTML（XML）的一个特殊区域，区域内的文本不需要做任何解析，以防止XHTML将代码中的类似小于号“<”的这种特殊符号解析为元素标签
// 若不使用CDATA结构，则需要转义成相应实体，比如小于号（<）需要使用（<）
// 对于不兼容XHTML的，由于最开始的//注释，也能够平稳退化
//]]>
</script>
一些常用的HTML转义：
| 显示 | 说明 | 实体名称 | 实体编号 |
| 半方大的空白 | |||
| 全方大的空白 | |||
| 不断行的空白 | |||
| < | 小于 | < | < |
| > | 大于 | > | > |
| & | &符号 | & | & |
| " | 双引号 | " | " |
有些不支持JavaScript的浏览器，可以将JavaScript代码包含在一个HTML注释中（由于所有主流浏览器均支持JavaScript，所以不再推荐使用）：
<script><!--
//--></script>
对于一些老旧浏览器或者禁用了JavaScript的浏览器，还可以使用<noscript></noscript>元素来呈现相关的说明。
文档模式
在IE5.5中开始引入文档模式的概念，通过使用通过文档类型（doctype）切换实现的，最初包括混杂模式（quirks mode）和标准模式（standards mode），混杂模式让IE的行为与包括非标准特性的IE5相同，标准模式则让IE的行为更接近标准行为。在IE引入文档模式之后，其他浏览器也纷纷仿效。之后，IE又提出一种所谓准标准模式（almost standards mode），这种模式下的浏览器特性有很多是符合标准的，但也不尽然。所有浏览器默认开启混杂模式。
<!-- HTML 4.01 严格型-->
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<!-- XHTML 1.0 严格型-->
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<!-- HTML5 -->
<!DOCTYPE html>
<!-- HTML 4.01 过渡型-->
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<!-- HTML 4.01 框架集型-->
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 FrameSet//EN" "http://www.w3.org/TR/html4/frameset.dtd">
<!-- XHTML 1.0 过渡型-->
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<!-- XHTML 1.0 框架集型-->
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 FrameSet//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">
参考书籍
[1]Professional JavaScript for Web Developers 3rd Edition：JavaScript高级程序设计（第3版）[美]Nicholas C.Zakes 著 李松峰 曹力译 人民邮电出版社。
相关推荐
-
JavaScript高级程序设计 事件学习笔记
第12章 事件 1.事件流 1.1事件冒泡(IE事件流) □事件冒泡(event bubbling),即事件开始时由最具体的元素(文档中嵌套层次最深的那个节点)接受,然后逐级向上传播到较为不具体的节点(文档). □所有浏览器均支持事件冒泡.Firefox.chrome.safari将事件一直冒泡到window对象. 1.2事件捕获(Netscape事件流) □不太具体的节点更早收到事件,而具体的节点最后收到节点. □Safari.chrome.Opera.firefox支持,但从window对象
-
JavaScript高级程序设计（第三版）学习笔记6、7章
第6章,面向对象的程序设计 对象: 1.数据属性 configurable,表示能否通过delete删除属性从而重新定义属性,能否修改属性的特性,或能否把属性修改为访问器属性,默认为true enumerbale,表示能否通过for-in访问属性,默认true writable,表示能否修改属性值,默认true value,数据存储位置,默认undefined 修改默认属性特性:Object.defineProperty(),接收三个参数:属性所在对象,属性名,描述符对象,描述符对象属性必
-
JavaScript高级程序设计（第3版）学习笔记3 js简单数据类型
ECMAScript是一种动态类型的语言,构建于5种简单数据类型(Undefined.Null.Boolean.Number.String)和一种复杂数据类型(Object)的基础之上.这篇文章就来复习一下简单数据类型,我会尽量从编程实践的角度来描述,下面代码运行环境为FireFox 14.0.1. 简单数据类型 简单数据类型 取值 Undefined undefined(只有一个值) Null null(只有一个值) Boolean true|false(只有两个值) Number 数值 St
-
JavaScript高级程序设计（第3版）学习笔记2 js基础语法
这一篇复习一下ECMAScript规范中的基础语法,英文好的朋友可以直接阅读官方文档.JavaScript本质上也是一种类C语言,熟悉C语言的朋友,可以非常轻松的阅读这篇文章,甚至都可以跳过,不过建议你最好还是看一看,在介绍的同时,我可能会引用一些自认为不易理解且比较流行的用法. 基础语法 1.标识符:所谓标识符,实际上就是指一个满足一定规范,能够被引擎识别的名字,可以用来表示常量.变量.函数名.函数参数.对象.对象属性等所有可命名对象的名称. (1)区分大小写. (2)以字母.下划线(_)或美
-
JavaScript高级程序设计 XML、Ajax 学习笔记
第十五章 JavaScript与XML 1.浏览器对XML DOM的支持 1.1 DOM2级核心 ①在DOM2级在document.implementation中引入了createDocument()方法(IE6~8不支持). 可以创建一个空白XML. var xmldom = document.implemention.createDocument(namespaceUri,root,docype); ②要创建一个新的文档元素为<root>的XML文档,可用如下代码: var xmldom
-
JavaScript高级程序设计 DOM学习笔记
第十章 DOM DOM是针对XML和HTML文档的一个API:即规定了实现文本节点操控的属性.方法,具体实现由各自浏览器实现. 1. 节点层次 1) 文档节点:document,每个文档的根节点. 2) 文档元素:即<html>元素,文档最外层元素,文档节点第一个子节点. 3) Node类型: ①Node是DOM中各种节点类型的基类型,共享相同的基本属性和方法. □ Node.Element_NODE(1); □ Node.ATTRIBUTE_NODE(2); □ Node.TEXT_NODE
-
javascript高级程序设计(第三版)学习笔记（一） 正则表达式整理
1.创建正则表达式 第一种方式:注意这里的正则表达式不能使用单引号或者双引号,如下 var pattern1 = /[abc]/i; // 匹配第一个"a"或"b"或"c",不区分大小写 第二种方式:使用RegExp构造函数创建,该构造函数传入两个参数,都是字符串,所以需要特别注意"\"符号的转换,所有元字符(下面有讲元字符)需要双重转义,如下 复制代码 代码如下: var patt1 = new RegExp("[
-
JavaScript面向对象知识串结(读JavaScript高级程序设计(第三版))
第一遍囫囵吞枣,不求甚解,感觉恍然大悟,结果晚上睡觉一想发现很多问题,什么都不明白,再看第二遍,发现原来是这样.过了几天一用,发现手写起来原来还是在凭记忆,于是下一遍,下一遍... 单凭记忆去弄清楚东西很不靠谱,时间一长脑袋空白.特别是技术上的很多思想和原理,只看不练,即便当时想得特别清楚,过久了也会忘.再者就是网上一些东西,只能说是提供了一种便捷的查看途径,事后还是自己总结为好,毕竟大多都是个人总结,一些概念很难讲的很清楚,而且两个人谈同一件事情,一般说的步骤和章节都是不同的,这样很容易形成交
-
JavaScript高级程序设计（第3版）学习笔记6 初识js对象
在房子里面可以放你想放的任意事物--如果你有足够的美学造诣,你甚至可以弄一个房中房试试--当然,为了方便管理,我们会给房子里存放的所有事物都会取上一个不重复的名字,比如医药房间里的各种药品名称.在ECMAScript中,你可以在对象中存放任意你想放的数据,同样,我们需要给存放的数据取一个名字--也就是对象的属性名,再存放各种数据.再看看ECMA-262中对象的定义:无序属性的集合,其属性可以包含简单数据类型值.对象或者函数. 进入对象,我开始有些激动了,说实话,让我想起做这系列学习笔记的最初原因
-
JavaScript高级程序设计（第3版）学习笔记 概述
在JavaScript面世之初,没有人会想到它会被应用的如此广泛,也远比一般人想象中的要复杂强大的多,在我自己学习的过程中,曾经有过多次震撼,只是常常没有过多久,很多美轮美奂的用法就又模糊起来,希望通过对JavaScript高级程序设计(第3版)的专题学习笔记,能够较为系统的将基础知识梳理一次,也能够将自己平常学习与工作过程中遇到的一些美妙用法记录下来,便于自己再次学习,当然,也希望可以给有需要的朋友们一些力所能及的帮助. 相关术语 先简要说一下和JavaScript相关的一些背景术语,就不详细
-
JavaScript高级程序设计（第三版）学习笔记1~5章
第2章,在html中使用JavaScript Html引入外部js脚本 <script type="text/javascript" src="test.js">两个</script>之间不应放脚本,因为并不会被执行</script> <script>标签有一个defer属性可以延迟脚本执行,但是并不保证会按脚本排列顺序执行 建议:将脚本引入放在<body>标签的所有内容之后,而不放在<head>
-
JavaScript高级程序设计（第3版）学习笔记8 js函数（中）
6.执行环境和作用域 (1)执行环境(execution context):所有的JavaScript代码都运行在一个执行环境中,当控制权转移至JavaScript的可执行代码时,就进入了一个执行环境.活动的执行环境从逻辑上形成了一个栈,全局执行环境永远是这个栈的栈底元素,栈顶元素就是当前正在运行的执行环境.每一个函数都有自己的执行环境,当执行流进入一个函数时,会将这个函数的执行环境压入栈顶,函数执行完之后再将这个执行环境弹出,控制权返回给之前的执行环境. (2)变量对象(variable ob
-
JavaScript高级程序设计（第3版）学习笔记9 js函数（下）
再接着看函数--具有魔幻色彩的对象. 9.作为值的函数 在一般的编程语言中,如果要将函数作为值来使用,需要使用类似函数指针或者代理的方式来实现,但是在ECMAScript中,函数是一种对象,拥有一般对象具有的所有特征,除了函数可以有自己的属性和方法外,还可以做为一个引用类型的值去使用,实际上我们前面的例子中已经有过将函数作为一个对象属性的值,又比如函数也可以作为另一个函数的参数或者返回值,异步处理中的回调函数就是一个典型的用法. 复制代码 代码如下: var name = 'linjisong'