TS-命名空间

1,095 阅读1分钟

在代码量较大的情况下,为了避免各种变量命名相冲突,可将相似功能的函数、类、接口等放置到命名空间内。同 Java 中到包、 .net 到命名空间一样, Typescript 到命名空间可以将代码包裹起来,只对外暴露需要在外部访问的对象。命名空间内的对象通过 export 暴露。

  • 内部模块,主要用于组织代码,避免命名冲突。
  • 命名空间内的类默认私有
  • 通过 export 暴露
  • 通过 namespace 关键字定义
// 命名空间 A
namespace A {
    interface Animal {
        name: string;
        eat(foodName: string): string;
    }
    export class Dog implements Animal {
        name: string;
        constructor(name: string) {
            this.name = name;
        }
        eat(foodName: string): string {
            return `${this.name}在吃${foodName}`;
        }
    }
}

// 命名空间 B
namespace B {
    interface Animal {
        name: string;
        eat(foodName: string): string;
    }
    export class Dog implements Animal {
        name: string;
        constructor(name: string) {
            this.name = name;
        }
        eat(foodName: string): string {
            return `${this.name}在吃${foodName}`;
        }
    }
    export class Cat implements Animal {
        name: string;
        constructor(name: string) {
            this.name = name;
        }
        eat(): string {
            return `${this.name}在吃食物`;
        }
    }
}
let dog = new A.Dog('花花');
console.log(dog.eat('米饭')); // 花花在吃米饭

let dog1 = new B.Dog('芳芳');
console.log(dog1.eat('饭饭')); // 芳芳在吃饭饭
let cat = new B.Cat('咪咪');
console.log(cat.eat()); // 咪咪在吃食物
  • 将命名空间中的代码封装成模块
/*
1 创建Animal.ts文件
2 将所有的命名空间代码 放入该文件内
3 使用关键字export暴露出来该命名空间
4 引入该Animal.ts文件
5 使用命名空间的方法
*/

// Animal.ts
export namespace A {
    interface Animal {
        name: string;
        eat(foodName: string): string;
    }
    export class Dog implements Animal {
        name: string;
        constructor(name: string) {
            this.name = name;
        }
        eat(foodName: string): string {
            return `${this.name}在吃${foodName}`;
        }
    }
}
export namespace B {
    interface Animal {
        name: string;
        eat(foodName: string): string;
    }
    export class Dog implements Animal {
        name: string;
        constructor(name: string) {
            this.name = name;
        }
        eat(foodName: string): string {
            return `${this.name}在吃${foodName}`;
        }
    }
    export class Cat implements Animal {
        name: string;
        constructor(name: string) {
            this.name = name;
        }
        eat(): string {
            return `${this.name}在吃食物`;
        }
    }
}

// index.ts
// 引入
import { A, B} from './modules/Animal'

let dog = new A.Dog('花花');
console.log(dog.eat('米饭')); // 花花在吃米饭
let dog1 = new B.Dog('芳芳');
console.log(dog1.eat('饭饭')); // 芳芳在吃饭饭
let cat = new B.Cat('咪咪');
console.log(cat.eat()); // 咪咪在吃食物