建设网站学什么条件,wordpress设计网页游戏,海淀网站制作服务公司,做推广公司typescript是js的超集#xff0c;目前很多前端框架都开始使用它来作为项目的维护管理的工具#xff0c;还在不断地更新#xff0c;添加新功能中#xff0c;我们学习它#xff0c;才能更好的在的项目中运用它#xff0c;发挥它的最大功效
//readonly 只能修饰属性#x…typescript是js的超集目前很多前端框架都开始使用它来作为项目的维护管理的工具还在不断地更新添加新功能中我们学习它才能更好的在的项目中运用它发挥它的最大功效
//readonly 只能修饰属性不能修饰方法 //readonly修饰的属性必须手动添加明确的类型否则就是字面量类型
class Person {//只读属性readonly age:number 18constructor(age:number) {this.age age}//错误展示// readonly setAge() {// // this.age 20// }
}//接口或者{}表示的对象类型,里面的属性也是可以用readonly来修饰的
interface IPerson{readonly name:string
}let obj: IPerson {name:JACK
}obj.name rose//类型兼容性 //分为结构化类型系统和标明类型系统 //TS采用的是结构化类型系统也叫duck typing(鸭子类型) //类型检查关注的是值所具有的形式 //也就是在结构类型系统中如果两个类型对象具有相同的形状则认为他们属于同一类型
class Point {x: numbery:number
}class Point2D {x: numbery:number
}const p: Point new Point2D()//如果在表明类型系统中c#,java则两个类型不是同的
class Point3D{x: numbery: numberz:number
}const p1: Point new Point3D()
const p2: Point new Point()//错误演示
const p3: Point3D new Point()//Point3D 至少与Point相同则Ponit兼容Point3D
//所以成员多的Ponit3D可以赋值给成员少的Ponit
//接口之间的兼容性类似于class
//函数之间的兼容性比较复杂 //参数个数参数多的的兼容参数少的即参数少的可以赋值给参数多的 //参数类型,相同位置的参数类型要相同原始类型或兼容对象类型 //返回值类型
type F1 (a: number) void
type F2 (a: number, b: number) voidlet f1: F1
let f2: F2 f1//错误演示,参数多的不能付给参数少的
let f3: F1 f2//参数多的兼容少的少的可以赋值给多的
const arr [1,2,3,4,5]const a1 arr.map((el) el)const a2 arr.map(() console.log(1111111))type F3 (a: number) string
type F4 (a: number) stringlet f4: F3
let f5:F4
f4 f5
f5 f4//技巧:将对象拆开把每个属性看做一个个参数参数少的就可以赋值给参数多的
//返回值类型 //如果返回值类型是基本类型相同则互相兼容
type F8 () string
type F9 () stringlet f8: F8
let f9: F9 f8
f8 f9//若果是对象类型则成员多的可以赋值给少的
type F10 () {name:string}
type F11 () { name: string, age: number }let f10: F10
let f11: F11f10 f11
//错误演示
f11 f10//交叉类型 //类似于接口继承用于组合多个类型为一个类型常用语对象类型 //是新类型同时具备了多个类型的属性类型
interface Person {name:string
}interface Age{age:number
}type IPerson Person Agelet obj: IPerson {name: GAOFENG,age: 20,
}type P {name:string}
type A { age: number }type C P Alet obj2: C {name: gaogeng,age:30
}//交叉类型和接口继承的对比
//相同点:都可以实现对象类型的组合 //不同点实现继承时处理同名类型冲突的方式不一样 //接口继承会报错交叉类型没有错误
interface A1 {fn:(a:string) string
}
interface B1 extends A1 {fn:(a:number) string
}interface C1 {fn:(a:number) string
}type C4 A1 C1let c: C4 {fn(name:string|number) {// return name as stringreturn stringname}
}
c.fn(task...)
c.fn(33333)
