TS函数与类

TS函数

1.1函数的基本使用

函数分为匿名函数，命名函数(有名函数、普通函数)，箭头函数，接口函数（函数起别名）

1.1.1 匿名函数

简单来说就是没有定义名字的，可以节省内存中变量定义空间

const myFun=function(a:string,b:string):string{
    return b
}
let result=myFun("张三","李四")
console.log(result)
​

1.1.2 有名函数 |命名函数 | 普通函数

顾名思义就是有名字的函数，可以通过函数名调用

function myFun_1(hour:number,sell:number):void{
    console.log(`我一天学习${hour}小时`)
}
myFun_1(8,1)

1.1.3 箭头函数

const myFun_2=(set:string):void=>{
console.log(set)
}

函数体就一行可以简写

const myFun_2=(set:string):void=>console.log(set)
​
    myFun_2("今天又是美好的一天")
​

1.1.4 接口函数 (给函数起别名)

 type Mfun=(x:number,y:number)=>number
    let myFun_3:Mfun=(c:number,d:number)=>c+d+200
    const re=myFun_3(1,9)
    console.log(re)

1.2 函数参数的处理

分为：可选参数、参数的默认值、 函数的剩余参数

1.2.1 可选参数

与可选属性一样加上一个(?)问号

const fun:(x:number,y?:number)=>number=(a:number,b?:number)=>{
    return a
}
console.log(fun(200))
const fun_2=function(x:number,y?:number):number{
    return x
}

1.2.2 参数的默认值

参数的默认值就是如果不给它传递参数就会按照默认值来，如果传递了就按照传递的进行

const fun_3=function(x:number=100,y:number=500,z:number=400){
    console.log(x+y+z)
}
fun_3(100,200,300)
fun_3(100,200)
fun_3()

1.2.3 函数的剩余参数

剩余参数使用扩展运算符三个点(...)

const fun_4=function(...args:any[]){
    console.log(args)
}
fun_4(4,5,3,4,"zahns","李四")
​
const fun_5=function(a:number,b:string,...args:any[]){
    console.log(a)
    console.log(b)
    console.log(args)
}
fun_5(200,"展示",12,20,45,5,"李四")

1.3 构造函数

如果是普通的就要调用之后在赋值而构造函数在调用的时候已经把参数传过去了

export default{}
// 实例化
const myfunc=new Function("a","b","return a+b")
// 给了具体的值 调用
let result=myfunc(10,20)
console.log(result)

1.4 函数的重载

1.重载是方法名字相同，而参数不同，返回类型可以相同也可以不同

2.每一个重载的方法（或者构造函数） 都必须有一个独一无二的参数类型列表

3.如果参数类型不同，则参数类型应设为any

1.4.1 普通

function myfunc(x:number,y:number):number
function myfunc(x:string,y:string):string
function myfunc(x:number,y:string):string
function myfunc(x:string,y:number):number

function myfunc(a:any,b:any):any{
    return a+b
}
let a=myfunc(1,2)
myfunc("张三","李四")
myfunc(10,"展示")
// console.log(a)

console.log(myfunc("李四",20))

1.4.2 参数的数量不同

参数数量不同时你可以将不同的参数设置为可选

function myFun(x:number):number
function myFun(x:string,y:number):string

function myFun(a:any,b?:any):any{
    return a+b
}
myFun(1)
myFun("展示",2)

TS 类

2.1 类的基本使用

定义：

1.TS是面向对象的JS

2.类描述了所创建的对象共同的属性和方法

3.TS支持面向对象的所以特性 ， 如：类、接口等

export default {}


// 类的基本使用
class Person{
    // 字段（属性）
    name:string
    age:number

    // 构造函数
    constructor(name:string,age:number){
        this.name=name
        this.age=age
    }
    // 函数（方法）
    sayHello():void{
        console.log(`我是一名学生我就${this.name},我今年${this.age}岁了`)
    }
}
// 实例化类
let p=new Person("张三",20)
p.sayHello()

注：constructor里面的this指的是Person这个类，前面的this.name表示的是Person类里面的属性,后面的name是构造函数传递的形参，名字随便可以是a、x等，但是为了名字有意义尽量一样

2.2 类的继承

1.类的继承和接口的继承的继承很相似，都是使用关键字extends， 2.Typescript支持继承类，即我们可以在创建类的时候继承一个已存在的类，这个已存在的类称为父类，继承它的类称为子类，子类除了不能继承父类的私有成员(方法和属性)和构造函数，其他的都可以继承。 3.TypeScript一次只能继承一个类，不支持继承多个类，但TypeScript支持多重继承（A继承B，B继承C)。语法格式

export default {}


// 父
class Person{
    // 字段（属性）
    name:string
    age:number
    // 构造函数
    constructor(name:string,age:number){
        this.name=name
        this.age=age
    }
    // 函数（方法）
    sayHello():void{
        console.log(`我是一名学生我就${this.name},我今年${this.age}岁了`)
    }
}
// 子
class Student extends Person{
    scor:string
    constructor(name:string,age:number,scor:string){
        // super调用父类里面一些东西
        super(name,age)
        this.scor=scor
    }
    sayHello(): void {
        // 调用父类里面的方法
        super.sayHello()
        // 重写父类的方法
        console.log(`我叫${this.name},今年${this.age}岁了，成绩为${this.scor}`)
    }
}
// 实例化
let s=new Student("张三",20,"100")
s.sayHello()

2.3 static和instanceof

2.3.1 static

static关键字用于定义类的数据成员(属性和方法)为静态的，静态成员可以直接通过类名调用

export default{}


class Person{
    // static关键字用于定义类的数据成员（属性和方法）为静态的，静态成员可以直接通过类名调用
    static scor:string
    static say():void{
        console.log(`我是静态方法${this.scor}`)
    }
}
Person.scor="静态的"
Person.say()

2.3.2 instanceof

instanceof运算符用于判断对象是否是指定的类型，如果是返回true，否则返回false

class Stude{}
// p就是对象   Stude()就是类型
let p=new Stude()
let isStude=p instanceof Stude
console.log(`p是Stude实例来的吗？`,isStude)

class a extends Stude{}
let a1=new a()
let isStude_1=a1 instanceof Stude
console.log(isStude_1)
// console.log(Person instanceof Number);

2.4 类中的修饰符

2.4.1 public、protected、private

public 默认：公有的，可以在任何地方访问

protected 受保护的：可以被其自身以及子类访问

private 私有：只能被其定义所在的类访问

export default{}


class Person{
    // 默认：公有的，可以在任何地方访问
    public name:string
    // 受保护的：可以被其自身以及子类访问
    protected age:number
    // 私有：只能被其定义所在的类访问
    private sex:string
    constructor(name:string,age:number,sex:string){
        this.name=name
        this.age=age
        this.sex=sex
    }
    sey():void{
        console.log(`我的名字${this.name},我的年龄${this.age}，我的性别${this.sex}`)
    }
}

class Studen extends Person{
    scor:string
    constructor(name:string,age:number,sex:string,scor:string){
        super(name,age,sex)
        this.scor=scor
    }
    sey(): void {
        console.log(this.name)
        console.log(this.age)
        // console.log(this.sex)报错因为是私有的
        console.log(this.scor)
    }
}
let p=new Studen("张三",20,"男" ,"A")
p.sey()

2.4.2 readonly

readonly:可以使用readonly关键字将属性设置为只读的，只读属性必须在声明时或构造函数里被初始化

class Print{
    readonly str1:string="我是声明时赋值"
    readonly str2:string
    readonly str3:string
    readonly str4:string
    readonly str5:string
    constructor(str2:string,str3:string,str4:string,str5:string){
        this.str2=str2
        this.str3=str3
        this.str4=str4
        this.str5=str5
    }
}
let s=new Print("我是构造函数赋值的2","我是构造函数赋值的3","我是构造函数赋值的4","我是构造函数赋值的5")
console.log(s.str1)
console.log(s.str2)
console.log(s.str3)
console.log(s.str4)
console.log(s.str5)

2.5 getter和setter

通过getter/setter来截取对对象成员的访问

export default{}

class Person{
    private _fullName:string="扎实"
    // get 读取字段的值
    get fullName(){
    console.log("get")
        return this._fullName
    }
    // set 为字段赋值
    set fullName(newName:string){
    console.log("set")
     this._fullName=newName
    }
}
let p=new Person()
p.fullName="李四"
console.log(p)

console.log(p.fullName)

注意点：

1.如果存在get，没有set，则该属性自动是只读的

2.如果没有只读setter参数的类型，他将从getter的返回类型中推断出了

3.访问器和设置器必须有相同的成员可见性

2.6抽象类

定义：

1.抽象类作为其他派生类的基类使用。他们一般不会被直接实例化

2.抽象类是专门用于定义那些不希望被外界直接创建的类的

3.抽象类和接口一样用于约束子类

抽象类和接口的区别

1.抽象类方法必须包含abstract关键字并且可以包含访问修饰符

2.接口中只能定义约束，不能定义具体实现，而抽象类中

abstract class Person{
    abstract name:string
    abstract age:number
    abstract show():string
    showName(){
        console.log("hello word")
    }
}
class Stude extends Person{
    name: string="张三"
    age: number=60
    show(): string {
        return "他的学习很好"
    }
}
let s=new Stude()
console.log(s.age)
console.log(s.show())
s.showName()

2.7

2.8 类的初始化顺序

1.父类的字段初始化

2.父类的构造函数

3.子类的字段初始化

4.子类的构造函数

class Old{
    name:string="张三"
    constructor(){
        console.log(`我的名字叫${this.name}`)
    }
}
class Yong extends Old{
    name: string="李四"
    constructor(){
        super()
        console.log(`我的名字叫${this.name}`)
    }
}
let y=new Yong()