美文网首页
Typescript中的类

Typescript中的类

作者: iDevOps | 来源:发表于2019-08-17 00:01 被阅读0次

    在ES5中, 我们通过构造函数实现类的概念, 通过原型链实现集成。在ES6中,引入了class, Typescript除了实现所有ES6中的类的功能,还添加类一些新的用法

    先了解下什么是类

    类就是定义一件事物的抽象特点, 包含它的属性和方法

    面向对象

    Typescript是面向对象的编程语言, 在学习类之前,我们首先先了解以下什么是对象,面向对象的三大特性是什么?

    • 什么是对象
      类的实例, 通过new获取
    • 什么是面向对象(OOP)的三大特征
      面向对象的三个特性是封装,继承与多态, 下面我们逐一介绍
    • 什么是封装?
      将对数据的操作细节隐藏起来,只暴露对外的接口。外界调用端不需要(也不可能)知道细节,就能通过对外提供的接口来访问该对象,同时也保证了外界无法任意更改对象内部的数据,那我们怎么控制哪些可以访问哪些不可以访问呢?Typescript为我们提供类三个访问修饰符,依次是
      public: 修饰的方法和属性是共有的, 谁都可以访问
      protected: 子修饰的方法和属性是受保护的, 子类和自己才可以访问
      private: 修饰的方法和属性是私有的, 只有自己可以访问
      怎么使用呢?
    class Person{
      private _name:string; // 私有属性, 最好前面有个_
      protected age:number; // 子类和自己都可以访问
      public getName(){ // 共有属性, 谁都可以访问getName方法
        return this._name;
      }
    }
    
    • 什么是继承?
      子类继承父类,子类除了拥有父类的所有特性外,还有一些更具体的特性
    class Person{
        // 属性
        private _name:string;
        private _age:number;
        // 构造方法
        constructor(name:string, age:number){
            this._name = name;
            this._age = age;
        }
        // 方法
        public function say():void{
            console.log(this._name + " say ....");
        }
    }
    // Student继承Person
    class Student extends Person{
        private _address: string;
        constructor(name:string, age:number, address:string){
            // 必须有,放在最前面, 调用父类的构造方法
            super(name, age);
            this._address = address;
        }
        public function getAddress():void{
            console.log(this._address);
        }
    }
    
    var student = new Student("sn", 11, 'aa');
    student.getAddress();
    student.say(); // 从父类继承来的
    
    • 什么是多态?
      由继承而产生了相关的不同的类,对同一个方法可以有不同的响应
    存取器

    类似于Java的getter和setter方法, 使用getter和setter可以改变属性的值和获取属性的值

    class Person{
      constructor(name){
        this.name = name;
      }
      get name(){
        return this.name;
      }
      set name(val){
        console.log('setter:' + val);
        this.name = val;
      }
    }
    // 测试
    let person = new Person('lisi');
    console.log(person.name); // lisi
    person.name = 'zhangsan';
    console.log(person.name); // zhangsan
    
    静态方法
    • 使用static修饰符修饰的是静态方法
    • 静态方法不需要实例化, 直接就可以通过类调用
    class Person{
      static eat(){
        console.log('eat.....');
      }
    }
    Person.eat();  // 输出eat.....
    

    类我们就先就介绍这么多, 下篇我们介绍Typescript的抽象类, 如果喜欢,请给点个赞或关注下,这里多谢啦!!!

    相关文章

      网友评论

          本文标题:Typescript中的类

          本文链接:https://www.haomeiwen.com/subject/iornjctx.html