JS词法分析

1,624 阅读2分钟

这里有一份简洁的前端知识体系等待你查收,看看吧,会有惊喜哦~如果觉得不错,恳求star哈~


概述

词法阶段的任务,就是将服务端返回的字符流识别成词(Token)。

我们先来看看服务端返回的JS代码都包含什么?不难发现,服务端返回的JS代码,可以分为以下四类字符:

  1. 空白字符
  2. 换行符
  3. 注释
  4. 词(Token)
    • 标识符名称:变量名,关键字
    • 符号:运算符、大括号等符号
    • 数字直接量
    • 字符串直接量
    • 正则表达式直接量
    • 字符串模板

下面逐一分析~


空白字符

JavaScript支持所有的Unicode中的空格分类下的空格,如下图:

images

很多公司的编码规范要求JavaScript源代码控制在ASCII范围内,那么,就只有以下五种空白可用了:

  1. <TAB>: 字符串中写的 '\t'
  2. <SP>: 最普通的空格
  3. <NBSP> :非断行空格,当普通空格使用
  4. <VT>: 不常用
  5. <FF>: 不常用

注释

JavaScript的注释分为单行注释和多行注释两种:

/* MultiLineCommentChars */
// SingleLineCommentChars

值得注意的是,带换行的多行注释与换行符是等效的。这会对JavaScript语法产生影响,语法特性章节会讲到。


换行符

换行符会影响JavaScript的两个重要语法特性:自动插入分号和“no line terminator”规则。这个会在执行过程中深入分析。


标识符名称

标识符名称可以以$、下划线、字母开始,除了开始字符以外,标识符名称中还可以使用数字、以及连接符号。

标识符名称不能跟JS中的关键字跟保留字重名。

JS 中的关键字有:

await break case catch class const continue debugger default delete do else export extends finally for function if import ininstance of new return super switch this throw try typeof var void while with yield

小技巧:可以按英文字母的顺序去记忆~

JS中的保留字有:

enum implements package protected interface private public

符号

JS中所有符号有:

{ ( ) [ ] . ... ; , < > <= >= == != === !== + - * % ** ++ -- << >> >>> & | ^ ! ~ && || ? : = += -= *= %= **= <<= >>= >>>= &= |= ^= => / /= }

数字直接量

JS支持的数字格式有:十进制数、二进制整数、八进制整数、十六进制整数。

十进制的Number可以带小数,小数点前后部分都可以省略,但是不能同时省略。比如:.01、12.、12.01,这都是合法的数字直接量。

12.toString()会报错,这是因为12. 会被当做省略了小数点后面部分的数字而看成一个整体,所以我们要想让点单独成为一个token,就要加入空格,这样写:12 .toString(),或者写成12..toString()

数字直接量还支持科学计数法,例如:10.24E+2、10.24e-2、10.24e2


正则表达式直接量

正则表达式由Body和Flags两部分组成,形如:/RegularExpressionBody/g

除了\、/ 和[ 三个字符之外,JavaScript正则表达式中的字符都是普通字符。在正则表达式[ ]中的/也会被认为是普通字符。


字符串模板

在JavaScript词法中,包含 ${ } 的 Template,是被拆开分析的,如:

`a{b}c{d}e` ​ 它被拆成了五个部分:

`a${     // 这个被称为模板头

}c${     // 被称为模板中段

}e`      // 被称为模板尾

b 和 d   // 都是普通标识符

我们可以认为模板就是一个由反引号括起来的、可以在中间插入代码的字符串。


总结

这篇文章中,我们学习了 JS 的词法部分,这部分的内容包括了空白符号、换行符、注释、标识符名称、符号、数字直接量、字符串直接量、正则表达式直接量、字符串模板。掌握词法对我们平时调试代码至关重要。