Type Script Declaration Merging(合併宣言)

5524 ワード

Type Scriptにはいくつかの独特な概念があります.JavaScriptオブジェクトの種類についてどのような変化があったかを説明する必要があります.例を挙げると、一番独特な概念は「声明合併」です.この概念を理解すると、現在のJavaScriptプロジェクトでType Scriptを使って開発するのに役立ちます.さらに、より高度な抽象的な概念を知るための扉も開いた.
本稿の目的としては、声明の統合とは、コンパイラが同じ名前の声明を一つの別々の声明に統合する作業を行うことを意味する.合併後の声明は2つのオリジナル声明の特性を持っている.もちろん、共同声明は二つの共同声明に限定されるものではなく、合併を必要とする声明の数は任意であることができます.
基本概念
Type Scriptでは、一つの声明には、名前空間／モジュール(名前空間:内部モジュール;モジュール:外部モジュール)、タイプ、値の三つの状況があり得る.ステートメントが名前空間／モジュールを作成する場合、名前空間は点記号(.)でアクセスできます.タイプの宣言を作成すると、名前と構造の種類を指定します.最後に、宣言値は出力されたJavaScriptに見られる部分(例えば、関数と変数)です.
Declaration Type
Namespace
Type
Value
Namespace
X
X
クラス
X
X
エンム
X
X
インターフェース
X
Type Alias
X
Function
X
Varable
X
各声明が何を作成しているかを理解することは、マージ宣言を実行するときに何をマージするかを理解するのに役立ちます.
インターフェースマージ
最も簡単であり、最も一般的な声明の統合はインターフェースの合併である.コンパイルの最下層では、ステートメントの統合メカニズムは、同じ名前のインターフェースに2つの宣言されたメンバーを追加します.

interface Box {
    height: number;
    width: number;
}

interface Box {
    scale: number;
}var box: Box = {height: 5, width: 6, scale: 10};

インターフェースの非関数メンバーは唯一でなければなりません.二つのインターフェースが同時に同じ名前の非関数メンバーを宣言すると、コンパイラはエラーを出します.
関数のメンバーについては、同じ名前の関数メンバーをこの関数のリロードと見なします.値の注意点としては、インターフェースAと後のインターフェースA(ここではA′となる)が統合され、インターフェースA‘中重負荷の関数はインターフェースAの同じ関数よりも高い優先度を持つことになる.
判例を見る:

interface Document {
    createElement(tagName: any): Element;
}
interface Document {
    createElement(tagName: string): HTMLElement;
}
interface Document {
    createElement(tagName: "div"): HTMLDivElement; 
    createElement(tagName: "span"): HTMLSpanElement;
    createElement(tagName: "canvas"): HTMLCanvasElement;
}

この3つのインターフェースは別個の声明に統合されます.なお、各インターフェースの内部の順序は依然として同じであり、各グループの間だけが合併され、後のインターフェースのメンバーは新声明の中で前に置かれる.

interface Document {
    createElement(tagName: "div"): HTMLDivElement; 
    createElement(tagName: "span"): HTMLSpanElement;
    createElement(tagName: "canvas"): HTMLCanvasElement;
    createElement(tagName: string): HTMLElement;
    createElement(tagName: any): Element;
}

モジュール統合
インターフェースと同様に、同じ名前のモジュールもそのメンバーを統合します.モジュールは名前空間と値を作成するので、それらがどのように結合されているかを理解する必要があります.
名前空間を統合すると、モジュールごとに宣言されている出力インターフェースの種類の定義が統合され、同名名前空間が結合され、結合後のインターフェースの名前空間が個別に内部に含まれます.
値をマージする場合、指定された名前モジュールが存在すると、後のモジュール内の出力メンバーがこのモジュールに追加されます.
この例のAnimalモジュールの統合を見てください.

module Animals {
    export class Zebra { }
}

module Animals {
    export interface Legged { numberOfLegs: number; }
    export class Dog { }
}

相当于:

module Animals {
    export interface Legged { numberOfLegs: number; }
    
    export class Zebra { }
    export class Dog { }
}

このケースは学習モジュールの統合がうまく始まりますが、より完全に理解したいと思います.エクスポートされていないメンバーは元の(マージされていない)モジュールだけで見られます.これは、合併後、他の声明からの合併後、メンバーが非導出メンバーにアクセスできないことを意味する.
詳細な説明が見られます.

module Animal {    var haveMuscles = true;

    export function animalsHaveMuscles() {        return haveMuscles;
    }
}

module Animal {
    export function doAnimalsHaveMuscles() {        return haveMuscles;  // <--   , haveMuscles           }
}

haveMussclesというメンバーは出力されていないので、このsmbolには、結合されていないモジュールを共有するanimlshaveMusscles関数だけがアクセスできます.ドアニマルHaveMusscles関数は統合されたモジュールの一部ですが、この他の統合された同名モジュール内の未出力メンバーにはまだアクセスできません.
モジュールとクラス、関数、列挙の組み合わせ
モジュールは、他のタイプの宣言と結合できる十分な柔軟性を持っています.モジュールの声明は、その統合された声明に従わなければならない.最終的な統合後の宣言には、2つの宣言タイプの属性が含まれます.Typeescriptはこの機能を使ってJavaScriptの中のモードを実現します.
最初のモジュールの連結例は、モジュールとクラスを統合します.これは、ユーザに内部クラスを記述する方法を提供する.

class Album {
    label: Album.AlbumLabel;
}
module Album {
    export class AlbumLabel{ 
        name:string;
        show(){
            console.log(this.name);
        }
        constructor(name:string){            this.name = name;
        }
    }
}var newAlbum = new Album.AlbumLabel("Ys");
newAlbum.show();

合併後のメンバーのアクセス可能なルールは前のセクションの「モジュール合併」と同じです.だから私たちはexport AlbumLabel類を必要とします.合併後のクラスにアクセスできるようにします.最終的な結果はクラスの内部に別のクラスが存在することである.モジュールの既存のクラスを使用して、より多くのスタティックメンバーを追加することもできます.

class Test{
    fn:Test.TestFn
}
module Test {
    export var Value:string = "World";
    export class TestFn{
        show(name:string){
            console.log(name+"  "+Value);
        }
    }
}var newTest = new Test.TestFn();
newTest.show("Hello");

内部モード以外に、JavaScriptで関数を作成して、後で属性を拡張する方法に詳しいかもしれません.Type Scriptは声明を使って合併してこの目的を達成し、タイプの安全を確保しました.

function buildLabel(name: string): string {    return buildLabel.prefix + name + buildLabel.suffix;
}

module buildLabel {
    export var suffix = "";
    export var prefix = "Hello, ";
}

alert(buildLabel("Sam Smith"));

同様に、モジュールは、列挙の静的なメンバを拡張するためにも使用され得る.

enum Color {
    red = 1,
    green = 2,
    blue = 4}

module Color {
    export function mixColor(colorName: string) {        if (colorName == "yellow") {            return Color.red + Color.green;
        }        else if (colorName == "white") {            return Color.red + Color.green + Color.blue;
        }        else if (colorName == "magenta") {            return Color.red + Color.blue;
        }        else if (colorName == "cyan") {            return Color.green + Color.blue;
        }
    }
}
alert(Color.mixColor("yellow"));

許可されていない合併はType Scriptにおいて、すべての合併が許可されるわけではない.これまでクラスはクラスと結合できず、変数やクラスは結合できず、インターフェースやクラスも結合できませんでした.模擬類の合併が必要です.前の節を参考にしてください.Typecript Mixins(混合)

Common JS