8、TypeScript面向对象特性

一、类

class Person{
    //构造函数,只在类被实例化时调用,且只被调用一次
    constructor(name: string) {
        this.name = name  
    }

    //访问控制符
    public name;//可以在类外被访问

    private age;//只可以在类内部访问

    protected sex;//只可以在类内部或子类的内部被访问

    eat() {//如果没有访问控制符的话,默认为public
        console.log(this.name)
    }
}

var p1 = new Person("batman")//因为构造函数中有参数,所以实例化的时候必须传入参数
p1.eat();

var p2 = new Person("superman")
p2.eat();

等同于:

class Person{
    constructor(public name: string) {
    //需要注意。当在构造函数内部声明一个属性name的时候,需要指定访问控制符
    }

    private age;//只可以在类内部访问

    protected sex;//只可以在类内部或子类的内部被访问

    eat() {//如果没有访问控制符的话,默认为public
        console.log(this.name)
    }
}

var p1 = new Person("batman")//因为构造函数中有参数,所以实例化的时候必须传入参数
p1.eat();

var p2 = new Person("superman")
p2.eat();

执行结果:



二、类的继承

两个关键字:
1、extends:用来声明类的继承关系
2、super:用来调用父类的构造函数或方法

extends关键字

所谓继承关系是一种“是”的关系,如:“雇员是人”,“猫是动物”等。当一个类使用extends关键字继承了一个父类之后,那么这个类会获得它所继承的那个类的属性和方法。

class Person{
    //构造函数,只在类被实例化时调用,且只被调用一次
    constructor(name: string) {
        this.name = name  
    }

    //访问控制符
    public name;//可以在类外被访问

    eat() {//如果没有访问控制符的话,默认为public
        console.log("i'm eating")
    }
}

class Employee extends Person{
    code: string;
    work() {
        console.log("i'm working")
    }
}

var e1 = new Employee("name")
e1.eat()
e1.work()

执行结果:

super关键字
class Person{
    //构造函数,只在类被实例化时调用,且只被调用一次
    constructor(public name: string) {
        console.log("parent")  
    }

    eat() {//如果没有访问控制符的话,默认为public
        console.log(this.name+"is eating")
    }
}

class Employee extends Person{
    constructor(name: string, code: string) {
        super(name);//子类的构造函数必须先用super关键字调用父类的构造函数,这是规定,必须遵守!
        this.code = code
        console.log("child")  
    }
    code: string;
    work() {
        super.eat()//在子类中通过super关键字调用父类的方法
        this.doWork()
    }
    private doWork() {//私有方法不可在外部调用
        console.log(this.name+"is working")
    }
}

var e1 = new Employee("Employee","1")
e1.work()

执行结果:



三、泛型(generic)

泛型是指一种参数化的类型,一般用来限制集合的内容


class Person{
    //构造函数,只在类被实例化时调用,且只被调用一次
    constructor(public name: string) {
        console.log("parent")  
    }

    eat() {//如果没有访问控制符的话,默认为public
        console.log(this.name+"is eating")
    }
}

class Employee extends Person{
    constructor(name: string, code: string) {
        super(name);//子类的构造函数必须先用super关键字调用父类的构造函数,这是规定,必须遵守!
        this.code = code
        console.log("child")  
    }
    code: string;
    work() {
        super.eat()//在子类中通过super关键字调用父类的方法
        this.doWork()
    }
    private doWork() {//私有方法不可在外部调用
        console.log(this.name+"is working")
    }
}
//声明变量workers为数组,这个数组里只能放Person类型的数据
var workers: Array<Person> = [];//这个数组的泛型为Person
workers[0] = new Person("zhangsan");
workers[1] = new Employee("lisi","2");

代码中的:var workers: Array<Person> = [];就是泛型的用法

四、接口(Interface)

接口是用来建立某种代码约定,使得其他开发者在调用某个方法或者创建新的类时必须遵循所接口定义的代码约定。
其实在javascript中是没有接口这个概念的,而在typescript中则提供两个关键字来支持这种特性:

Interface:用来声明一个接口;
Implements:用来声明某个类实现了某一个接口;

接口的使用方式1:用作函数参数的类型声明

interface IPerson{
    name: string;
    age: number;
}
class Person{
    constructor(public config: IPerson) {//接口用作函数参数的类型声明
        
    }
}
var p1 = new Person({
    name: "张三",
    age: 18,
    //多传或少传参数都会报错
})

接口的使用方式2:在接口中声明方法,则所有实现该接口的类都得实现这个方法。

interface Animal{
    eat()
}

class Sheep implements Animal{//Sheep类实现了Animal接口
//当一个类实现某个接口时,它必须实现该接口中声明的方法
    eat() {
        console.log("i eat grass")
    }
}

class Tiger implements Animal{//Tiger 类实现了Animal接口
    eat() {
        console.log("i eat meat")
    }
}


五、模块(Module)

模块可以帮助开发者将代码分割为可重用的单元。开发者可以自己决定将模块中的哪些资源(类、方法、变量)暴露出去供外部使用,哪些资源只在模块内使用。
所谓“模块”在ts中就是一个文件,一个文件就是一个模块。在模块内部,有两个关键字来支撑模块的特性;这两个关键字是“export(导处)”和“import(导入)”。
代码示例:
先建立一个文件a.ts

export var prop1;//对外暴露的变量

var prop2;//不对外暴露的变量

export function func1() {//对外暴露的方法
    
}

function func2(){//不对外暴露的方法

}

export class Clazz1{//对外暴露的类

}

class Clazz2{//不对外暴露的类
    
}

再建立一个文件b.ts

//引入a.ts中暴露出来的变量、方法、类
import {prop1,func1,clazz1} from './a'

console.log(prop1)
func1();
new clazz1()

//也可以向外暴露自己的方法
export function func3() {
    
}


六、注解(annotation)

注解为程序的元素(类、方法、变量)加上更直观、更明了的说明,这些说明信息与程序的业务逻辑无关,而是供指定的工具或框架使用的。

七、类型定义文件(*.d.ts)

类型定义文件,用来帮助开发者在ts中使用已有的js工具包,如jquery;
常用的js框架的类型定义文件来自于:https://github.com/DefinitelyTyped/DefinitelyTyped
或者使用:https://github.com/typings/typings来寻找或安装一个类型定义文件。

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • { "Unterminated string literal.": "未终止的字符串文本。", "Identifi...
    一粒沙随风飘摇阅读 13,747评论 0 3
  • Spring Cloud为开发人员提供了快速构建分布式系统中一些常见模式的工具(例如配置管理,服务发现,断路器,智...
    卡卡罗2017阅读 135,491评论 19 139
  • Android 自定义View的各种姿势1 Activity的显示之ViewRootImpl详解 Activity...
    passiontim阅读 175,670评论 25 709
  • 每一个贫困生的背后,都是一本值得思考的书。在我们眼中他们应该独立,他们应该坚强,他们应该担当,他们应该勇敢,他们应...
    飞流三千阅读 2,948评论 0 1
  • 前言 call 和 apply 都是为了改变某个函数运行时的 context 即上下文而存在的,换句话说,就是为了...
    孟圆的笔记阅读 1,306评论 0 0