TypeScript 相关

前端_董

已于 2024-02-23 01:46:37 修改

阅读量439

点赞数 19

文章标签： typescript 前端

于 2024-02-23 01:41:27 首次发布

本文链接：https://blog.csdn.net/qq_23142761/article/details/136245869

版权

本文介绍了TypeScript的基础概念，包括安装、配置、类型系统（如基本类型、联合类型、枚举、null/undefined/never类型、严格模式和类型断言），以及函数重载和typeof运算符的使用。

摘要由CSDN通过智能技术生成

runoob: TypeScript 教程

npm install -g typescript
tsc -v

tsc app.ts
node app.js 

tsc --init

基础类型

any
number
string
boolean
any[] | number[] | Array<number>
[string, number]                     // ['Runoob', 1] 元组

enum Color{Red, Green, Blue};        // 枚举
let c: Color = Color.Blue;
console.log(c); // 2

function name(params:type): void  {} // void

null                                 // null
undefined                            // undefined

// never 是其它类型（包括 null 和 undefined）的子类型，代表从不会出现的值。
// 在函数中它通常表现为抛出异常或无法执行到终止点（例如无限循环）
never

TypeScript配置严格null类型检查strictNullChecks
感谢博友

// 启用 --strictNullChecks
let x: number | null | undefined;

function fn(callback?: () => void) {
  if (callback) {
    callback();
  }
}

变量声明 > 类型断言（Type Assertion）

TypeScript 联合类型（|）、类型断言（<>、as）
感谢博友

// 获取字符串长度
function getLength(v: number | string): number {
    if ((<string>v).length) {
        // string 类型
        return (v as string).length;
    } else {
        // number 类型
        return v.toString().length;
    }
}
// 使用
getLength(1234567);
getLength('1234567');

运算符 > typeof

typeof 是一元运算符，返回操作数的数据类型。

函数 > 函数重载

typescript 函数重载
感谢博友

function functionName(parameter1: type1): returnType1;
function functionName(parameter1: type1, parameter2: type2): returnType2;
// ... 可以定义多个重载声明
function functionName(parameter1: type1, parameter2: type2, ...): returnTypeN;

function functionName(parameter1: type1, parameter2?: type2, ...): returnType {
  // 函数的实际实现
}

const functionName: {
  (arg1: Type1): ReturnType1;
  (arg2: Type2): ReturnType2;
  // ...
  (argN: TypeN): ReturnTypeN;
} = function(arg: any): any {
  // 函数实现
};