TypeScript简明教程02---类型声明汇总

在简单的了解过TS是什么以及对应的开发环境搭建之后，我们进入了类型声明的学习，关于基本数据类型、函数等相关的类型声明，在开始具体的类型声明学习之前我们先来解决几个小的问题吧。

一、不同的TS文件中声明同一个变量报错？

如下图所示，我们在01和02两个文件夹中都声明了变量a，可以明显的看到编译器红色报错i提示：那么如何解决这一个问题呢？

那么如何解决这一个问题呢？

首先在任意的ts文件中声明的变量默认为全局的作用域，全局作用域中存在两个同名的变量必然会导致编译器报错，解决这个问题的思路就在这里了。我们在每个文件中使用export{}就可以消除报错信息，原因是只要ts文件中存在export关键字，编译器就会认为此文件为模块，对应声明的变量的作用域也就自然是模块内的啦，冲突也就消除了。

二、如何查看编辑代码的运行效果？

想要查看我们编辑ts代码的运行效果，就必须先对ts文件使用tsc进行编译成js，在创建index.html文件引入在浏览器页面查看效果。

对于02_basisType.ts编译后运行

 02_basisType.js引入到index.html页面中执行可以在浏览器的控制台看到如下的效果：

 三、编译成功后的JS文件中的变量声明为什么是var？

    从下图中02编译完成后的变量使用的是var关键字，而我们在对应的ts文件中使用的是let，这是为什么呢？

    因为ts文件在使用tsc进行编译的时候，可以编译成目前已经支持的任意版本的JS文件，在没有进行相关的配置的时候默认为ES3版本的JS,而此版本使用var进行声明也就不足为奇了。

    到此为止，几个关键的问题已经解决，接下来就是纯粹的类型声明学习了。

 四、基本数据类型声明

   1、字面量类型声明

         顾名思义，就是直接将a的值作为类型声明，此时相当于声明了一个常量，a的值不可以更改。

  2、特殊any和unkonw的类型声明

      使用此类型作为声明时，变量b的类型可以是任意的，此类型声明一般用于对于类型没有要求或者暂时不清楚其具体的类型。

 unknow类型和any类似，也是对于变量的类型不做具体的限制，但是其仅限于对于自身类型的限定。

 3、类型断言和函数的特殊返回值void和never

      类型断言是在某些情况对变量的类型再一次强调确认。需要在进行类型声明的时候，可以使用逻辑运算符|来实现多种类型的声明，不局限于函数，对于任意的声明也同样的适用。函数返回值类型声明void的表示返回值为空，而never表示的是函数体内终止了代码的运行，如抛出异常等。

 4、对象与函数的类型声明

      对于对象和函数的类型声明，更多的是对其参数类型、返回值类型，以及对象中属性的类型进行声明，将某个变量直接仅声明为函数或者对象而言是没有任何意义的。[propsName:string]:any可以实现对于直接声明类型以外的剩余所有的属性进行类型声明。

 5、数组类型声明和元组的概念

      数组进行类型声明的意义在于限定数组中存储元素的数据类型，使得对数组进行处理更加方便。所谓的元组，就是固定长度的数组，需要对每一个元组元素进行类型声明。

元组的概念以及其定义

6、枚举enum与逻辑运算符&

    枚举enum是TS中新增的一种数据类型，当某个参数存在多个值可选，可以适用枚举其所有可能进行类型的声明，限定此参数所取值范围不得超过枚举类中的类型数。

 逻辑运算符&可以将两个类型声明进行连接，使得变量满足多个类型声明。

 五、总结归纳

          在上文中对ts中基本数据类型number、string、boolean等类型声明进行了介绍，并通过代码演示了其语法结构。函数、对象、数组的类型声明更多的是对于其内部元素属性的声明，对于多种取值可能的参数进行类型声明时，我们使用了TS种新引入的枚举enum，下表是对TS种所有类型声明进行的总结。在此处再理清楚一下有关类型声明的语法对于后续的学习有更大的益处。

 

此篇博客主要讲述了TypeScript关于类型声明的基本语法，以及初学者可能碰到的几个疑惑或问题。学习语法无疑是枯燥无味的，核心方法还是要多看，多写，才能更好的提高技术能力。