TS07 TS中的命名空间

TS命名空间

1.命名空间概念

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

• 命名空间和模块的区别:
  命名空间:内部模块，主要用于组织代码，避免命名冲突。
  模块: ts的外部模块的简称，侧重代码的复用，一个模块里可能会有多个命名空间。

2.命名空间代码演示

/**
 * 使用命名空间
 * 问题：当我们多人协同开发的时候可能会碰到命名一致的情况
 * 所以我们使用命名空间来避免程序出现错误
 */

namespace KJH {
    interface Animal {
        name:string;
        eat():void;
    }
   
    export class Dog implements Animal {
        name:string;
        constructor(theName:string) {
            this.name = theName
        }
   
        eat(){
            console.log(this.name + '吃狗粮');
        }
    }
   
    export class Cat implements Animal {
       name:string;
       constructor(theName:string) {
           this.name = theName
       }
   
       eat(){
           console.log(this.name + '吃猫粮');
       }
   }
   
}


/**
 * 使用命名空间之后我们的代码相当于是私有的状态
 * 在外部想要访问必须先暴露出来
 * 调用导出的类
 */

 var d = new KJH.Dog('小黄');
 d.eat();
 //小黄吃狗粮


 /**
  * 这时候如果有一个命名冲突的类
  * 只需要使用命名空键就可以避免程序出现错误
  */

namespace KJH2 {
    interface Animal {
        name:string;
        eat():void;
    }
   
    export class Dog implements Animal {
        name:string;
        constructor(theName:string) {
            this.name = theName
        }
   
        eat(){
            console.log(this.name + '吃狗粮');
        }
    }
   
    export class Cat implements Animal {
       name:string;
       constructor(theName:string) {
           this.name = theName
       }
   
       eat(){
           console.log(this.name + '吃猫粮');
       }
   }
   
}

var c = new KJH2.Cat('小花');
c.eat();
//小花吃猫粮

3.将命名空间封装为模块

• 在modules下的模块kjh.ts中封装命名空间
• 在index.ts下引入两个命名空间使用

/**
 * 将命名空间封装为模块
 * 将命名空间暴露出去export
 */

export namespace KJH {
    interface Animal {
        name:string;
        eat():void;
    }
   
    export class Dog implements Animal {
        name:string;
        constructor(theName:string) {
            this.name = theName
        }
   
        eat(){
            console.log(this.name + '吃狗粮');
        }
    }
   
    export class Cat implements Animal {
       name:string;
       constructor(theName:string) {
           this.name = theName
       }
   
       eat(){
           console.log(this.name + '吃猫粮');
       }
   }
   
}



export namespace KJH2 {
    interface Animal {
        name:string;
        eat():void;
    }
   
    export class Dog implements Animal {
        name:string;
        constructor(theName:string) {
            this.name = theName
        }
   
        eat(){
            console.log(this.name + '吃狗粮');
        }
    }
   
    export class Cat implements Animal {
       name:string;
       constructor(theName:string) {
           this.name = theName
       }
   
       eat(){
           console.log(this.name + '吃猫粮');
       }
   }
   
}

/**
 * 将命名空间封装为模块
 */



// 引入命名空间 import

import {KJH,KJH2} from './modules/kjh'

var d = new KJH.Dog('小黑');
d.eat();

var c = new KJH2.Cat('小蓝');
c.eat();