[关闭]
@Bios 2018-12-10T08:43:09.000000Z 字数 4735 阅读 766

JavaScript高级程序设计——笔记

js

第一章 JavaScript简介

JavaScript实现

JavaScript三个组成部分

ECMAScript

它规定了这门语言的下列组成部分：

ECMAScript就是对实现该标准规定的各个方面内容的语言的描述。

文档对象模型（DOM）

文档对象模型（DOM，Document Object Model）是针对XML但经过扩展用于HTML的应用程序编程接口（API，Application Programming Interface）。DOM把整个页面映射为一个多层节点结构。HTML或XML页面中的每个组成部分都是某种类型的节点，这些节点又包含着不同类型的数据。看下面这个 HTML页面： 

  1. <html>     
  2.   <head>          
  3.     <title>Sample Page</title>     
  4.   </head>     
  5.   <body>         
  6.     <p>Hello World!</p>     
  7.   </body> 
  8. </html>

DOM树:

通过 DOM 创建的这个表示文档的树形图，开发人员获得了控制页面内容和结构的主动权。借助DOM提供的API，开发人员可以轻松自如地删除、添加、替换或修改任何节点。

请读者注意，DOM并不只是针对JavaScript的，很多别的语言也都实现了 DOM。 不过，在Web浏览器中，基于ECMAScript实现的DOM的确已经成为 JavaScript这 门语言的一个重要组成部分。

浏览器对象模型（BOM）

从根本上讲，BOM只处理浏览器窗口和框架；但人们习惯上也把所有针对浏览器的 JavaScript扩展 算作 BOM的一部分。下面就是一些这样的扩展：

由于没有 BOM标准可以遵循，因此每个浏览器都有自己的实现。虽然也存在一些事实标准，例如 要有 window 对象和 navigator 对象等，但每个浏览器都会为这两个对象乃至其他对象定义自己的属 性和方法。现在有了HTML5，BOM实现的细节有望朝着兼容性越来越高的方向发展。

第二章 在HTML中使用JavaScript

script元素

HTML 4.01为 <script>定义了下列 6个属性。

按照惯例，外部 JavaScript文件带有.js扩展名。但这个扩展名不是必需的，因为 浏览器不会检查包含 JavaScript 的文件的扩展名。这样一来，使用 JSP、PHP 或其他 服务器端语言动态生成 JavaScript 代码也就成为了可能。但是，服务器通常还是需要 看扩展名决定为响应应用哪种 MIME 类型。如果不使用.js 扩展名，请确保服务器能 返回正确的 MIME类型。

延迟脚本

HTML 4.01为<script>标签定义了 defer 属性。这个属性的用途是表明脚本在执行时不会影响页 面的构造。也就是说，脚本会被延迟到整个页面都解析完毕后再运行。因此，在<script>元素中设置 defer 属性，相当于告诉浏览器立即下载，但延迟执行。 

  1. <!DOCTYPE html>
  2.   <html>   
  3.   <head>     
  4.     <title>Example HTML Page</title>     
  5.     <script type="text/javascript" defer="defer" src="example1.js"></script>     
  6.     <script type="text/javascript" defer="defer" src="example2.js"></script>   
  7.   </head>   
  8.   <body>     
  9.     <!-- 这里放内容 -->   
  10.   </body> 
  11. </html>

异步脚本

HTML5为<script>元素定义了 async 属性。这个属性与 defer 属性类似，都用于改变处理脚本的行为。同样与 defer 类似，async 只适用于外部脚本文件，并告诉浏览器立即下载文件。但与 defer 不同的是，标记为async的脚本并不保证按照指定它们的先后顺序执行。例如： 

  1. <!DOCTYPE html> 
  2. <html>     
  3.   <head>     
  4.     <title>Example HTML Page</title>     
  5.     <script type="text/javascript" async src="example1.js"></script>     
  6.     <script type="text/javascript" async src="example2.js"></script>   
  7.   </head>   
  8.   <body>     
  9.     <!-- 这里放内容 -->   
  10.   </body> 
  11. </html>

在以上代码中，第二个脚本文件可能会在第一个脚本文件之前执行。因此，确保两者之间互不依赖 非常重要。指定 async 属性的目的是不让页面等待两个脚本下载和执行，从而异步加载页面其他内容。 为此，建议异步脚本不要在加载期间修改 DOM。 异步脚本一定会在页面的 load 事件前执行，但可能会在 DOMContentLoaded 事件触发之前或之 后执行。

第三章 基本概念

变量

  1. function test(){
  2.   message = "hi"; // 全局变量 
  3. } 
  4. test(); 
  5. alert(message); // "hi"

数据类型

ECMAScript中有 5种简单数据类型（也称为基本数据类型）：

还有一种复杂数据类型：

typeof 操作符

对一个值使用 typeof 操作符可能返回下列某个字符串：

有些时候，typeof操作符会返回一些令人迷惑但技术上却正确的值。比如，调用 typeof null 会返回"object"，因为特殊值 null 被认为是一个空的对象引用

判断一个对象的实际类型：
Object.prototype.toString.call(obj).slice(8,-1)

Number

浮点数值的高精度是 17位小数，但在进行算术计算时其精确度远远不如整数。例如，0.1加 0.2 的结果不是 0.3，而是 0.30000000000000004。这个小小的舍入误差会导致无法测试特定的浮点数值。 例如： 

  1. if (a + b == 0.3){  // 不要做这样的测试！
  2.   alert("You got 0.3."); 
  3. }

关于浮点数值计算会产生舍入误差的问题，有一点需要明确：这是使用基于 IEEE754 数值的浮点计算的通病，ECMAScript 并非独此一家；其他使用相同数值格 式的语言也存在这个问题。

ECMAScript能够表示的小数值保 存在 Number.MIN_VALUE 中——在大多数浏览器中，这个值是 5e-324；能够表示的大数值保存在 Number.MAX_VALUE 中——在大多数浏览器中，这个值是 1.7976931348623157e+308。

NaN

NaN，即非数值（Not a Number）是一个特殊的数值，这个数值用于表示一个本来要返回数值的操作数 未返回数值的情况（这样就不会抛出错误了）。例如，在其他编程语言中，任何数值除以 0都会导致错误， 从而停止代码执行。但在ECMAScript中，任何数值除以 0会返回 NaN，因此不会影响其他代码的执行。

原书如此，但实际上只有 0除以0才会返回 NaN，正数除以 0返回 Infinity，负数除以 0返回-Infinity

  1. alert(isNaN(NaN));         //true 
  2. alert(isNaN(10));          //false（10是一个数值）
  3. alert(isNaN("10"));        //false（可以被转换成数值 10）
  4. alert(isNaN("blue"));      //true（不能转换成数值）
  5. alert(isNaN(true));        //false（可以被转换成数值 1

数值转换

有 3个函数可以把非数值转换为数值：Number()、parseInt()和 parseFloat()。第一个函数， 即转型函数 Number()可以用于任何数据类型，而另两个函数则专门用于把字符串转换成数值。这 3个 函数对于同样的输入会有返回不同的结果。 Number()函数的转换规则如下。

Object

Object 的每个实例都具有下列属性和方法：

添加新批注
在作者公开此批注前，只有你和作者可见。
回复批注