008--TypeScript存储器和静态属性

最新推荐文章于 2025-04-01 13:53:25 发布

weixin_30697239

最新推荐文章于 2025-04-01 13:53:25 发布

阅读量364

点赞数

CC 4.0 BY-SA版权

原文链接：http://www.cnblogs.com/ccbest/p/10932032.html

博客介绍了TypeScript的相关特性，包括支持对简单类进行getter和setter操作，可创建类的静态成员，有抽象类且一般作为派生类或基类，还提及类的高级技巧以及类可作为接口使用等内容。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

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

转载于:https://www.cnblogs.com/ccbest/p/10932032.html