TypeScript(1)——安装与类型声明

203 阅读3分钟

持续创作,加速成长!这是我参与「掘金日新计划 · 6 月更文挑战」的第1天,点击查看活动详情

0. TypeScript介绍

JavaScript的没有变量类型,往往会为项目的维护带来很大的问题,TypeScript主要就是针对这一点做的优化,TS代码有类型检验,此外,我们可以通过TS的编译器将TS代码转换为JS代码,做到兼容,本文从TypeScript的安装开始,介绍一下其类型声明的特点。

1. TypeScript编译器安装

  • 首先,安装TS之前,需要安装node.js(建议直接在官网下载安装包,一键傻瓜式安装);
  • 之后,在终端运行 npm i -g typescript (mac可能需要sudo权限);
  • 安装成功后,我们就可以使用tsc命令对xxx.ts文件进行编译了。

2. 类型信息

2.1 变量类型

// var的类型位var_type(可以省略,省略的话自动推断为val的类型)
// 变量的类型确定后,不能再发生变化,赋值错误的类型值会报错
let var: [var_type] = val 

2.2 函数参数类型

// var的类型位val_type(可以省略,省略的话自动推断为val的类型)
// 变量的类型确定后,不能再发生变化,赋值错误的类型值会报错
function sum(a: number, b: number): number {
    reture a + b;
}

2.3 TS中的类型

  • number 整数或者小数
  • string 字符串
  • 字面量(常量)
  • any 任意类型,相当于关闭了类型检测,不指定类型并且不能推断的话,默认设置为any
  • unknown 不能复制给其他变量,除非用typeof做类型判断或者as "type"做类型声明
  • void never 用于函数返回值类型,表示没有返回值
  • object 对象,可以写成具体的对象格式{name: string, key?: number,[propName: string]: any},必须有name,?指可以没有key属性, [propName: string]: any指可以有任意类型的属性
  • function 可以直接写成箭头函数的形式(a: string b: string) => number
  • array 数组 type[] 或者 Array
  • tuple 元组 固定长度的数组
  • enum enumName{Male = 0, Famale = 1}

2.4 联合类型

// var的类型位var_type1或者var_type2
let var: var_type1 | var_type2 = val 

3. tscconfig.json

配置需要编译哪些文件,以及如何编译,调用tsc命令时会按照该文件执行

  • include ["xx/xx/x"] 表示哪些文件需要被编译; **表示任意目录;*表示任意文件
  • exclude [xx/xx"] 编译时排除哪些目录
  • extends xxx/xxx 继承配置文件
  • files [xx] 直接指定需要编译的女文件名
  • compilerOptions 编译器配置
    • target 编译成的ES版本
    • module 指定要使用的模块化规范
    • lib 指定项目中使用的库
  • outDir "xx/xx" 编译后的文件存在的目录
  • outFile "xx/xx" 将编译后的文件合并为一个
  • allowJs 是否对js文件进行编译,默认为false
  • checkJs 是否检查js代码符合规范。默认为false
  • removeComments 是否移除注释
  • noEmit 不生成编译后的文件
  • noEmitnError 有错误时不生成编译后的文件
  • strict 严格检查总开关
  • alwaysStrict 使用严格模式
  • noImplicitAny 不允许隐式any
  • noImplicitThis 不允许隐式this
  • strictNullChecks 严格判断空值