温习Javascript基础语法之词法结构

作者:半夏时间:2026-10-31 01:00:46浏览:269

本文系统梳理JavaScript的词法结构,涵盖其与Java的本质区别、大小写敏感特性、保留字与预定义标识符列表。详细解析单行、多行及HTML风格注释的使用规范,重点阐述空白字符、行终止符及自动分号插入机制(ASI)的例外情况,帮助开发者规避常见语法陷阱。

JavaScript与Java的关系及定义

前言

JavaScript既简单又复杂。掌握其基本用法仅需片刻,但深入理解并精通则需多年积累。对于前端工程师而言,核心工作往往等同于JavaScript开发。前端入门门槛较低但精通难度高,这主要归因于JavaScript本身的复杂性。作为JavaScript基础语法系列的开篇,本文将聚焦于词法结构。

与Java的关系

业界常有一种说法:Java与JavaScript的关系,如同雷锋与雷锋塔的关系,看似有关实则无关。这种说法是否准确?

JavaScript最初名为LiveScript,后更名为JavaScript,旨在借Java之名提升其品牌认知度。尽管语法外观与Java相似,但两者在本质上是完全不同的编程语言。

程序设计语言主要分为解释型和编译型两类。Java或C++等语言依赖编译器,将源代码翻译为可直接执行的机器码文件。而JavaScript属于解释型语言,无需编译器,浏览器中的JavaScript解释器直接读取源代码并执行。

Java理论上可部署于多种环境,而JavaScript主要应用于Web浏览器。在语法层面,JavaScript中函数是一等公民,采用基于原型(prototype)的继承机制,其语法灵活性远高于Java。

因此,JavaScript名称的本意即为“类似Java的脚本语言”。

定义

JavaScript是一种动态、弱类型的解释型语言,非常适合面向对象和函数式编程风格。其语法借鉴自Java,一等函数特性源自Scheme语言,而基于原型的继承机制则来自Self语言。

JavaScript主要用于增强网页的动态效果,实现页面与用户之间的实时、动态交互。

JavaScript由三个核心部分组成:ECMAScript、DOM(文档对象模型)和BOM(浏览器对象模型)。

[1] ECMAScript由ECMA-262标准定义,提供核心语言功能(ECMA代表欧洲计算机制造商协会)。

[2] DOM(Document Object Model,文档对象模型)提供访问和操作网页内容的方法与接口。

[3] BOM(Browser Object Model,浏览器对象模型)提供与浏览器交互的方法与接口。

JavaScript与Java的关系及定义

大小写敏感与保留字规范

大小写敏感

JavaScript最显著且必须强调的特性是大小写敏感。其中的关键字、变量名、函数名及所有标识符必须严格保持大小写一致。

例如,'online'、'Online'、'OnLine'和'ONLINE'被视为四个完全不同的变量名。

[注意] HTML语言本身不区分大小写,这与JavaScript不同。

保留字(ReservedWord)

与其他编程语言一样,JavaScript保留了一些标识符供语言内部使用,这些保留字不能作为普通标识符。尽管部分参考书将保留字与关键字分开论述,但实际上关键字仅是保留字的一部分。保留字集合包括关键字、未来保留字、空字面量以及布尔值字面量。

保留字 ReservedWord 的定义如下:

Keyword FutureReservedWord NullLiteral BooleanLiteral

关键字

break do instanceof typeof case else new var catch finally return void continue for switch while debugger function this with default if throw delete in try

未来保留字

以下词汇被用作建议扩展的关键字,因此被保留,以便未来可能采用这些扩展。

class enum extends super const export import

ECMAScript 3版本差异

上述列表为ECMAScript 5标准的保留字。若代码需在基于ECMAScript 3的解释器上运行,应避免使用以下保留字作为标识符,因为ECMAScript 3中的保留字有所不同。

abstract boolean byte char class const double enum export extends final float goto implements import int interface long native package private protected public short static super synchronized throw transient volatile

预定义变量和函数

此外,JavaScript预定义了许多全局变量和函数,开发者应避免将这些名称用作标识符。

arguments Array Boolean Date decodeURI decodeURIComponent encodeURI encodeURIComponent Error eval EvalError Function Infinity isFinite isNaN JSON Math NaN Number Object parseFloat parseInt RangeError ReferenceError RegExp String SyntaxError TypeError undefined URIError

注释语法与空白字符处理

注释(Comment)

并非所有语句都需要JavaScript解释器执行。有时需要在脚本中编写仅供自己参考或提醒的信息,并希望解释器忽略这些内容,这类信息即为注释。

注释有助于理解代码流程,如同生活中的便条,帮助开发者厘清脚本的具体功能。

[注意] 注释必须精确描述代码意图,无用或误导性的注释比没有注释更糟糕。

JavaScript支持多种插入注释的方式,包括单行注释、多行注释和HTML风格注释。

【1】单行注释以两个斜杠开头。

//单行注释

【2】多行注释(又称块级注释)以斜杠和星号/*开头,以星号和斜杠*/结尾。

/* 这是一个多行注释 */ [注意] 块级注释/**/中的字符可能出现在正则表达式字面量中,因此块级注释对于被注释的代码块而言并不绝对安全。 /* var rm_a = /a*/.match(s); */

【3】HTML风格的注释仅适用于单行注释。JavaScript解释器对<!--的处理方式与//类似。

<!-- 这是javascript中的注释

若在HTML文档中使用,还需以-->结束注释。

<!-- 这是HTML中的注释 -->

但JavaScript并不要求这样做,它会将-->视为注释内容的一部分。

[注意] HTML允许上述注释跨越多行,但HTML要求每行开头必须加上"<!--"作为标志。

<!-- 我是注释1 <!-- 我是注释2 <!-- 我是注释3

由于JavaScript解释器处理此类注释的方式与HTML不同,为避免混淆,建议在JavaScript脚本中避免使用HTML风格的注释。

HTML风格的注释

空白(WhiteSpace)

空白字符通常无实际意义,但有时必须使用空白来分隔字符序列,否则它们会被合并为一个符号。

var that = this;

var和that之间的空白不可移除,但其他位置的空白可以移除。

JavaScript会忽略程序中标识符(token)之间的空格。多数情况下,JavaScript也会忽略换行符。由于代码中可自由使用空格和换行,因此可以采用整齐一致的缩进形成统一的编码风格,从而提高代码可读性。


//通过增加空白字符,提高代码可读性
for(var i = 1; i < 10; i++){
//
} 

JavaScript将以下字符识别为空白字符(WhiteSpace)。

\u0009 水平制表符 <TAB> \u000B 垂直制表符 <VT> \u000C 换页符 <FF> \u0020 空格符 <SP> \u00A0 非中断空格符 <NBSP> \uFEFF 字符序标记

JavaScript将以下字符识别为行终止符(LineTerminator)。

\u000A 换行符 <LF> \u000D 回车符 <CR> \u2028 行分隔符 <LS> \u2029 段落分割符 <PS>

分号自动插入机制与例外

可选的分号

JavaScript使用分号(;)分隔语句,这对增强代码的可读性和整洁性至关重要。但JavaScript并非在所有换行处都自动添加分号,仅在缺少分号导致代码无法正确解析时,JavaScript才会自动插入分号。

var a a = 3 console.log(a)

JavaScript将其解析为:

var a; a = 3; console.log(a);

这种自动分隔规则可能导致一些意想不到的情形。

var y = x + f (a+b).toString

JavaScript将其解析为:

var y = x + f(a+b).toString

因此,若希望上述代码被解析为两条独立语句,必须手动在行尾添加显式分号。

两个例外

若当前语句与下一行语句无法合并解析,JavaScript会在第一行后自动插入分号,这是通用规则。但存在两个例外情况。

【1】第一个例外涉及return、break、continue和throw语句。若这四个关键字后紧跟换行符,JavaScript会在换行处自动插入分号。

return true;

JavaScript将其解析为:

return;true;

而代码的本意通常是:

return true;

【2】第二个例外涉及++和--运算符。若将其用作后缀表达式,运算符应与表达式位于同一行。否则,行尾将自动插入分号,同时++或--将作为下一行代码的前缀操作符并与之一起解析。

x ++ y

JavaScript将其解析为:

x;++y;

而代码的本意通常是:

x++;y;

虽然分号并非强制要求,但建议不要省略。添加分号可避免许多错误,行尾缺失分号可能导致代码压缩失败。此外,显式分号在某些情况下还能提升性能,因为解析器无需再推测应在何处插入分号。

作者最新文章