郴州网站建设软件定制开发制作,中国纪检监察报社社长,建筑工程网络计划技术与应用,百度网络科技有限公司命名空间 命名空间能有效避免全局污染。在ES6引入模块之后#xff0c;命名空间就较少被提及了。如果使用了全局的类库#xff0c;命名空间仍是一个好的解决方案。 namespace Shape{const pi Math.PI;// 使用export关键字导出#xff0c;可以在全局空间内可见export functio… 命名空间 命名空间能有效避免全局污染。在ES6引入模块之后命名空间就较少被提及了。如果使用了全局的类库命名空间仍是一个好的解决方案。 namespace Shape{const pi Math.PI;// 使用export关键字导出可以在全局空间内可见export function circle(r: number) {return pi * r ** 2}square(5)
}
Shape.circle(10); // 可以在全局空间访问导出的
import circle Shape.circle; // 为命名空间内的变量起个别名要清楚此处import与模块化的import含义不一样
circle(20); 随着程序的扩张命名空间也会很大需要对其进行拆分在不同的文件中使用同名命名空间他们之间共享命名空间。 // space1.ts
/// reference pathspace2.ts / // 三斜线引用标签告诉编译器两个文件中的命名空间内部存在着依赖关系
namespace Shape{export function square(x: number) {return x*x;}circle(10); // 只有circle被export后这里才能访问
}// space2.ts
/// reference pathspace1.ts /
namespace Shape{const pi Math.PI;// 使用export关键字导出可以在全局空间内可见export function circle(r: number) {return pi * r ** 2}square(5);
} 命名空间最好不要和模块一起混用 模块化系统 TypeScript对ES6和CommonJS两种模块系统都有很好的支持我们基本可以沿用以前的写法。但两者不要混用如果出现混用就要使用TS准备的兼容性写法。 先来看看ES6和CommonJS各自的写法 // ES6导入
import { a, b } from ./Modular System/es6/a;
import { a as f } from ./Modular System/es6/a;
import * as All from ./Modular System/es6/a;
import abc from ./Modular System/es6/b;
import Obj from ./Modular System/es6/a
// ES6导出
export defalut Obj;
export {a,b,c};
export {d as D};
export {D as C} from ./a; // 将a.ts中的D重新命名并导出这种用法只能对a.ts中的非默认导出有效// CommonJS导入
let c1 require(./Modular System/node/a.ts);
let c2 require(./Modular System/node/b);
// CommonJS导出
module.exports a; // 将a变量导出
exports.c 3;
exports.d 4;
相当于
module.exports {c:3, d:4}
如果两种方式并存module.exports将会覆盖exports.c这种方式的导出 两种模块在导入导出时互不兼容 导出ES6允许同时存在export default和export多个变量而CommonJS只允许有一种形式的导出其中一种会把另外一种覆盖掉。导入ES6可以按需导入也可以全部导入而CommonJS只能全部导入。如果在ES6模块中抛出数据在非ES6模块中导入就会出现问题。因此尽量不要混用不同的模块化系统。如果迫不得已可以使用TS提供的兼容性语法 // 导出
export a;
// 导入
import c4 require(../es6/c);
/*
1.如果使用以上方法导出此文件不允许有其它形式的导出
2.以上形式的导出的数据不仅可以用以上语法导入还可以用es6的方式导入。前提是tsconfig.json中的esModuleInteroptrue配置项要开启。
*/ 声明合并 编译器会把程序的多个地方具有相同名称的声明合并成一个这样可以将程序散落在各处的重名声明合并在一起。 例如 interface StateMerge {x: number,y: string,
}
interface StateMerge {y: string;foo(bar: string[]): string[],
}
// 此时会将两个声明的同名接口成员合并
let stateMerge: StateMerge {x: 1,y: 15,foo(bar: any) {return bar}
}; 如果合并的两个结构内成员重名怎么办 对于非函数成员必须类型一致否则报错。对于函数成员会发生重载重载的顺序按照以下规则。 interface StateMerge {x: number,y: string,foo(bar: number): number; // 4foo(bar: string): string; // 5foo(bar: b): number; // 2
}
interface StateMerge {y: string;foo(bar: string[]): string[], // 3foo(bar: a): number, // 1
} 接口内部按照先后顺序。接口之间声明在后的接口函数成员排序更靠前。 如果出现自变量排名最靠前。后面的接口中的排在第一位前面的接口排在第二位。上述排序如注释所示。 函数和命名空间的合并 function Lib() {
}
namespace Lib{export let version 1.0
}
console.log(Lib.version); // 相当于为函数Lib添加了属性 类和命名空间的合并 class C{
}
namespace C{export let state 1
}
console.log(C.state); // 相当于为类C添加了state属性 此外还可以为枚举增加属性。 注意在命名空间与类、函数进行生命合并的时候一定要将命名空间放在类、函数之后。否则报错。 转载于:https://www.cnblogs.com/V587Chinese/p/11519477.html
