TypeScript的命名空间

在JS中为了避免命名冲突问题，会将变量声明放在函数作用域里来避免变量冲突问题，如下例：

(function(param){
    param.age = 18;
})(param || param= {});

1、命名空间的定义

在TypeScript中，提供了namespace关键字来避免变量冲突问题。TypeScript的命名空间只对外暴露需要在外部访问的对象，命名空间内的对象通过 export 关键字对外暴露，比如在下面Utils.js文件里声明一个命名空间：

namespace Utils { 
  export const publicFn = ():void=>{
    console.log("hello world");
  };
};
Utils.publicFn(); //hello world

2、命名空间的使用

在项目中，经常声明的命名空间的代码和实际调用的代码不在同一个文件里，所以需要通过import来引入文件。

namespace.ts

//声明一个名称为`Utils`的命名空间。
namespace Utils {
  const param = "hello world";
  export const publicFn = (): void => {
    console.log(param);
  };
}
export default Utils;

index.ts

import Utils from "./namespace";
Utils.publicFn(); //hello world

在使用中，只需引入导出的命名空间，在命名空间外访问命名空间内的属性或者方法，需要通过限定的名称，上例中就是Utils来访问。

3、命名空间的JS实现

TypeScript

namespace Utils { 
  export const publicFn = ():void=>{
    console.log("hello world");
  };
};
Utils.publicFn(); //hello world

JS

"use strict";
var Utils;
(function (Utils) {
    Utils.publicFn = () => {
        console.log("hello world");
    };
})(Utils || (Utils = {}));
;
Utils.publicFn(); //hello world

在 TypeScript 编译器进行编译过后，命名空间也就被编译成了上述示例那样的代码，原理也是通过函数作用域来保护局部变量，向外暴露的只是命名空间限定的名称。