TypeScript入门 青训营笔记

108 阅读2分钟

这是我参与第五届青训营伴学笔记的第四天

vscode直接支持typescipt

静态类型 弱类型语言

静态类型

可读性强 可维护性增强 在多人合作的大型项目中有更好的稳定性

被称为js的超集

包含于兼容所有js特性,支持共存

支持渐进式引入与升级

编辑器还是用vscode

2.基本语法

基础数据类型

const q:string='string';

const 变量名:数据类型=' ';

对象类型

interace ibyteancer{

readonly joid:number;/*只读属性:约束属性不可在对象初始化外赋值*/
name:string;
sex:'man'  |'woman' |'other';/*     */
age:number;
hoppy?:string;
[key:string]:any;


}

函数类型

function add(x,y){
return x+y;
} 
const mult=(x,y)=>x*y;

使用对象设置函数
interface IMult{
(x:number,y:number)
}

函数重载

可以更好的判断输入的数据类型

type Types = number | string;
// 重载签名
function add(x: number, y: number): number;
function add(x: string, y: string): string;
function add(x: string, y: number): string;
function add(x: number, y: string): string;
function add(x: Types, y: Types) {
    if (typeof x === 'string' || typeof y === 'string') {
        return x.toString() + y.toString();
    }
    return x + y;
}
const result = add('hearts', ' spades');
result.split(' ');

数组类型

这里的数组就是一种特殊的对象

类型方括号表示 type IArr1=number[];

type IArr2=Array<string|number|Record

const arr1:IArr1=[]

泛型

泛型、泛型方法、泛型类、泛型接口 不预先指定具体的类型,而在使用的时候再指定类型的一种特性

使用在函数中

对象,类,别名

语法 泛型约束:限制泛型必须符合字符串 使用extend进行类型限定

泛型默认类型

类型别名&类型断言

类型别名会给一个类型起个新名字。 类型别名有时和接口很像, 但是可以作用于原始值,联合类型,元组以及其它任何你需要手写的类型。

类型断言 手动指定一个值的类型 值as类型

字符串 数字 字面量

允许指定字符串 数字必须的固定值

3.高级类型

联合交叉类型

联合类型 联合类型 | 表示一个值可以是几种类型之一 交叉类型 & 多种类型叠加在一起成为一种类型,它包含了所需的所有类型的特性

类型保护与类型守卫

类型保护 访问联合类型时,处于程序安全,仅能访问联合类型的交集部分

类型守卫 定义一个函数,它的返回值是一个类型谓词,生效范围为子作用域 返回布尔值

高级类型

函数的返回值类型

工程应用

webpack

node