TypeScript 入门：作用域、Object 类型

上两篇内容：

我们为什么要学习 TypeScript？

TypeScript 入门应用：类型系统和配置文件

作用域问题

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

(
  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)

未完待续...