目录

基本语法

typeof语句

布尔值

数值

parseInt()，parseFloat()，isNaN()，isFinite()

字符串

对象

函数

数组

运算符

数据类型的转换

错误处理机制

console 对象与控制台

 JavaScript 的核心语法部分相当精简，只包括两个部分：基本的语法构造（比如操作符、控制结构、语句）和标准库（就是一系列具有各种功能的对象比如Array、Date、Math等）。

JavaScript 语言的每一个值，都属于某一种数据类型。JavaScript 的数据类型，共有六种。

  • 数值（number）：整数和小数（比如1和3.14）
  • 字符串（string）：文本（比如Hello World）。
  • 布尔值（boolean）：表示真伪的两个特殊值，即true（真）和false（假）
  • undefined：表示“未定义”或不存在，即由于目前没有定义，所以此处暂时没有任何值
  • null：表示空值，即此处的值为空。
  • 对象（object）：各种值组成的集合。

基本语法

1.语句：语句（statement）是为了完成某种任务而进行的操作。

var a = 1 + 3 ; var b = 'abc';;;;

分号前面可以没有任何内容，JavaScript 引擎将其视为空语句。

表达式不需要分号结尾。一旦在表达式后面添加分号，则 JavaScript 引擎就将表达式视为语句，这样会产生一些没有任何意义的语句。

2.变量：变量是对“值”的具名引用。变量就是为“值”起名，然后引用这个名字，就等同于引用这个值。变量的名字就是变量名。

JavaScript 的变量名区分大小写，A和a是两个不同的变量。

var a = 1; //声明+赋值

var a;//声明
a = 1;//赋值

var a;//只声明没有赋值，“undefined”====“无定义”

变量提升：JavaScript 引擎的工作方式是，先解析代码，获取所有被声明的变量，然后再一行一行地运行。这造成的结果，就是所有的变量的声明语句，都会被提升到代码的头部，这就叫做变量提升（hoisting）。

var a;
console.log(a);
a = 1;
//最后的结果是显示undefined，表示变量a已声明，但还未赋值。

 3.标识符：标识符（identifier）指的是用来识别各种值的合法名称。最常见的标识符就是变量名，以及后面要提到的函数名。

  • 第一个字符，可以是任意 Unicode 字母（包括英文字母和其他语言的字母），以及美元符号（$）和下划线（_）。
  • 第二个字符及后面的字符，除了 Unicode 字母、美元符号和下划线，还可以用数字0-9。

中文是合法的标识符，可以用作变量名。

4.注释：单行注释：用//起头；<!--和-->（-->只有在行首，才会被当成单行注释，否则会当作正常的运算。）

多行注释：放在/*和*/之间。

5.区块：JavaScript 使用大括号，将多个相关的语句组合在一起，称为“区块”（block）。

6.条件语句：JavaScript 提供if结构和switch结构，完成条件判断，即只有满足预设的条件，才会执行相应的语句。

if (布尔值)
  语句;

// 或者
if (布尔值) 语句;

所谓布尔值，指的是 JavaScript 的两个特殊值，true表示真，false表示伪。“布尔值”往往由一个条件表达式产生的，必须放在圆括号中，表示对表达式求值。

if后面的表达式之中，不要混淆赋值表达式（=）、严格相等运算符（===）和相等运算符（==）。尤其是赋值表达式不具有比较作用。

switch：case和break的使用。

三元运算符（?:）：(条件) ? 表达式1 : 表达式2，如果“条件”为true，则返回“表达式1”的值，否则返回“表达式2”的值。

7.循环语句：while循环，for循环，do···while循环

标签：JavaScript 语言允许，语句的前面有标签（label），相当于定位符，用于跳转到程序的任意位置。

label:
  语句

标签可以是任意的标识符，但不能是保留字，语句部分可以是任意语句。

标签通常与break语句和continue语句配合使用，跳出特定的循环。

typeof语句

typeof运算符可以返回一个值的数据类型。

数值、字符串、布尔值分别返回number、string、boolean。

typeof 123 // "number"
typeof '123' // "string"
typeof false // "boolean"

function f() {}
typeof f// "function"

typeof undefined// "undefined"
typeof window // "object"
typeof {} // "object"
typeof [] // "object"
typeof null // "object"

布尔值

下列运算符会返回布尔值：

  • 前置逻辑运算符： ! (Not)
  • 相等运算符：===，!==，==，!=
  • 比较运算符：>，>=，<，<=

如果 JavaScript 预期某个位置应该是布尔值，会将该位置上现有的值自动转为布尔值。转换规则是除了下面六个值被转为false，其他值都视为true。

  • undefined
  • null
  • false
  • 0
  • NaN
  • ""或''（空字符串）

数值

整数和浮点数：JavaScript 内部，所有数字都是以64位浮点数形式储存，即使整数也是如此。这就是说，JavaScript 语言的底层根本没有整数，所有数字都是小数（64位浮点数）。

数值精度：绝对值小于2的53次方的整数，即-253到253，都可以精确表示。

数值范围：数值范围为21024到2-1023（开区间），超出这个范围的数无法表示。

数值的进制：

  • 十进制：没有前导0的数值。
  • 八进制：有前缀0o或0O的数值，或者有前导0、且只用到0-7的八个阿拉伯数字的数值。
  • 十六进制：有前缀0x或0X的数值。
  • 二进制：有前缀0b或0B的数值。

NaN:Not a Number

 NaN不是独立的数据类型，而是一个特殊数值，它的数据类型依然属于Number。NaN不等于任何值，包括它本身。

Infinity：Infinity表示正的无穷，-Infinity表示负的无穷。

Infinity大于一切数值（除了NaN），-Infinity小于一切数值（除了NaN）。

parseInt()，parseFloat()，isNaN()，isFinite()

parseInt：用于将字符串转为整数。

parseInt的返回值只有两种可能，要么是一个十进制整数，要么是NaN。

parseFloat：用于将一个字符串转为浮点数。

parseFloat会将空字符串转为NaN。

isNaN：可以用来判断一个值是否为NaN。

isNaN只对数值有效，如果传入其他值，会被先转成数值。对于对象和数组，isNaN也返回true。但是，对于空数组和只有一个数值成员的数组，isNaN返回false。

isFinite：返回一个布尔值，表示某个值是否为正常的数值。

除了Infinity、-Infinity、NaN和undefined这几个值会返回false，isFinite对于其他的数值都会返回true。

字符串

零个或多个排在一起的字符，放在单引号或双引号之中。

单引号字符串的内部，可以使用双引号。双引号字符串的内部，可以使用单引号。

'key = "value"'
"It's a long journey"

'Did she say \'Hello\'?'
// "Did she say 'Hello'?"

"Did she say \"Hello\"?"
// "Did she say "Hello"?"

 转义：

  • \0 ：null（\u0000）
  • \b ：后退键（\u0008）
  • \f ：换页符（\u000C）
  • \n ：换行符（\u000A）
  • \r ：回车键（\u000D）
  • \t ：制表符（\u0009）
  • \v ：垂直制表符（\u000B）
  • \' ：单引号（\u0027）
  • \" ：双引号（\u0022）
  • \\ ：反斜杠（\u005C）

反斜杠的三种特殊用法：

  1. \HHH:反斜杠后面紧跟三个八进制数（000到377），代表一个字符。HHH对应该字符的 Unicode 码点，比如\251表示版权符号。显然，这种方法只能输出256种字符。
  2. \xHH:\x后面紧跟两个十六进制数（00到FF），代表一个字符。HH对应该字符的 Unicode 码点，比如\xA9表示版权符号。这种方法也只能输出256种字符。
  3. \uXXXX:\u后面紧跟四个十六进制数（0000到FFFF），代表一个字符。XXXX对应该字符的 Unicode 码点，比如\u00A9表示版权符号。

length属性：返回字符串的长度，该属性也是无法改变的。

JavaScript 原生提供两个 Base64 相关的方法。

  • btoa()：任意值转为 Base64 编码
  • atob()：Base64 编码转为原来的值

对象

对象（object）：是 JavaScript 语言的核心概念，也是最重要的数据类型。简单说，对象就是一组“键值对”（key-value）的集合，是一种无序的复合数据集合。

键名：对象的所有键名都是字符串（ES6 又引入了 Symbol 值也可以作为键名），所以加不加引号都可以。如果键名是数值，会被自动转为字符串。

属性：读取对象的属性，有两种方法，一种是使用点运算符，还有一种是使用方括号运算符。

属性的查看:查看一个对象本身的所有属性，可以使用Object.keys方法。

属性的删除：delete命令用于删除对象的属性，删除成功后返回true。只有一种情况，delete命令会返回false，那就是该属性存在，且不得删除。

for...in循环有两个使用注意点。

  • 它遍历的是对象所有可遍历（enumerable）的属性，会跳过不可遍历的属性。
  • 它不仅遍历对象自身的属性，还遍历继承的属性。

with语句：

with (对象) {
  语句;
}

它的作用是操作同一个对象的多个属性时，提供一些书写的方便。

函数

函数的三种声明方式

  1. function声明
  2. 函数表达式
  3. Function 构造函数

如果同一个函数被多次声明，后面的声明就会覆盖前面的声明。

name 属性：返回函数的名字。

length属性：返回函数预期传入的参数个数，即函数定义之中的参数个数。

toString()方法：返回一个字符串，内容是函数的源码。

函数作用域：作用域（scope）指的是变量存在的范围。在 ES5 的规范中，JavaScript 只有两种作用域：一种是全局作用域，变量在整个程序中一直存在，所有地方都可以读取；另一种是函数作用域，变量只在函数内部存在。

数组

数组（array）是按次序排列的一组值。每个值的位置都有编号（从0开始），整个数组用方括号表示。

本质上，数组属于一种特殊的对象。typeof运算符会返回数组的类型是object。

length属性：返回数组的成员数量。length属性的最大值就是 4294967295。

in 运算符 ：检查某个键名是否存在的运算符in，适用于对象，也适用于数组。如果数组的某个位置是空位，in运算符返回false。

var arr = [ 'a', 'b', 'c' ];
2 in arr  // true
'2' in arr // true
4 in arr // false

运算符

算数运算符

JavaScript 共提供10个算术运算符，用来完成基本的算术运算。

  • 加法运算符：x + y
  • 减法运算符： x - y
  • 乘法运算符： x * y
  • 除法运算符：x / y
  • 指数运算符：x ** y
  • 余数运算符：x % y
  • 自增运算符：++x 或者 x++
  • 自减运算符：--x 或者 x--
  • 数值运算符： +x
  • 负数值运算符：-x

比较运算符： 比较运算符用于比较两个值的大小，然后返回一个布尔值，表示是否满足指定的条件。

JavaScript 一共提供了8个比较运算符。

  • > 大于运算符
  • < 小于运算符
  • <= 小于或等于运算符
  • >= 大于或等于运算符
  • == 相等运算符
  • === 严格相等运算符
  • != 不相等运算符
  • !== 严格不相等运算符

布尔运算符：布尔运算符用于将表达式转为布尔值。

布尔运算符一共包含四个运算符。

  • 取反运算符：!
  • 且运算符：&&
  • 或运算符：||
  • 三元运算符：?:

二进制运算符：二进制位运算符用于直接对二进制位进行计算。

二进制运算符一共有7个。

  • 二进制或运算符（or）：符号为|，表示若两个二进制位都为0，则结果为0，否则为1。
  • 二进制与运算符（and）：符号为&，表示若两个二进制位都为1，则结果为1，否则为0。
  • 二进制否运算符（not）：符号为~，表示对一个二进制位取反。
  • 异或运算符（xor）：符号为^，表示若两个二进制位不相同，则结果为1，否则为0。
  • 左移运算符（left shift）：符号为<<，表示将一个数的二进制值向左移动指定的位数，尾部补0，即乘以2的指定次方。
  • 右移运算符（right shift）：符号为>>，表示将一个数的二进制值向右移动指定的位数。如果是正数，头部全部补0；如果是负数，头部全部补1。
  • 头部补零的右移运算符（zero filled right shift）：符号为>>>，一个数的二进制形式向右移动时，头部一律补零，而不考虑符号位。

void运算符：void运算符的作用是执行一个表达式，然后不返回任何值，或者说返回undefined。

逗号运算符：逗号运算符用于对两个表达式求值，并返回后一个表达式的值。 

优先级：优先级高的运算符先执行，优先级低的运算符后执行。

数据类型的转换

强制转换：主要指使用Number()、String()和Boolean()三个函数，手动将各种类型的值，分别转换成数字、字符串或者布尔值。

Number函数将字符串转为数值，要比parseInt函数严格很多。基本上，只要有一个字符无法转成数值，整个字符串就会被转为NaN。

Number()
parseInt('42 cats') // 42
Number('42 cats') // NaN

//parseInt和Number函数都会自动过滤一个字符串前导和后缀的空格。
parseInt('\t\v\r12.34\n') // 12
Number('\t\v\r12.34\n') // 12.34

String()
String(123) // "123"
String('abc') // "abc"
String(true) // "true"
String(undefined) // "undefined"
String(null) // "null"

//Boolean(),以下五个为false，其余全为true
Boolean(undefined) // false
Boolean(null) // false
Boolean(0) // false
Boolean(NaN) // false
Boolean('') // false

错误处理机制

原生错误类型：

  • SyntaxError对象：是解析代码时发生的语法错误。
  • ReferenceError对象：是引用一个不存在的变量时发生的错误。
  • RangeError对象：是一个值超出有效范围时发生的错误。主要有几种情况，一是数组长度为负数，二是Number对象的方法参数超出范围，以及函数堆栈超过最大值。
  • TypeError对象：是变量或参数不是预期类型时发生的错误。比如，对字符串、布尔值、数值等原始类型的值使用new命令，就会抛出这种错误，因为new命令的参数应该是一个构造函数。 
  • URIError对象：是 URI 相关函数的参数不正确时抛出的错误，主要涉及encodeURI()、decodeURI()、encodeURIComponent()、decodeURIComponent()、escape()和unescape()这六个函数。
  • EvalError错误：eval函数没有被正确执行时，会抛出EvalError错误。该错误类型已经不再使用了，只是为了保证与以前代码兼容，才继续保留。

console 对象与控制台

 console对象：

console的常见用途有两个。

  • 调试程序，显示网页代码运行时的错误信息。
  • 提供了一个命令行接口，用来与网页代码互动。 

console.log方法：用于在控制台输出信息。它可以接受一个或多个参数，将它们连接起来输出。 

console.log方法支持以下占位符，不同类型的数据必须使用对应的占位符。

  • %s 字符串
  • %d 整数
  • %i 整数
  • %f 浮点数
  • %o 对象的链接
  • %c CSS 格式字符串

console.info方法：console.info是console.log方法的别名，用法完全一样。只不过console.info方法会在输出信息的前面，加上一个蓝色图标。 

console.table()：对于某些复合类型的数据，console.table方法可以将其转为表格显示。

console.count()：count方法用于计数，输出它被调用了多少次。

console.dir()：dir方法用来对一个对象进行检查（inspect），并以易于阅读和打印的格式显示。

console.dirxml()：dirxml方法主要用于以目录树的形式，显示 DOM 节点。

console.assert()：console.assert方法主要用于程序运行过程中，进行条件判断，如果不满足条件，就显示一个错误，但不会中断程序执行。这样就相当于提示用户，内部状态不正确。

console.time()，console.timeEnd()：这两个方法用于计时，可以算出一个操作所花费的准确时间。time方法表示计时开始，timeEnd方法表示计时结束。它们的参数是计时器的名称。调用timeEnd方法之后，控制台会显示“计时器名称: 所耗费的时间”。

console.group()，console.groupEnd()：console.group和console.groupEnd这两个方法用于将显示的信息分组。它只在输出大量信息时有用，分在一组的信息，可以用鼠标折叠/展开。 

console.groupCollapsed()：console.groupCollapsed方法与console.group方法很类似，唯一的区别是该组的内容，在第一次显示时是收起的（collapsed），而不是展开的。

console.trace()：console.trace方法显示当前执行的代码在堆栈中的调用路径。

 console.clear()：console.clear方法用于清除当前控制台的所有输出，将光标回置到第一行。如果用户选中了控制台的“Preserve log”选项，console.clear方法将不起作用。

控制台命令行 API：

1. $_
2. 
$0 - $4

3. $(selector)
4. $$(selector)
5. $x(path)
6. inspect(object)
7. getEventListeners(object)
8. 
keys(object)，values(object)

9. monitorEvents(object[, events]) ，unmonitorEvents(object[, events])