时间的节点终于来到了JavaScript，既然是JavaScript速查手册，自然要用简明的毫无修饰的自然语言描述，闲话少说我们步入正题。

历史

时间回到Internet刚兴起的那段时间，如果用户要注册个账户，需要在表单里面填写邮件地址，如果用户填了个非法的邮箱地址，比如填了个sb，浏览器也原封不动的发给服务器，服务器校验邮件地址不对后再告诉浏览器你地址填错了，当时的Internet可不像现在这么快，简直是龟速，这么一来一往，花时间不说，对没耐心的用户来讲是一种考验。话说网景公司当时有个浏览器叫Netscape，每天也经受着这样的摧残，为了解决这个问题，在1995年的时候，Netscape公司的程序员布兰登·艾奇，花了十天的时间开发了LiveScript语言，这么短的时间开发一门语言，确实了不起。后来Netscape为了蹭Java的热度，把LiveScript改名为JavaScript，JavaScript和Java基本上没有什么关系。当时的JavaScript有三个版本，IE的JScript、网景的JavaScript和ScriptEase中的CEnvi。为了统一标准，1997年三家公司将统一化需求提交给欧洲计算机制造商协会（ECMA），该协会指定39号技术委员会负责将其进行标准化，代号为TC39，经过委员会数月的努力，一种名为ECMAScript的新脚本语言的标准诞生，JavaScript也由此变得标准化。近两年随着Node.js的风靡，JavaScript的执行也渐渐脱离了浏览器，变成了一门全栈语言，不仅前端在使用，后端也在使用。

研究一门语言我一般会从以下几个方面进行探讨：

运行环境，注释，数据类型，关键字，变量，命名规则，数据类型转换，作用域，函数，控制语句，面向对象，继承，接口，反射，异步，异常，IO操作，网络，常用库

执行环境

JavaScript可以在两种环境下执行，一种是在客户端执行的浏览器环境，在浏览器中执行，一种是将代码嵌入到<script>标签中，另一种是直接写到js文件中

1
2
3
4
//嵌入到标签中的写法
<script>console.log("Hello World!");</script>
//在文件中的写法，如果采用这种方法，<script>标签内不应该再写代码，会被忽略
<script> type="text/javascript" src="test.js"></script>

另一种是在服务器端执行的Node.js环境，不需要嵌套在任何标签内，直接写代码即可：

1
console.log("Hello World!");

注释

  • 单行注释：//单行注释信息。
  • 多行注释：/*多行注释信息*/。

执行顺序

当代码嵌套到<script>中时，脚本是按先后顺序执行，当然我们可以通过添加defer属性延迟执行脚本

1
2
3
4
5
6
7
8
9
10
11
<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <script type="text/javascript" defer src="test.js"></script>
</head>
<body>
    <h1>网页标题</h1>
    <p>正文内容</p>
</body>
</html>

defer属性虽然会将脚本执行延迟，但是会同步加载文件，造成阻塞，有另一种方法可以异步加载文件，那就是async属性，即在加载 JavaScript 文件时，浏览器不会暂停，而是继续解析。这样能节省时间，提升响应速度。

1
2
3
4
5
6
7
8
9
10
11
<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <script type="text/javascript" async src="test.js"></script>
</head>
<body>
    <h1>网页标题</h1>
    <p>正文内容</p>
</body>
</html>

命名规则

  • 第一个字符必须是字母、下划线（_）或美元符号（$）。
  • 除了第一个字符外，其他位置可以使用 Unicode 字符。一般建议仅使用 ASCII 编码的字母，不建议使用双字节的字符。
  • 不能与 JavaScript 关键字、保留字重名。
  • 可以使用 Unicode 转义序列。例如，字符 a 可以使用“\u0061”表示。

关键字
break delete if this while
case do in throw with
catch else instanceof try
continue finally new typeof
debugger（ECMAScript 5 新增） for return var
default function switch void
abstract double goto native static
boolean enum implements package super
byte export import private synchronized
char extends int protected throws
class final interface public transient
const float long short volatile

变量声明

1
2
3
4
var a;  //声明一个变量
var a=1,b=2,3;  //声明多个变量并赋值
var b = 1; //声明并赋值
c = 2; //声明一个全局变量

数据类型

JavaScript 定义了 6 种基本数据类型，如表所示。

数据类型 说明
null 空值，表示非对象
undefined 未定义的值，表示未赋值的初始化值
number 数字，数学运算的值
string 字符串，表示信息流
boolean 布尔值，逻辑运算的值
object 对象，表示复合结构的数据集

使用typeof可以返回数据类型的字符串形式：

1
2
3
4
5
6
7
8
9
10
//如果是 null 值，则先返回字符串 "null" 否则返回（typeof o）的值
function typeOf(o){
    return (o === null) ? "null" : (typeof o);
}
console.log(typeOf(1));  //返回字符串"number"
console.log(typeOf("1"));  //返回字符串"string"
console.log(typeOf(true));  //返回字符串 "boolean"
console.log(typeOf({}));  //返回字符串"object"
console.log(typeOf(null));  //返回字符串"null"
console.log(typeOf(undefined));  //返回字符串"undefined"

启用严格模式

在代码首部添加以下一行字符串,即可启用严格模式。

1
"use strict"

数据类型转换

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
//把数字转换为字符串
var n = 123;
n = n + "";
console.log(typeof n); //返回类型为 string
var a = 1.000;
var b = 0.0001;
var c = 1e-1;
console.log(a.toString());  //返回字符串“1”
console.log(b.toString());  //返回字符串“0.0001”
console.log(c.toString());  //返回字符串“0.0001”

//把布尔值转换为字符串，返回字符串 "true" 或 "false"。
var b = true;
b = b + "";
console.log(b); //返回字符串"true"

//把数组转换为字符串，返回数组元素列表，以逗号分隔。如果是空数组，则返回空字符串。
var a = [1,2,3];
a = a + "";
console.log(a); //返回字符串 "1,2,3"

//把函数转换为字符串，返回函数的具体代码字符串。
var f = function(){return 1;};
f = f + "";
console.log(f);  //返回字符串 "function (){return 1;}"

//能够把数值转换为字符串，并显示小数点后的指定位数：
var a = 10;
console.log(a.toFixed(2));  //返回字符串“10.00”
console.log(a.toFixed(4));  //返回字符串“10.0000”

//将值转换为整数：
console.log(parseInt("123abc"));  //返回数字123
console.log(parseInt("1.73"));   //返回数字1
console.log(parseInt(".123"));   //返回值NaN

//把值转换为浮点数：
console.log(parseFloat("1.234.5"));  //返回数值 1.234

运算符

+ 加法 !== 不等值或不等型
- 减法 > 大于
* 乘法 < 小于
/ 除法 >= 大于或等于
% 系数 <= 小于或等于
++ 递加 ? 三元运算符
– 递减 && 逻辑与
= x = y || 逻辑或
+= x += y ! 逻辑非
-= x -= y & 与
*= x *= y | 或
/= x /= y ~ 非
%= x %= y ^ 异或
== 等于 << 零填充左位移
=== 等值等型 >> 有符号右位移
!= 不相等 >>> 零填充右位移
typeof 返回变量的类型。 b ? x : y 条件运算符
instanceof 返回 true，如果对象是对象类型的实例。

控制语句

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
var num = parseInt(Math.random() * 99 + 1);
if (num < 60) {console.log("不及格"); }
else if (num < 70) {console.log("及格"); }
else if (num < 85) {console.log(""良好"); }
else {console.log("优秀"); }

var id = 1;
switch (id) {
    case 1 :
    case 2 :
        console.log("VIP会员");
        break;
    case 3 :
        console.log("管理员");
        break;
    default : 
        console.log("游客");
        
var n = 1;  //声明并初始化循环变量
while (n++ <= 100){  //循环条件
    if (n % 2 == 0) document.write(n + "");   //执行循环操作
}

var n = 1;  //声明并初始化循环变量
do {  //循环条件
    n++;  //递增循环变量
    if (n % 2 == 0) document.write(n + "");  //执行循环操作
} while (n <= 100);

for (var n = 1;n <=100;n++){
    if (n % 2 == 0) document.write(n + "");  //执行循环操作
}

var a = [1,true,"0",[false],{}];  //声明并初始化数组变量 
for (var n in a) {  //遍历数组
    document.write("a["+n+"] = " + a[n] + "<br>");  //显示每个元素及其值
}

异常

ECMA-262 规范了 7 种错误类型，具体说明如下。其中 Error 是基类，其他 6 种错误类型是子类，都继承 Error 基类。Error 类型的主要用途是自定义错误对象。

  • Error：普通异常。与 throw 语句和 try/catch 语句一起使用，属性 name 可以读写异常类型，message 属性可以读写详细错误信息。
  • EvalError：不正确的使用 eval() 方法时抛出。
  • SyntaxError：出现语法错误时抛出。
  • RangeError：数字超出合法范围时抛出、
  • ReferenceError：读取不存在的变量时抛出。
  • TypeError：值得类型发生错误时抛出。
  • URIError：URI 编码和解码错误时抛出。

try/catch/finally 是 JavaScript 异常处理语句。语法格式如下：

1
2
3
4
5
6
7
8
9
try{
    //调试代码块
}
catch(e) {
    //捕获异常，并进行异常处理的代码块
}
finally{
    //后期清理代码块
}

throw 语句能够主动抛出异常，语法格式如下：

1
throw expression;

未完待续。。。