Typescript中的类和名称空间之间的区别 [英] Difference between classes and namespaces in typescript
问题描述
Typescript中的类和命名空间之间到底有什么区别?我知道，如果您使用静态方法创建一个类，则可以在不实例化该类的情况下访问它们，而这正是我猜想的名称空间的要点之一.
What is exactly the difference between Classes and Namespaces in Typescript? I know that if you create a class with static methods you can access them without instantiate the class and that is exactly one of the points of namespaces I guess.
我还知道您可以创建多个具有相同名称的命名空间，并且在编译为JS时，它们的方法将属于同一函数.
I also know that you can create more than one Namespace with the same name and their methods will belong to the same function when compiled to JS.
但是我不知道何时使用一个或另一个...对我来说，最后，类和名称空间几乎是相同的，所以我想我缺少了一些东西...
But I cant figure out when to use one or another...for me, at the end, classes and namespaces are almost the same, so I guess I am missing something...
推荐答案
您是对的.命名空间和静态类相似.它们具有一些共同的特征.它们都是具有相似性的ES5模式的语法糖- cf.由
You're right. Namespaces and static classes are similar. They have some common features. They are both syntactical sugar of ES5 patterns that share similarities - cf. transpiled JavaScript given by the TypeScript playground:
// TypeScript
class C {
static readonly Name = 'C';
static print() {
console.log(`Name=${C.Name}`);
}
}
namespace N {
export const Name = 'N';
export function print() {
console.log(`Name=${Name}`);
}
}
// Usage
C.print();
N.print();
const c = new C();
const n = new N(); // TS Error: Cannot use 'new' with an expression whose type lacks a call or a construct signature
// Transpiled JavaScript
var C = /** @class */ (function () {
function C() {
}
C.print = function () {
console.log("Name=" + C.Name);
};
C.Name = 'C';
return C;
}());
var N;
(function (N) {
N.Name = 'N';
function print() {
console.log("Name=" + N.Name);
}
N.print = print;
})(N || (N = {}));
但是，它们也有自己的功能:
Yet, they have also their own features:
-
命名空间仅在TypeScript中，而不在ECAMScript中.可以将它们视为 IIFE 语法糖.它们可以嵌套(例如
A.B.C)以重新组装C#名称空间.从ECMAScript 6 (ES6/ES2015)开始，在大多数情况下，ES6模块比名称空间更有趣，因为在文件级别处理嵌套并保持代码结构平坦更容易.
Namespaces are only in TypeScript and not in ECAMScript. They can be seen as IIFE syntactical sugar. They can be nested (e.g.
A.B.C) to ressemble C# namespaces. Since ECMAScript 6 (ES6/ES2015), in most cases ES6 modules are more interesting than namespaces because it's simplier to handle nesting at the file level and keep the code structure flat.
类，包括静态成员.它们也是构造函数模式"的语法糖.静态类提供的功能与名称空间相同，但语法不太常用-请参见前面的示例.
Classes including static members are also available in ES6. They are also syntactical sugar of the "constructor function pattern". A static class offers the same features than a namespace but with a syntax less usual - see previous example.
因此，从根本上讲，每种模式都有与这些用例有关的自己的理念:
So fundamentally each pattern has its own philosophy related to these use cases:
- 对于静态(即+/-全局)成员:大多数情况下为ES6模块；有时甚至在模块内部也有TypeScript命名空间-请参见 TS Doc ;或只是常量对象文字，
- 创建对象:类(也可以具有静态成员，如工厂方法)，工厂函数，仅普通对象文字，...
- For static (i.e. +/- global) members: ES6 modules in most cases; TypeScript namespaces sometimes, even inside a module - see TS Doc; or just a constant object literal,
- To create object: classes (that can have static members too by the way, like factory methods), factory functions, just plain object literals, ...
这些建议可以帮助产生更惯用"的代码，即更易于阅读和维护.
These suggestions can help produce code more "idiomatic" i.e. easier to read and to maintain.
但是您/您的团队拥有您的代码，决定权由您决定.您可以根据自己的经验尝试不同的模式进行比较.最后，如果您愿意的话，在名称空间上使用纯静态类也不错，就像使用名称空间而不是ES6模块一样.
But you / your team own your code and the decision is yours. You may try different patterns to compare them based on your experience. Finally, if it's your choice, using pure static classes over namespaces is not bad, like using namespaces instead of ES6 modules.
这篇关于Typescript中的类和名称空间之间的区别的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
