type
status
date
slug
summary
tags
category
icon
password
TS是什么
是javaScript类型的超集,它可以编译成纯JS,主要提供了类型系统和对JS新标准的支持
TS特性
始于JS,归于JS
从JS开发者所熟悉的语法和语义开始,可以编译出纯净、简单的JS代码
强大的工具构建大型的应用程序
在开发JS应用程序时使用高效的开发工具和常用操作比如静态检查和代码重构
先进的JS
提供最新的和不断发展的JS特性
TS的优缺点
优点
静态类型检查
代码可读性和维护性更好
兼容JS
缺点
学习成本
开发成本
增加了项目体积
生态系统相对较小
JS与TS的区别
常用类型
数字 字符串 布尔 未定义 空 唯一值
数组(常用第一种)
let arr:number[]
let arr:Array<number>
元组()
let arr:[number,string]=[1,’2’];
类型别名
用关键字type声明
type Arr=类型;
联合类型 |
let demo:(string|number)
函数类型(给函数的参数和返回值声明类型)
function fn(n:number):void{
}
void类型
函数没有返回值,声明void类型
对象
接口
使用接口interface去声明对象类型
interface和type的区别
interface只能为对象声明类型
type可以为任意类型指定别名
使用大驼峰命名
类型断言
使用类型断言来指定更具体的类型
参数 as 类型
<类型>参数
枚举
enum
any
任意类型
高级类型
class类
class类名{
属性:数据类型
constructor{
this.属性:属性值
}
}
用extends继承
类的成员的可见性
public公开的 默认值,可以在类的内部和外部访问
protected 保护的,只能在内部和子类中使用
private私有的,只能在内部使用,实例和子类不可见
readonly只读修饰符,只能在初始化时赋值,并且不能再修改
交叉类型
交叉类型是通过使用&运算符来将多个类型合并成为一个类型
interface 接口1{
属性1:数据类型1
}
interface 接口2{
属性2:数据类型2
}
type 别名=接口1 & 接口2
let 变量名:别名{
属性1:属性值1,
属性2:属性值2
}
泛型
在定义函数、接口或类的时候,不预先指定具体类型,而在使用的时候指定具体类型的一种特性
function 函数名<T>(形参:T):T{
return 参数
}
let str=函数名<数据类型>(实参)
也可以不写类型,TS有类型参数推断,根据传入的参数自动推断出类型变量T的类型(有可能推断的不准确)
泛型工具
interface 接口1{
属性:数据类型;
}
// Partial 把接口1所有属性改变为可选,相当于属性后面加?
type 变量=Partial<接口1>
// Readonly把接口1所有属性改变为只读
type 变量=Readonly<接口1>
// Pick<Type,Keys>从Type中选择属性来构建新的类型
// 注意:第二个参数一定要在第一个参数中有
type 变量=Pick<接口1,’属性’>
// Record<Keys,Type>构建一个对象类型,属性键为Keys,属性类型为Type
type 变量=Record<’属性’,string>
TypeScript类型声明文件
几乎所有的JS应用都会引入许多第三方库来完成任务需求。
这些第三方库不管是否使用了TS编写,最终都要编译成JS代码,才能发布给开发者使用,转换成JS后就没有了类型系统和类型保护等机制。
类型声明文件作用:用来为已存在的JS库提供类型信息。
文件以.d.ts结尾的就是类型声明文件
.ts和.d.ts文件的区别
.ts
是TS源代码文件的扩展名
用于编写和组织原始的TS代码
可以包含TS的语法,类型注解、类、接口等特性
TS是一种静态类型编程语言,他在编译过程中进行类型检查,并将代码编译成JS
.ts文件经过编译器的处理,最终被转换为可执行的JS文件
.d.ts
是TS的声明文件的扩展名
用于描述已有的JS代码库、模块或者类库的类型信息
当我们在TS项目中使用第三方JS库时,通常需要相应的类型定义文件
.d.ts文件主要包含类型声明、接口、命名空间等信息,告诉TS编译器如何处理这些库的类型信息
使用.d.ts文件可以让TS进行类型检查,并提供代码提示
- 作者:昕昕丶未来不是梦
- 链接:https://pisce.buzz/article/web_ts_01
- 声明:本文采用 CC BY-NC-SA 4.0 许可协议,转载请注明出处。