interface 和type区别
interface:接口,定义一些引用类型的,比如 class
function
,
但可以通过extends
进行继承,
可以添加新字段,也就是声明合并
interface Obj {
name: string,
isH: boolean,
age: number
}
interface Obj {
aa: string
}
interface Obj2 extends Obj {
sex: string
}
const obj: Obj2 = {
name: 'fff',
isH: true,
age: 22,
sex: 'ff',
aa: 'aa'
}
type类型别名 可以用来定义所有的类型(包括基础类型)的类型别名,或者一些联合类型的别名,无法通过extents进行继承, 但可以通过交叉进行继承 不可以添加新字段
type typeObj = {
name: string
}
type typeStr= string | number | object
const a: typeStr = 11
const obj2: typeObj = {name: 'name'}
react 与TS
对于基本类型 useState("")
TS会进行类型推断 从而确定参数的类型是否正确
const [name, setName] = useState("");
setName(1)
// 类型“number”的参数不能赋给类型“SetStateAction<string>”的参数。
setName('1')
对于引用类型 比如数组 对象等,需要用范型定义传入的类型
const [names, setNames] = useState([])
setNames([{ a: 1 }])
// 不能将类型“number”分配给类型“never”。
const [names, setNames] = useState<{a: number}[]>([])
setNames([{ a: 1 }])
全局变量 window的扩展
使用类型断言
window.a = 1
// 类型“Window & typeof globalThis”上不存在属性“a”。
// 类型断言
interface Widnow {
[key: string]: any
}
(window as Widnow).a = 1