TypeScript 入门：作用域、Object 类型-技术圈

上两篇内容：

作用域问题

即便不同文件中，有相同变量名字，也会出现变量名同名的错误。可以使用立即执行函数，包装作用域。

(  function () {    consta: number =66;    constb: string ='bbb';  })()

立即执行函数并不方便使用，这里我们使用 ES6 中的模块化是以文件为单位的，在代码的末尾，使用 export{} 来标注模块化代码文件，模块与模块之间的作用域是相互独立的。

const a: number =66;const b: string ='bbb';
export{}

真实开发场景下，一般都是使用模块化语法规则导入导出的。

Object 类型

TS 中的 Object 类型，包含了数组、函数和对象。

const f1:object =function(){}const a1:object = []const o1:object = {}
export {}

对象的具体类型限制，标注的对象要具体属性名字及类型，值必须一一对应，不能多也不能少。

// 具体标注对象类型，标注的对象要具体属性名字及类型，值必须一一对应const o2:{n1:number,s2:string} = {n1:666,s2:'xilinglaoshi'}

当然，更专业的还是使用接口的方式。

数组

普通数组的定义

数组的定义有两种方式，使用泛型及普通标注。

// xx:类型<元素类型> const arr:Array<number>= [2,3,66]// 纯数字类型数组const arr2:number[] = [66,77,88]

元组类型

明确元素数量及元素类型的数组。

// 元组类型（多类型的数组）const tuple:[number,string] = [66,'xiling']
// 当作普通数组操作获取const age = tuple[0]const username = tuple[1]// 解构赋值const [ages,names] = tuple

枚举类型

枚举类型在其他编程语言中很是常见，但是 JS 中却没有，枚举类型能做什么什么呢？

先看一个小案例：

const post = {  title:'一块手表的逆袭',  content:'曾经有一块非常廉价的手表，出生在罗马帝国……',  status:0//文章状态 2发表，1未发表, 0草稿}

状态标识 status 属性，容易混乱更容易忘记，还会乱入其他值，以往我们会使用一个对象标注状态，比如：

const PostStatus = {  Draft:0  Unpublished:1,  Published:2}
const post = {  title:'一块手表的逆袭',  content:'曾经有一块非常廉价的手表，出生在罗马帝国……',  status: PostStatus.Published////文章状态 2发表，1未发表, 0草稿}

而如果使用枚举类型，我们就可以这样了：

// 定义枚举类型的数据，enum PostStatus {  Draft=0,  Unpublished=1,  Published=2}
const post = {  title:'一块手表的逆袭',  content:'曾经有一块非常廉价的手表，出生在罗马帝国……',  // 枚举类型的使用与对象一样  status: PostStatus.Published}

看着好像并没有什么区别，其实枚举最大的作用在于可以递增，如果不赋值，则默认从零，如果给第一个赋值，则从第一个数值开始累加。

// 定义枚举类型的数据，enum PostStatus {  Draft=6,//赋值，则累加，不赋值则从 0 开始  Unpublished,  Published}
const post = {  title:'一块手表的逆袭',  content:'曾经有一块非常廉价的手表，出生在罗马帝国……',  // 枚举类型的使用与对象一样  status: PostStatus.Published}
console.log(post)

当然，枚举类型的值，也可以是字符串，但是字符串是无法累加的，因此，极为少见，这里就不介绍了。

我们可以进行编译，然后查看结果。我们能够发现，是一个双向的键值对对象，就是可以通过键获取值，也可以通过值获取键，编译后就能看到，无非就是将表达式作为键存储起来而已。这样做，我们就可以在 ts 中，通过下标的方式，获取枚举的名称了。

如果我们确认在代码中，不会使用使用索引获取枚举名称，那我建议大家使用常量枚举，编译过后我们能在 JS 代码中看到，枚举代码已经被移除了，代码中直接使用了具体的值，并且会使用注释标注类型名称。

// 定义枚举类型的数据，constenum PostStatus {  Draft=6,//赋值，则累加，不赋值则从 0 开始  Unpublished,  Published}
const post = {  title:'一块手表的逆袭',  content:'曾经有一块非常廉价的手表，出生在罗马帝国……',  // 枚举类型的使用与对象一样  status: PostStatus.Published}
console.log(post)

未完待续...

推荐阅读：

前端工程化中的重要环节——自动化构建

效率提升利器：你还害怕自动化部署吗

更新不易，点个“在看”和“赞”吧(●'◡'●)！