一、typescript简介
其用法与es6的使用方法一直
注意点
- 使用参数时，需要先声明参数的类型，才可以使用
class Person {
name:string;
age:number
constructor(name:string,age:number){
this.name=name;
this.age=age;
}
say():any{
return `${this.name}-${this.age}`
}
static food:string
static eat(){
return `${this.food}`
}
}
let p=new Person('wds',23);
Person.food='danta'
Person.eat()
console.log(p.say(),Person.eat())
二、类修饰符
可以对属性和方法进行就是，从而限定其适用范围，下面是属性修饰符
- public 可以在内部、子类、外部中使用
- protected 可以在内部、子类，不可以在外部中使用
- private 可以在内部，不可以在子类、外部中使用
- readonly 只读属性
class Person {
public name:string;
protected book:string
private age:number
constructor(name:string,age:number,book:string){
this.name=name;
this.age=age;
this.book=book
}
say():any{
return `${this.name}-${this.age}`
}
static food:string
static eat(){
return `${this.food}`
}
}
let p=new Person('wds',23,'book');
class Son extends Person{
constructor(name:string,age:number,book:string) {
super(name,age,book)
}
}
二、方法修饰符
使用方法与属性修饰符一致
class Person {
public name:string;
protected book:string
private age:number
protected constructor(name:string,age:number,book:string){
this.name=name;
this.age=age;
this.book=book
}
say():any{
return `${this.name}-${this.age}`
}
static food:string
static eat(){
return `${this.food}`
}
}
// 只可通过子类来创建对象
// let p=new Person('wds',23,'book');
class Son extends Person{
constructor(name:string,age:number,book:string) {
super(name,age,book)
}
}
三、可选属性与参数属性
可选属性是其可以进行传入或者不传入的时候，不报错
参数属性和修饰符类似，简化代码操作
// 可选属性
class Person {
name:string;
age:number
constructor( name:string, age?:number) {
this.name=name;
this.age=age;
}
}
let p= new Person('wds');
console.log(p)
// // 参数属性，简化操作
class Person {
constructor(public name:string,public age:number,public book:string) {
}
}
let p= new Person('wds',36,'book');
四、类存储器
typescript中的存储和读取与es的使用方法一直。即get和set方法。
//类存储器
class Person{
private _age:number=0;
set age(val:number){
if(val>0){
this._age=val
}else{
throw new Error('人的年龄不小于零')
}
}
get age(){
return this._age
}
}
let p=new Person();
p.age=34;
console.log(p.age)
console.log(p);
五、抽象类
抽象类是用来定义基类的方法，其本身不可用于创建对象。抽象类可以和接口一样用来约束子类。
//抽象类
abstract class Person{
abstract name:string;
abstract say():void;
eat():void{//方法实现，在接口中无法使用
console.log('chile')
}
}
class Son extends Person{
name:string='';
say():void{
}
}
let s=new Son()
s.eat()
console.log(s);
注意点
- 抽象类中可以实现方法，但是接口中无法进行实现
六、类'实现'接口和接口继承类
1、类实现接口
接口也可以用来约束子类
interface PersonInterface{
name:string;
say():void;
}
class Person implements PersonInterface{
name:string='lnj';
say():void{
console.log(this.name)
}
}
let p=new Person()
console.log(p)
p.say()
2、接口继承类
接口只继承类中属性和方法的声明，但不继承属性和方法的实现。
class Person{
protected name:string;
protected say():void{
console.log(this.name)
}
}
interface PersonInterface extends Person{
gender:string;
}
class Son extends Person implements PersonInterface{//存在protected修饰的字符时，需要extends继承Person
gender:string='name';
name:string='wds';
say():void{
console.log(this.name,this.gender)
}
}
let son=new Son();
console.log(son);
注意点
- 如果类中存在protected修饰符修饰的属性和方法时，那么只有这个类的子类可以实现这个接口
七、泛型和类
其使用方法和函数泛型类似。
class Chache<T>{
arr:T[] = [];
add(value:T):T{
this.arr.push(value);
return value
}
all():T[]{
return this.arr
}
}
let c=new Chache();
c.add(1);
c.add(2),
c.add(3);
console.log(c.all())
八、接口合并现象
如果存在接口同名，那么接口内容就会进行合并。
interface setName{
name:string;
}
interface setName{
age:number;
}
class Person implements setName{
name:string;
age:number;
}
九、自动类型推断
当ts没有对变量或者函数等进行类型标记，ts会进行类型推断。
1、当对变量进行初始化同时进行赋值，ts会进行自动类型推断，
let a=1;
a=false;//会报错
2、根据上下文进行自动类型推断。
window.onmousedown=(event)=>{
event.target;//会存在提示信息
}
