js 5 chapters

JS高级程序设计

第一章:JAVASCRIPT简介

第二章:在HTML中使用JAVASCRIPT

第三章:基本概念

第四章:变量、作用域和内存问题

第五章:引用类型

 

此文主要包括:1.书中内容我认为比较重要的 2.其中内容的扩展(主要是MDN上内容)3.还有JS的一些规范 4.一些名词以及算法(迭代,归并)解释与学习

我准备精通这门语言,所以我尽量把典型问题与细节写出来。


我们都知道:JS由三部分组成:

  1. ECMAScript(核心)
  2. DOM(DocumentObjectModel)
  3. BOM  (BrowserObjectModel)

 ECMAScript:

由ECMAS-262定义的ECMAScript与web浏览器没有依赖关系。Web浏览器只是ECMAScript实现的宿主环境之一,还有如Node,Adobe flash。宿主环境提供基本的实现同时还提供语言的扩展,如DOM——利用ECMAScript的核心类型和语法提供更多具体功能。

ECMAScript规定了:

  • 语法
  • 类型
  • 语句
  • 关键字
  • 保留字
  • 操作符
  • 对象

DOM:

DOM是针对XML但经过扩展用于HTML的API(Application Programming Interface)。

文档对象模型 (DOM) 是HTML和XML文档的编程接口。它提供了对文档的结构化的表述,并定义了一种方式可以使从程序中对该结构进行访问,从而改变文档的结构,样式和内容。DOM 将文档解析为一个由节点和对象(包含属性和方法的对象)组成的结构集合。简言之,它会将web页面和脚本或程序语言连接起来。

一个web页面是一个文档。这个文档可以在浏览器窗口或作为HTML源码显示出来。但上述两个情况中都是同一份文档。文档对象模型(DOM)提供了对同一份文档的另一种表现,存储和操作的方式。 DOM是web页面的完全的面向对象表述,它能够使用如 JavaScript等脚本语言进行修改。

https://developer.mozilla.org/en-US/docs/Glossary/DOM

DOM1:  DOM CORE    和 DOM HTML

DOM核心规定的是如何映射基于XML的文档结构,以便简化对文档中任意部分的访问和操作。

DOM HTML 模块则在HTML核心的基础上扩展,添加针对HTML的对象和方法。

DOM2、DOM3进一步扩展。

其他DOM标准:另外几种语言发布了只针对自己的DOM标准。

BOM:

通过HTML,BOM兼容性会越来越好。

 

第二章


 

没啥要点的。

几个属性:

  1. async
  2. charest
  3. defer
  4. src
  5. type
  6. <noscript>需支持或启用JavaScript</noscript>

主要想到的问题:JS的详细解析过程,JS脚本内执行顺序,多个脚本引入到HTML中时的加在顺序、执行顺序。JS解析器,解释原理。

 

第三章(基本概念)


 

  1. 语法
  2. 关键字和保留字
  3. 变量
  4. 数据类型
  5. 操作符
  6. 语句
  7. 函数

ECMAScript的变量是松散类型的,所谓松散类型就是可以用来保存任何类型的数据。每个变量仅仅是一个占位符而已。定义变量需要使用var操作符。

如:var message = "hi"   //像这样初始化变量不会将其标记为字符串类型,初始化的过程就是给变量赋 一个值。如函数名是指针,函数是对象。

 

全局对象的概念

JavaScript通过函数管理作用域。在函数内部声明的变量只在这个函数内部可用,而在函数外面不可用。另一方面,全局变量就是在任何函数外面声明的或是未声明直接简单使用的。

每个JavaScript环境有一个全局对象,当你在任意的函数外面使用this的时候可以访问到。你创建的每一个全局变量都成了这个全局对象的属性。在浏览器中,方便起见,该全局对象有个附加属性叫做window,此window(通常)指向该全局对象本身。下面的代码片段显示了如何在浏览器环境中创建和访问的全局变量:

 
1 myglobal = "nowamagic";         // 不推荐写法
2 console.log(myglobal);          // "hello"
3 console.log(window.myglobal);       // "hello"
4 console.log(window["myglobal"]);    // "hello"
5 console.log(this.myglobal);         // "hello"
 

谨慎使用全局变量

全局变量的问题在于,你的JavaScript应用程序和web页面上的所有代码都共享了这些全局变量,他们住在同一个全局命名空间,所以当程序的两个不同部分定义同名但不同作用的全局变量的时候,命名冲突在所难免。

web页面包含不是该页面开发者所写的代码也是比较常见的,例如:

  • 第三方的JavaScript库
  • 广告方的脚本代码
  • 第三方用户跟踪和分析脚本代码
  • 不同类型的小组件,标志和按钮

比方说,该第三方脚本定义了一个全局变量,叫做result;接着,在你的函数中也定义一个名为result的全局变量。其结果就是后面的变量覆盖前面的,第三方脚本就一下子嗝屁啦!

因此,要想和其他脚本成为好邻居的话,尽可能少的使用全局变量是很重要的。一些减少全局变量的策略,例如命名空间模式或是函数立即自动执行,但是要想让全局变量少最重要的还是始终使用var来声明变量。

由于JavaScript的两个特征,不自觉地创建出全局变量是出乎意料的容易。首先,你可以甚至不需要声明就可以使用变量;第二,JavaScript有隐含的全局概念,意味着你不声明的任何变量都会成为一个全局对象属性。参考下面的代码:

1 function sum(x, y) {
2    // 不推荐写法: 隐式全局变量
3    result = x + y;
4    return result;
5 }
 


此段代码中的result没有声明。代码照样运作正常,但在调用函数后你最后的结果就多一个全局命名空间,这可以是一个问题的根源。

经验法则是始终使用var声明变量,正如改进版的sum()函数所演示的:

1 function sum(x, y) {
2    var result = x + y;
3    return result;
4 }



另一个创建隐式全局变量的反例就是使用任务链进行部分var声明。下面的片段中,a是本地变量但是b确实全局变量,这可能不是你希望发生的:

1 // 反例,勿使用
2 function foo() {
3    var a = b = 0;
4    // ...
5 }



此现象发生的原因在于这个从右到左的赋值,首先,是赋值表达式b = 0,此情况下b是未声明的。这个表达式的返回值是0,然后这个0就分配给了通过var定义的这个局部变量a。换句话说,就好比你输入了:

1 var a = (b = 0);



如果你已经准备好声明变量,使用链分配是比较好的做法,不会产生任何意料之外的全局变量,如:

1 function foo() {
2    var a, b;
3    // ... a = b = 0; // 两个均局部变量
4 }



然而,另外一个避免全局变量的原因是可移植性。如果你想你的代码在不同的环境下(主机下)运行,使用全局变量如履薄冰,因为你会无意中覆盖你最初环境下不存在的主机对象(所以你原以为名称可以放心大胆地使用,实际上对于有些情况并不适用)。

 

 还有注意的是:

操作符、函数、方法 它们的规则和返回值 等一些特点。

这一章知识点比较简单,但是比较细。

第四章(变量、作用域、内存问题)


待续