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();

猜你喜欢

转载自blog.csdn.net/qq_43955202/article/details/107698448
ts