![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=1738809695-PPx3e6liBDGZpGRlxXPoUya52NLEBHBY-0-cb3750ede9e7774ff9ef13e38c85dd2d)
在JavaScript中的注释规则与传统的C语言类似,我们一般使用“//”来定义注释。
2.表达式
几乎在任何编程语言中都存在表达式,表达式由运算符与运算数构成。运算数可以是任意类型的数据,也可以是任意的变量,只要其能支持我们指定的运算即可。JavaScript支持很多常规的运算符,例如算数运算符+、−、*、/等,比较运算符<、>、<=、<=等,示例如下:
【代码片段1-16 源码见附件代码/第1章/4.js.html】
![](https://epubservercos.yuewen.com/CABD60/31397740404941606/epubprivate/OEBPS/Images/Figure-P30_82964.jpg?sign=1738809695-JqZqw55D5Yoj0zH3KTAlffp0rf3VEJ0q-0-31cfb36bc3df830f8b82bf0ae9e0181b)
3.函数的定义与调用
函数是程序的功能单元,JavaScript中定义函数的方式有两种,一种是使用function关键字进行定义,另一种是使用箭头函数的方式进行定义。无论使用哪种方式定义函数,其调用方式都是一样的,示例如下:
【代码片段1-17 源码见附件代码/第1章/4.js.html】
![](https://epubservercos.yuewen.com/CABD60/31397740404941606/epubprivate/OEBPS/Images/Figure-P30_82965.jpg?sign=1738809695-oF4XaSnjeUNS4r944FtWyczRq4hPBXs1-0-494a1c2905114bfc868f4769cf27a1b9)
运行上面的代码,在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=1738809695-urTNsicTRHyXFZpDFnqGMHlVFDmB153b-0-22d84a7e5b6d1289545086f1e7ccff20)
JavaScript中也支持使用switch和case关键字多分支语句,示例如下:
【代码片段1-19 源码见附件代码/第1章/4.js.html】
![](https://epubservercos.yuewen.com/CABD60/31397740404941606/epubprivate/OEBPS/Images/Figure-P31_82967.jpg?sign=1738809695-rrzu2kLaUO5V5AwtqKXT5W3VI9eWJODq-0-ce604ae9967abbfe17b214148667e496)
5.循环语句
循环语句用来重复执行某段代码逻辑,JavaScript中支持while型循环和for型循环,示例如下:
【代码片段1-20 源码见附件代码/第1章/4.js.html】
![](https://epubservercos.yuewen.com/CABD60/31397740404941606/epubprivate/OEBPS/Images/Figure-P31_82968.jpg?sign=1738809695-phsCCWwtxRUltGZjUNkoPzX8twLn7H0B-0-7b92a661945d1b084fa7ff1d1eceeca7)
除此之外,JavaScript还有许多非常强大的语法与面向对象能力,我们在后面的章节中使用时会更加详细地介绍。