คลาสแบบคงที่ TypeScript

ฉันต้องการย้ายไป TypeScript จาก JS แบบดั้งเดิมเพราะฉันชอบไวยากรณ์ที่คล้าย C # ปัญหาของฉันคือฉันไม่สามารถหาวิธีประกาศคลาสสแตติกใน TypeScript

ใน C # ฉันมักจะใช้คลาสคงที่เพื่อจัดระเบียบตัวแปรและวิธีการรวมเข้าด้วยกันในคลาสที่มีชื่อโดยไม่จำเป็นต้องติดตั้งวัตถุ ในวานิลลา JS ฉันเคยทำสิ่งนี้กับวัตถุ JS อย่างง่าย:

var myStaticClass = {
    property: 10,
    method: function(){}
}

ใน TypeScript ฉันอยากจะใช้แนวทาง C-sharpy ของฉัน แต่ดูเหมือนว่าคลาสแบบคงที่ไม่มีอยู่ใน TS วิธีแก้ไขปัญหาที่เหมาะสมสำหรับปัญหานี้คืออะไร?

TypeScript ไม่ใช่ C # ดังนั้นคุณไม่ควรคาดหวังแนวคิดเดียวกันของ C # ใน TypeScript อย่างแน่นอน คำถามคือทำไมคุณต้องการเรียนแบบคงที่?

ใน C # คลาสสแตติกเป็นคลาสที่ไม่สามารถคลาสย่อยและต้องมีเมธอดสแตติกเท่านั้น C # ไม่อนุญาตให้หนึ่งเพื่อกำหนดฟังก์ชั่นนอกชั้นเรียน ใน TypeScript นี้เป็นไปได้อย่างไรก็ตาม

หากคุณกำลังมองหาวิธีที่จะทำให้ฟังก์ชั่น / วิธีการของคุณใน namespace (เช่นไม่ใช่ระดับโลก) คุณสามารถพิจารณาใช้โมดูลของ TypeScript เช่น

module M {
    var s = "hello";
    export function f() {
        return s;
    }
}

เพื่อให้คุณสามารถเข้าถึง Mf () ภายนอก แต่ไม่ใช่ s และคุณไม่สามารถขยายโมดูลได้

ดูข้อกำหนดของ TypeScript สำหรับรายละเอียดเพิ่มเติม

คลาสนามธรรมเป็นพลเมืองชั้นหนึ่งของ TypeScript ตั้งแต่ TypeScript 1.6 คุณไม่สามารถยกตัวอย่างคลาสนามธรรมได้

นี่คือตัวอย่าง:

export abstract class MyClass {         
    public static myProp = "Hello";

    public static doSomething(): string {
      return "World";
    }
}

const okay = MyClass.doSomething();

//const errors = new MyClass(); // Error

การนิยามคุณสมบัติสแตติกและเมธอดของคลาสอธิบายไว้ใน 8.2.1 ของSpecificationcript Language Specification :

class Point { 
  constructor(public x: number, public y: number) { } 
  public distance(p: Point) { 
    var dx = this.x - p.x; 
    var dy = this.y - p.y; 
    return Math.sqrt(dx * dx + dy * dy); 
  } 
  static origin = new Point(0, 0); 
  static distance(p1: Point, p2: Point) { 
    return p1.distance(p2); 
  } 
}

โดยที่Point.distance()เป็นวิธีคงที่ (หรือ "คลาส")

คำถามนี้ค่อนข้างเก่า แต่ฉันต้องการออกคำตอบที่ยกระดับภาษาปัจจุบัน น่าเสียดายที่คลาสสแตติกยังคงไม่มีอยู่ใน TypeScript แต่คุณสามารถเขียนคลาสที่มีลักษณะการทำงานคล้ายกับค่าใช้จ่ายเพียงเล็กน้อยโดยใช้ Constructor ส่วนตัวซึ่งป้องกันการสร้างอินสแตนซ์ของคลาสจากภายนอก

class MyStaticClass {
    public static readonly property: number = 42;
    public static myMethod(): void { /* ... */ }
    private constructor() { /* noop */ }
}

ตัวอย่างนี้จะช่วยให้คุณใช้คลาส "แบบคงที่" ซึ่งคล้ายกับสำเนา C # ที่มีข้อเสียเพียงอย่างเดียวที่ยังสามารถสร้างอินสแตนซ์ได้จากภายใน โชคดีที่คุณไม่สามารถขยายคลาสด้วยคอนสตรัคเตอร์ส่วนตัวได้

นี่คือวิธีหนึ่ง:

class SomeClass {
    private static myStaticVariable = "whatever";
    private static __static_ctor = (() => { /* do static constructor stuff :) */ })();
}

__static_ctorนี่คือการแสดงออกฟังก์ชั่นที่เรียกใช้ทันที typescript จะเอาท์พุทรหัสที่จะเรียกมันในตอนท้ายของชั้นเรียนที่สร้างขึ้น

อัปเดต: สำหรับประเภททั่วไปในตัวสร้างสแตติกซึ่งไม่ได้รับอนุญาตให้อ้างอิงโดยสมาชิกแบบสแตติกคุณจะต้องมีขั้นตอนเพิ่มเติมตอนนี้:

class SomeClass<T> {
    static myStaticVariable = "whatever";
    private ___static_ctor = (() => { var someClass:SomeClass<T> ; /* do static constructor stuff :) */ })();
    private static __static_ctor = SomeClass.prototype.___static_ctor();
}

แน่นอนว่าในกรณีใด ๆ คุณสามารถเรียกใช้ตัวสร้างสแตติกแบบทั่วไปหลังจากคลาสได้เช่น:

class SomeClass<T> {
    static myStaticVariable = "whatever";
    private __static_ctor = (() => { var example: SomeClass<T>; /* do static constructor stuff :) */ })();
}
SomeClass.prototype.__static_ctor();

เพียงจำไว้ว่าอย่าใช้thisใน__static_ctorด้านบน (ชัด)

ฉันได้รับกรณีการใช้งานแบบเดียวกันในวันนี้ (31 ต.ค. 2014) และพบว่านี่เป็นวิธีแก้ปัญหา มันขึ้นอยู่กับการวิจัยของฉันและมันได้ผลสำหรับฉัน ความคาดหวัง - เพื่อให้บรรลุดังต่อไปนี้ใน TypeScript:

var myStaticClass = {
    property: 10,
    method: function(){} 
}

ฉันทำอย่างนี้:

//MyStaticMembers.ts
namespace MyStaticMembers {
        class MyStaticClass {
           static property: number = 10;
           static myMethod() {...}
        }
        export function Property(): number {
           return MyStaticClass.property;
        }
        export function Method(): void {
           return MyStaticClass.myMethod();
        }
     }

ดังนั้นเราจะกินมันดังต่อไปนี้:

//app.ts
/// <reference path="MyStaticMembers.ts" />
    console.log(MyStaticMembers.Property);
    MyStaticMembers.Method();

สิ่งนี้ใช้ได้สำหรับฉัน หากใครมีข้อเสนอแนะที่ดีกว่าอื่น ๆ โปรดให้พวกเราทุกคนได้ยิน !!! ขอบคุณ ...

คลาสแบบคงที่ในภาษาเช่น C # มีอยู่เนื่องจากไม่มีโครงสร้างระดับบนสุดอื่น ๆ ในการจัดกลุ่มข้อมูลและฟังก์ชั่น อย่างไรก็ตามใน JavaScript พวกเขาทำและมันก็เป็นธรรมชาติมากกว่าที่จะประกาศสิ่งที่คุณทำ หากต้องการจำลองไวยากรณ์ของคลาสอย่างใกล้ชิดยิ่งขึ้นคุณสามารถประกาศเมธอดดังนี้:

const myStaticClass = {
    property: 10,

    method() {

    }
}

ดู http://www.basarat.com/2013/04/typescript-static-constructors-for.html

นี่คือวิธีการ 'ปลอม' ตัวสร้างแบบคงที่ มันไม่ได้โดยไม่มีอันตรายของมัน - ดูรายการ CodePlex อ้างอิง

class Test {
    static foo = "orig";

    // Non void static function
    static stat() {
        console.log("Do any static construction here");
        foo = "static initialized";
        // Required to make function non void
        return null;
    }
    // Static variable assignment
    static statrun = Test.stat();
}

// Static construction will have been done:
console.log(Test.foo);

วิธีหนึ่งที่เป็นไปได้ในการบรรลุเป้าหมายนี้คือมีอินสแตนซ์คงที่ของคลาสภายในคลาสอื่น ตัวอย่างเช่น:

class SystemParams
{
  pageWidth:  number = 8270;
  pageHeight: number = 11690;  
}

class DocLevelParams
{
  totalPages: number = 0;
}

class Wrapper
{ 
  static System: SystemParams = new SystemParams();
  static DocLevel: DocLevelParams = new DocLevelParams();
}

จากนั้นพารามิเตอร์สามารถเข้าถึงได้โดยใช้ Wrapper โดยไม่ต้องประกาศอินสแตนซ์ของมัน ตัวอย่างเช่น:

Wrapper.System.pageWidth = 1234;
Wrapper.DocLevel.totalPages = 10;

ดังนั้นคุณจะได้รับประโยชน์ของวัตถุประเภท JavaScript (ตามที่อธิบายไว้ในคำถามเดิม) แต่ด้วยข้อดีของความสามารถในการเพิ่มการพิมพ์ของ TypeScript นอกจากนี้ยังหลีกเลี่ยงการเพิ่ม 'คงที่' ด้านหน้าพารามิเตอร์ทั้งหมดในชั้นเรียน

ด้วยโมดูลภายนอก ES6 สามารถทำได้ดังนี้:

// privately scoped array
let arr = [];

export let ArrayModule = {
    add: x => arr.push(x),
    print: () => console.log(arr),
}

สิ่งนี้จะป้องกันการใช้งานโมดูลภายในและเนมสเปซซึ่งถือว่าเป็นการปฏิบัติที่ไม่ดีโดย TSLint [1] [2]ช่วยให้การกำหนดขอบเขตส่วนตัวและสาธารณะและป้องกันการเริ่มต้นของวัตถุคลาสที่ไม่พึงประสงค์

ฉันกำลังค้นหาสิ่งที่คล้ายกันและได้รับสิ่งที่เรียกว่า Singleton Patternฉันกำลังมองหาบางสิ่งบางอย่างที่คล้ายกันและบางสิ่งบางอย่างมาข้ามเรียกว่า

การอ้างอิง: รูปแบบซิงเกิล

ฉันกำลังทำงานกับคลาส BulkLoader เพื่อโหลดไฟล์ประเภทต่างๆและต้องการใช้รูปแบบ Singleton สำหรับมัน วิธีนี้ฉันสามารถโหลดไฟล์จากคลาสแอปพลิเคชันหลักของฉันและเรียกคืนไฟล์ที่โหลดได้อย่างง่ายดายจากคลาสอื่น

ด้านล่างเป็นตัวอย่างง่ายๆว่าคุณสามารถสร้างตัวจัดการคะแนนสำหรับเกมที่มีรูปแบบ TypeScript และรูปแบบซิงเกิลได้อย่างไร

คลาส SingletonClass {

private static _instance:SingletonClass = new SingletonClass();

private _score:number = 0;

constructor() {
    if(SingletonClass._instance){
        throw new Error("Error: Instantiation failed: Use SingletonDemo.getInstance() instead of new.");
    }
    SingletonClass._instance = this;
}

public static getInstance():SingletonClass
{
    return SingletonClass._instance;
}

public setScore(value:number):void
{
    this._score = value;
}

public getScore():number
{
    return this._score;
}

public addPoints(value:number):void
{
    this._score += value;
}

public removePoints(value:number):void
{
    this._score -= value;
}   }

จากนั้นทุกที่ในชั้นเรียนอื่น ๆ ของคุณคุณจะสามารถเข้าถึง Singleton โดย:

var scoreManager = SingletonClass.getInstance();
scoreManager.setScore(10); scoreManager.addPoints(1);
scoreManager.removePoints(2); console.log( scoreManager.getScore() );

คุณยังสามารถใช้คำหลักnamespaceเพื่อจัดระเบียบตัวแปรคลาสวิธีการและอื่น ๆ ดูเอกสาร

namespace Validation {
    export interface StringValidator {
        isAcceptable(s: string): boolean;
    }

    const lettersRegexp = /^[A-Za-z]+$/;
    const numberRegexp = /^[0-9]+$/;

    export class LettersOnlyValidator implements StringValidator {
        isAcceptable(s: string) {
            return lettersRegexp.test(s);
        }
    }

    export class ZipCodeValidator implements StringValidator {
        isAcceptable(s: string) {
            return s.length === 5 && numberRegexp.test(s);
        }
    }
}