TypeScript

最新推荐文章于 2024-08-23 16:41:49 发布

做梦都在睡

最新推荐文章于 2024-08-23 16:41:49 发布

阅读量273

点赞数 2

文章标签： typescript javascript 前端

本文链接：https://blog.youkuaiyun.com/qq_53791154/article/details/129016729

版权

TypeScript是JavaScript的超集，支持静态类型，如number、string和boolean等。它引入了类型注解，用于约定变量的类型，提高代码的严谨性。TS还包括数组类型、联合类型、对象类型等复杂类型，以及void、any等特殊类型。类型别名和接口允许自定义类型。此外，TS中的函数可选参数提高了代码的灵活性。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

什么是TS?

TypeScript，简称 TS，是微软开发的一种静态的编程语言，它是 JavaScript 的超集

简单来说，js 有的 ts 都有，所有js 代码都可以在 ts 里面运行。

ts 支持类型支持，ts = type +JavaScript。

TS? JS?

JavaScript 属于动态编程语言，而ts 属于静态编程语言。

js：边解释边执行，错误只有在运行的时候才能发现

ts：先编译再执行，在写的时候就会发现错误了（ts不能直接执行，需要先编译成 js ）

ts 完全支持 js ，可以直接转换

类型注解

什么是类型注解？

变量后面约定类型的语法，就是类型注解

类型注解作用？

约定类型，明确提示

// 约定变量 length 的类型为 number 类型
let length: number = 18;
length = 19;

: number 就是类型注解，它为变量提供类型约束。

约定了什么类型，就只能给该变量赋值什么类型的值，否则报错。

而且：约定类型之后，代码的提示也会非常清晰。

原始类型

TS 常用类型：

JS 已有类型

简单类型，number string boolean null undefined

复杂类型，对象数组函数

TS 新增类型

联合类型、自定义类型(类型别名)、接口、元组、字面量类型、枚举、void、any、泛型等

let length: number = 18;
let myName: string = '这里是做梦都在睡';
let isLoading: boolean = false;
let nullValue: null = null;
let undefinedValue: undefined = undefined;

数组类型

let numbers: number[] = [1, 3, 5];

let strings: Array<string> = ['a', 'b', 'c'];

联合类型

需求：数组中有 number 和 string 类型

let arr: (number | string)[] = [1, 'a', 3, 'b'];

类型别名

type CustomArr = (number | string)[];
let arr: CustomArr = [1, 'a', 4];

类型别名:

type 类型别名 = 具体类型基本语法

定义类型别名，遵循大驼峰命名规范，类似于变量

使用类型别名，与类型注解的写法一样即可

void 类型

如果函数没有返回值，定义函数类型时返回值类型为 void

const say = (): void => {
  console.log('hi');
};

可选参数

如果函数的参数，可以传也可以不传，这种情况就可以使用可选参数语法，参数后加 ? 即可

const fn = (n?: number) => {
  // ..
};
fn();
fn(10);

对象类型

TS 的对象类型，其实就是描述对象中的属性方法的类型，因为对象是由属性和方法组成的。

// 空对象
let person: {} = {};

// 有属性和方法，一行书写多个属性 ; 分隔
let person: { name: string; sayHi(): void } = {
  name: '18cm_dream',
  sayHi() {},
};