TS（一）基础类型

TypeScript是微软开发的一个开源的编程语言，通过在JavaScript的基础上添加静态类型定义构建而成。TypeScript通过TypeScript编译器或Babel转译为JavaScript代码，可运行在任何浏览器，任何操作系统

 相信很多前端程序员早就听说typescript这门语言了，而且Vue3和react等主流前端框架也使用了ts编写，因此ts语言必然是未来前端行业的趋势，此专栏会持续更新，欢迎朋友们指出错误，我会及时改正。

优化编译 

1. 解决TS和JS的冲突问题 (#生成配置文件)

tsc --init

这个 tsconfig.json 配置文件可以更改很多ts的属性，比如开启或关闭严格模式

还可以指定es版本编译（默认是es2016）也就是 ES7，更改的话可以直接写es6或者其他版本

2.设置入口和出口路径

3.自动编译（在终端运行这个命令，可以让你的ts文件自动编译成js文件，无需手动编译）

tsc --watch

注意

ts会自动判断值的类型，如果值的类型和所设置的类型不一致的话会报错，：后面就是你给一个变量设置的类型

 基本类型

// 布尔类型 boolean 
let isBoolean: boolean = true

// 数字类型 number 
let isNumber: number = 1

// 字符串类型 string 
let isString: string = '1'

// es6模板字符串
let names: string = '万叶必出'
let es6String: string = `2.8${names}`
console.log(es6String)

// 数字类型数组 number[]
let numArray: number[] = [1, 2, 3]

// 字符串类型数组 string[]
let strArray: string[] = ['1', '2', '3']

// 数组的第二种写法是使用数组泛型 Array<元素类型>
let arr: Array<number> = [4, 5, 6]

// 任意类型 any(可以设置任何值，相当于关闭了ts的类型检测，非必要不使用)
// 当你只知道一部分数据的类型时，any类型也是有用的
let list: any[] = [1, true, 'free']
list[1] = 100
console.log(list) //[1, 100, 'free']

// 空值类型 void(只能为它赋予undefined 和 null)也可以给没有返回值的函数设置空返回值
let unusable: void = undefined
function warnUser(): void {
  alert('This is my warning message')
}
warnUser()

// Null 和 Undefined (默认是任何类型的子类型，也就是可以给任何类型赋值Null 和 Undefined)
// 但是当你指定了--strictNullChecks标记，null和undefined只能赋值给void和它们各自
let u: undefined = undefined
let n: null = null

// never 类型(never类型是任何类型的子类型，也可以赋值给任何类型)
// 没有类型是never的子类型或可以赋值给never类型,即使any也不可以赋值给never。
// 返回never的函数必须存在无法达到的终点
function error(message: string): never {
  throw new Error(message)
}

// 元组类型 Tuple (允许表示一个已知元素数量和类型的数组，各元素的类型不必相同)
let tuple: [string, number]
tuple = ['1', 1]
// 注意: 虽然可以越界添加元素（不建议），但是不能越界访问，越界访问会提示错误。
// tuple.push('2')
// console.log(tuple)  //['1', 1, '2']

// 枚举类型 enum 是对js标准数据类型的一个补充,使用枚举类型可以为一组数值赋予友好的名字。
enum str {
  red,
  green,
  blue
}
console.log(str) //{0: 'red', 1: 'green', 2: 'blue', red: 0, green: 1, blue: 2}
// 默认情况下，从0开始为元素编号，你也可以手动指定成员的值
enum strHandle {
  '万叶',
  '可莉' = 5,
  '宵宫'
}
console.log(strHandle) //{0: '万叶', 5: '可莉', 6: '宵宫', 万叶: 0, 可莉: 5, 宵宫: 6}
let str1: strHandle = strHandle.宵宫
console.log(str1) //6

// 类型断言(指定一个参数或变量为某一种类型)
// 第一种写法
let someValue: any = 'this is a string'
let strLength: number = (<string>someValue).length
console.log(strLength) //16
// 第二种写法
let someValue1: any = 'this is a new string'
let strLength1: number = (someValue1 as string).length
console.log(strLength1) //20