zoukankan      html  css  js  c++  java
  • 008--TypeScript存储器和静态属性

    Typescript支持对一个简单的类进行getter和setter

    //ts实现getter和setter
    //这个文件只能编译成es5
    let passCode = 'Secret Password'
    class Employee {
     private _fullName: string
     get fullName(): string{
       return this._fullName
     }
     set fullName(newName: string) {
       if(passCode && passCode == 'Secret Password'){
         this._fullName = newName
       } else {
         console.error ('Error: Unauthorized update of employee!')
       }
     }
    }
    let employee = new Employee()
    employee.fullName = 'BOb smith'
    if (employee.fullName) {
      console.log(employee.fullName)//如果passCode正确,输出BOb smith
    }

    编译后的文件如下

    //ts实现getter和setter
    //这个文件只能编译成es5
    var passCode = 'Secret Password';
    var Employee = /** @class */ (function () {
        function Employee() {
        }
        Object.defineProperty(Employee.prototype, "fullName", {
            get: function () {
                return this._fullName;
            },
            set: function (newName) {
                if (passCode && passCode == 'Secret Password') {
                    this._fullName = newName;
                }
                else {
                    console.error('Error: Unauthorized update of employee!');
                }
            },
            enumerable: true,
            configurable: true
        });
        return Employee;
    }());
    var employee = new Employee();
    employee.fullName = 'BOb smith';
    if (employee.fullName) {
        console.log(employee.fullName); //如果passCode正确,输出BOb smith
    }

    创建类的静态成员,这些属性只存在类的本身

    //静态属性的使用
    //计算坐标系的一点到任一点的距离
    class Grid {
      static orign = {x:0, y:0}//静态属性,可以直接使用
    
      scale: number //定义缩放比例
    
      constructor(scale: number) {
        this.scale = scale//把scale传给this,new函数的时候必须传入
      }
    
      //创建一个实例方法
      calculateDistanceFromOrign (point: {x:number; y: number}) {
        let xDist = point.x - Grid.orign.x //静态属性可以直接使用
        let yDist = point.y - Grid.orign.y
        //勾股定理
        return Math.sqrt(xDist * xDist + yDist * yDist) * this.scale 
      }
    }
    
    let grid1 = new Grid(1.0)
    let grid2 = new Grid(5.0)
    //勾3股4弦5
    console.log(grid1.calculateDistanceFromOrign({x:3 , y:4}))//5
    console.log(grid2.calculateDistanceFromOrign({x:3 , y:4}))//25

    编译后的文件

    //静态属性的使用
    //计算坐标系的一点到任一点的距离
    var Grid = /** @class */ (function () {
        function Grid(scale) {
            this.scale = scale; //把scale传给this,new函数的时候必须传入
        }
        //创建一个实例方法
        Grid.prototype.calculateDistanceFromOrign = function (point) {
            var xDist = point.x - Grid.orign.x; //静态属性可以直接使用
            var yDist = point.y - Grid.orign.y;
            //勾股定理
            return Math.sqrt(xDist * xDist + yDist * yDist) * this.scale;
        };
        Grid.orign = { x: 0, y: 0 }; //静态属性,可以直接使用
        return Grid;
    }());
    var grid1 = new Grid(1.0);
    var grid2 = new Grid(5.0);
    //勾3股4弦5
    console.log(grid1.calculateDistanceFromOrign({ x: 3, y: 4 }));
    console.log(grid2.calculateDistanceFromOrign({ x: 3, y: 4 }));

    TypeScript抽象类

    抽象类一般作为其他类的派生类或者基类使用,一般不能直接使用

    abstract class Department {
      name: string
      constructor(name: string) {
        this.name = name
      }
    
      printName(): void{
        console.log('Department name ' + this.name)
      }
    
      abstract printMeeting(): void  //具体实现要在派生类中实现,这是个签名
    }
    
    class AccountingDepartment extends Department {
      constructor() {
        super('Accounting ad Auditing')
      }
      //实现抽象方法
      printMeeting(): void {
        console.log('The Accounting Department meets each monday at 10am') 
      }
    
      genterateReports(): void {
        console.log('Generating accounting reports.. ')
      }
    }
    
    let department: Department
    //  department = new Department()//报错,无法创建抽象类的实例
    department = new AccountingDepartment()
    department.printName()
    department.printMeeting()
    //department.genterateReports()//定义的是Department类型,没有这个实例方法
    //输出
    // Department name Accounting ad Auditing
    // The Accounting Department meets each monday at 10am

    类的一些高级技巧

    //类的一些高级技巧
    class Greeter {
      static standgrdGreeting = 'Hello , there'
    
      greeting: string
    
      constructor(message: string) {
        this.greeting  = message
      }
    
      greet() {
        return 'Hello' + this.greeting
      }
    }
    
    let greeter: Greeter
    greeter = new Greeter('world')
    console.log(greeter.greet())//Helloworld

    可以看到上面的代码有静态属性,有实例方法

    //类的一些高级技巧
    var Greeter = /** @class */ (function () {
        function Greeter(message) {
            this.greeting = message;
        }
        Greeter.prototype.greet = function () {
            return 'Hello' + this.greeting;
        };
        //最开始把构造函数赋值给Greeter变量
        //静态属性编译后实际上是挂载在赋值后的Greeter上
        Greeter.standgrdGreeting = 'Hello , there';
        return Greeter;
    }());
    var greeter;
    greeter = new Greeter('world');
    console.log(greeter.greet());

    改造后

    //类的一些高级技巧
    class Greeter {
      static standgrdGreeting = 'Hello , there'
    
      greeting: string
    
      //修改为可选参数
      constructor(message?: string) {
        this.greeting  = message
      }
    
      greet() {
        if(this.greeting){
        return 'Hello' + this.greeting
        }else {
          return Greeter.standgrdGreeting
        }
      }
    }
    
    let greeter: Greeter
    greeter = new Greeter()
    console.log(greeter.greet())//Hello , there
    
    //如果我们相对standGreeting做修改怎么办呢?
    let greetMaker: typeof  Greeter = Greeter
    greetMaker.standgrdGreeting = 'Hey, htere'
    
    let greeter2:Greeter = new greetMaker()
    console.log(greeter2.greet())//Hey, htere

    编译后

    //类的一些高级技巧
    var Greeter = /** @class */ (function () {
        //修改为可选参数
        function Greeter(message) {
            this.greeting = message;
        }
        Greeter.prototype.greet = function () {
            if (this.greeting) {
                return 'Hello' + this.greeting;
            }
            else {
                return Greeter.standgrdGreeting;
            }
        };
        Greeter.standgrdGreeting = 'Hello , there';
        return Greeter;
    }());
    var greeter;
    greeter = new Greeter();
    console.log(greeter.greet()); //Hello , there
    //如果我们相对standGreeting做修改怎么办呢?
    var greetMaker = Greeter;
    greetMaker.standgrdGreeting = 'Hey, htere';
    var greeter2 = new greetMaker();
    console.log(greeter2.greet());

    类作为接口使用

    //目前已废弃
    class Point {
      x: number
      y: number
    }
     
    interface Point3D extends Point{
    z: number
    }
    
    let point3d: Point3D = {x: 1 ,y: 2, z: 3}

    2019-05-27  17:40:40

    工欲善其事,必先利其器
  • 相关阅读:
    打印出从1到最大的n位十进制数
    排序算法--(二)
    排序算法 (-)
    两个栈实现一个队列
    C++ 模板类解析
    根据先序遍历中序遍历重建二叉树
    格式化时间
    用js实现冒泡排序
    接口和抽象类的区别
    解析json
  • 原文地址:https://www.cnblogs.com/ccbest/p/10932032.html
Copyright © 2011-2022 走看看