学习TypeScript-基础篇

407 阅读2分钟

一、安装TypeScript

npm i typescript -g

npm init 初始化目录

tsc --init 目录生成tsconfig.json文件

{
  "compilerOptions": {
    "target": "es5",                            // 指定 ECMAScript 目标版本: 'ES5'
    "module": "commonjs",                       // 指定使用模块: 'commonjs', 'amd', 'system', 'umd' or 'es2015'
    "moduleResolution": "node",                 // 选择模块解析策略
    "experimentalDecorators": true,             // 启用实验性的ES装饰器
    "allowSyntheticDefaultImports": true,       // 允许从没有设置默认导出的模块中默认导入。
    "sourceMap": true,                          // 把 ts 文件编译成 js 文件的时候,同时生成对应的 map 文件
    "strict": true,                             // 启用所有严格类型检查选项
    "noImplicitAny": true,                      // 在表达式和声明上有隐含的 any类型时报错
    "alwaysStrict": true,                       // 以严格模式检查模块,并在每个文件里加入 'use strict'
    "declaration": true,                        // 生成相应的.d.ts文件
    "removeComments": true,                     // 删除编译后的所有的注释
    "noImplicitReturns": true,                  // 不是函数的所有返回路径都有返回值时报错
    "importHelpers": true,                      // 从 tslib 导入辅助工具函数
    "lib": ["es6", "dom"],                      // 指定要包含在编译中的库文件
    "typeRoots": ["node_modules/@types"],
    "outDir": "./dist",
    "rootDir": "./src"
  },
  "include": [                                  // 需要编译的ts文件一个*表示文件匹配**表示忽略文件的深度问题
    "./src/**/*.ts"
  ],
  "exclude": [
    "node_modules",
    "dist",
    "**/*.test.ts",
  ]
}

二、基础类型(小写仅表示类型,大写为javascript关键字)

boolean、number、string、void、undefined、null、symbol、bigint

1、boolean :布尔型

const isFlag: boolean = true;

2、number:数字型

JavaScript中的二进制、十进制、十六进制等数都可以用 number 类型表示。

const decLiteral: number = 6;
const hexLiteral: number = 0xf00d;
const binaryLiteral: number = 0b1010;
const octalLiteral: number = 0o744;

3、string:字符串

const str: string = 'i am a sting';

4、void:空值表示没有任何类型

nullundefined可以赋给void:

const a: void = undefined

5、undefined和null

默认情况下 null 和 undefined 是所有类型的子类型

let u: undefined = undefined;
let n: null = null;

正式项目中,如果开启--strictNullChecks 检测,则null 和 undefined 只能赋值给void和他们各自。

6、Symbol:是ES2015之后成为新的原始类型, 他通过 Symbol 构造函数创建:

const sy1 = Symbol('key1');
const sy2 = Symbol('key2');

Symbol的值是唯一不变的:

Symbol('key1') === Symbol('key2');

7、BigInt:bigInt 类型在typescript3.2版本中内置,可以存储和操作大整数

在TypeScript中,number 类型虽然和 BigInt 都是有表示数字的意思,但是实际上两者类型是不同的:

declare let foo: number;
declare let bar: bigint;

foo = bar; // error: Type 'bigint' is not assignable to type 'number'.
bar = foo; // error: Type 'number' is not assignable to type 'bigint'.


摘自:掘金小册《深入浅出TypeScript: 从基础知识到类型编程》