Javascript 词法结构你懂吗？

“词法结构”就是编程语言中的一套规则，它制定了如何使用这门语言编写程序。

今天就来介绍一下JavaScript的词法结构。

涵盖内容如下：

• 注释

• 大小写的区分、空格和换行符

• 什么是字面量

• Unicode 是什么、有什么用

• 有什么保留字

• 标识符是什么

• 可选的分号，真的好吗

注释

JavaScript支持两种注释，单行注释（//）、多行注释（/**/）

// 这就是单行注释
/* 这就是多行注释 *//* *这也是多行注释 *多行注释 */

大小写的区分、空格和换行符

大小写

JavaScript 是区分大小写的。这就是意味着for和FOR或者For是不一样的

空格

JavaScript忽略程序中记号之间的空格。很大程度上也忽略换行符。

可能有人会问程序中记号之间的空格，记号这是什么？记号就是指一个关键字、变量名、数字、函数或者其他实体。我们看看下面的例子：

关键字、函数

for(var i = 0;i< 5; i++){  console.log(i);}
for (var i = 0;i< 5; i++){  console.log(i);}
for   (var i = 0;i< 5; i++){  console.log(i);}
function a(){ console.log("我是function") }function a (){ console.log("我是function") }
a(); // 我是functiona (); // 我是functiona  (); // 我是function

不只是声明函数、使用关键字的时候会忽略，函数在调用的时候也会忽略。

我们很多人应该都习惯了写函数的时候加一个空格，但是我们一直都不知道原来这是“词法结构“的内容。

这时有人会问这有什么意义吗？有使用场景吗？那看看下面这个

<a-input-password  v-model="form.passWord"  :maxLength="20"  @change="(e, val) => handleInputChange(e, 'passWord')"  @pressEnter="handleSubmit"  ><a-icon slot="prefix" type="lock"/></a-input-password>

<a-input-passwordv-model="form.passWord":maxLength="20"placeholder="请输入密码"@change="(e,val)=>handleInputChange(e,'passWord')"@pressEnter="handleSubmit"><a-icon slot="prefix" type="lock"/></a-input-password>

相信大家都喜欢前面那样的写法吧？这就是应用场景只是我们平时都不知道而已。这里也说明了很大程度上也是忽略了换行符的。

数字、变量名

var a   = 1     ;console.log(a); // 1
var b  = 2,    c =    3;console.log(b,c); // 2,3

其实大家都一直在使用就是不知道原来自己使用的是什么。

什么是字面量

顾名思义就是直接通过出现在程序上的一些数据值。比如：

• 10

• null

• undefined

• true

• false

• ‘Hello’

• ‘hello’

Unicode 是什么

Unicode 这个词应该挺常见的可是它是什么？有什么用呢？下面来讲讲吧。

因为在计算机中只是处理数字，而Unicode就是指定一个数字来储存字母或者其他字符，Unicode给每个字符提供了唯一的数字，不论什么平台、不论什么程序、不论什么语言。

我们看看转义序列

JavaScript定义了转义序列，所以可以使用ASCII字符来表示Unicode字符。

使用方式以\u 开头，后面跟 4 位十六进制数字（包括大写或小写的字面 A～F）或包含在一对花括号内的 1～6 位十六进制数字。应该很多人没明白这是什么，我们看例子。

字符“é”的Unicode转义序列是\u00E9，是不是有点似曾相识的感觉了。接着看

Unicode转义序列可以出现在JavaScript字符串字面量、正则表达式字面量和标示符中（不能出现在语言关键字中）。我们看例子

let  \u00E9 = 1;let  \u{E9} = 1;console.log(é); // 1

也就是说我们可以通过Unicode 的转义序列做为变量名、正则表达式字面量和标示符。

如果没明白我觉得可以在浏览器的控制台试试这几行代码，在浏览器控制台上方便快捷。

好的到了场景问题了，建议亲手敲一敲这个代码。祝大家天天开心

console.log("\u{1F600}"); // "😀"

这就是最贴近我们应用场景，所以我们需要一些特殊符号时候记得想起它哦。

Unicode 归一化

怎么还有归一化呢？因为程序中如果用的不是ASCII字符，那么Unicode是允许多种编码方式表示同一字符的。我们看例子：

const \u{e9} = 1;const e\u{301} = 2;console.log(é); // 1console.log(é); // 2
不明白没事，看下面这个console.log(c\u{301}); // ć

现在应该能明白归一化了吧？虽然计算机能区分它们，但是我们实际开发中如果出现了是很难区分的毕竟长的一样，就好像两个台电脑外观一样，内心不一样，这难免会有认错它的时候。

保留字

在JavaScript中，一些标识符是保留字，不能用做变量、常量、函数、类的命名。

这里我们做一下区分，毕竟有绝对也有不绝对的。

绝对不能使用（但是能做为对象的属性）

• if

• while

• for

在完全没有语法歧义的情绪下使用

• from

• of

• get

• set

其实最简单的做法就是不要使用以下的保留字

标示符是什么

代码中用来标示变量、函数、属性的字符序列。也就是我们平时定义的变量，声明的函数，添加的属性。

标识符只能包含字母或者数字或者下划线('_')或者美元符合('$')，且不能以数字开头。

可选的分号，真的好吗？

为什么说是可选分号呢？因为JavaScript会自动识别语句的结尾，不过缺少必要分号作为结尾符时，会降低代码的可读性和整洁性有时还会导致报错。

比如：

{  let a = 1  let b = 2}
let a = 1letb = 2   // SyntaxError: Invalid or unexpected token

在大括号内没加上分号时可以正常运行，不会报错，也遵守了规则，但是当代码写在同一行时就导致报错了

有时候还会引起误解

// 真实意图let aa=3console.log(a) // 3
// 实际运行let a;a = 3;console.log(a);

还有可能导致意外的情形

// 真实意图let y = x + f(a+b).toString()
// 实际运行let y = x + f(a+b).toString()

// 真实意图return true;
// 错将换行符解释为分号return;true;

所以说应该主动加上分号以表示该语句结束，不应该依靠JavaScript的自动识别。

文章讲的所有内容都是大家平时在开发中经常在做的事情，只是大家有没发现有些东西我们只是知道了怎么使用，却没去了解它的背后。

如果对你有帮助辛苦动动你的手指点个👍吧。