![TypeScript+Vue.js前端开发从入门到精通](https://wfqqreader-1252317822.image.myqcloud.com/cover/200/52842200/b_52842200.jpg)
1.4.2 JavaScript语法简介
JavaScript语言的语法非常简单,入门很容易,对于开发者来说上手也非常快。其语法不像某些强类型语言那样严格,语句格式和变量类型都非常灵活。当然,这种灵活有好处,也有局限性,后面会详细介绍。
1.变量的定义
JavaScript使用var或let来定义变量。其使用var定义和let定义会使得变量的作用域不同。在定义变量时,无须关心变量的类型,示例如下:
【代码片段1-15 源码见附件代码/第1章/4.js.html】
![](https://epubservercos.yuewen.com/CABD60/31397740404941606/epubprivate/OEBPS/Images/Figure-P30_82963.jpg?sign=1739403809-MvgE776TBueEkOIMydc9jtOW4dRLA4Hn-0-073b269ff1a048fef79d2cae8a02ea61)
在JavaScript中的注释规则与传统的C语言类似,我们一般使用“//”来定义注释。
2.表达式
几乎在任何编程语言中都存在表达式,表达式由运算符与运算数构成。运算数可以是任意类型的数据,也可以是任意的变量,只要其能支持我们指定的运算即可。JavaScript支持很多常规的运算符,例如算数运算符+、−、*、/等,比较运算符<、>、<=、<=等,示例如下:
【代码片段1-16 源码见附件代码/第1章/4.js.html】
![](https://epubservercos.yuewen.com/CABD60/31397740404941606/epubprivate/OEBPS/Images/Figure-P30_82964.jpg?sign=1739403809-kYUKEUfw3xkGWpVHbJNFuC3OVCJUcjpt-0-9cc1d717a5f2f34b78606de4189857c6)
3.函数的定义与调用
函数是程序的功能单元,JavaScript中定义函数的方式有两种,一种是使用function关键字进行定义,另一种是使用箭头函数的方式进行定义。无论使用哪种方式定义函数,其调用方式都是一样的,示例如下:
【代码片段1-17 源码见附件代码/第1章/4.js.html】
![](https://epubservercos.yuewen.com/CABD60/31397740404941606/epubprivate/OEBPS/Images/Figure-P30_82965.jpg?sign=1739403809-Zs3I6EaJbJF7Y5o3j4RfOTeIN9ONbsC8-0-a035e72e9c83fb2d00188d71021539b0)
运行上面的代码,在VS Code开发工具的控制台可以看到输出的信息。console.log函数用来向控制台输出信息。
4.条件分支语句
条件语句是JavaScript进行逻辑控制的重要语句,当程序需要根据条件是否成立来分别执行不同的逻辑时,就需要使用条件语句,JavaScript中的条件语句使用if和else关键词来实现,示例如下:
【代码片段1-18 源码见附件代码/第1章/4.js.html】
![](https://epubservercos.yuewen.com/CABD60/31397740404941606/epubprivate/OEBPS/Images/Figure-P31_82966.jpg?sign=1739403809-QleERz7kwI3fo2BMv70iT9kN9YAhnDcT-0-8047802e7f985147ca199a9552ac0b67)
JavaScript中也支持使用switch和case关键字多分支语句,示例如下:
【代码片段1-19 源码见附件代码/第1章/4.js.html】
![](https://epubservercos.yuewen.com/CABD60/31397740404941606/epubprivate/OEBPS/Images/Figure-P31_82967.jpg?sign=1739403809-gTP51qRcX4tFNoL1nYwNzAPzd0irDxKM-0-c45ecaaac0fe82809a87274e541d72d3)
5.循环语句
循环语句用来重复执行某段代码逻辑,JavaScript中支持while型循环和for型循环,示例如下:
【代码片段1-20 源码见附件代码/第1章/4.js.html】
![](https://epubservercos.yuewen.com/CABD60/31397740404941606/epubprivate/OEBPS/Images/Figure-P31_82968.jpg?sign=1739403809-WaTNJbIdIy4ZK43QZNXJNsc70ZVWi8q7-0-cdc1ef31a2d9660e179281c16c59f039)
除此之外,JavaScript还有许多非常强大的语法与面向对象能力,我们在后面的章节中使用时会更加详细地介绍。