溫馨提示×
您好，登錄后才能下訂單哦！
點擊 登錄注冊 即表示同意《億速云用戶服務條款》
您好，登錄后才能下訂單哦！
TypeScript 是 JavaScript 的一個超集，支持 ECMAScript 6 標準。
TypeScript 由微軟開發的自由和開源的編程語言。
TypeScript 設計目標是開發大型應用，它可以編譯成純 JavaScript，編譯出來的 JavaScript 可以運行在任何瀏覽器上。
命名空間一個最明確的目的就是解決重名問題。
假設這樣一種情況，當一個班上有兩個名叫小明的學生時，為了明確區分它們，我們在使用名字之外，不得不使用一些額外的信息，比如他們的姓（王小明，李小明），或者他們父母的名字等等。
命名空間定義了標識符的可見范圍，一個標識符可在多個名字空間中定義，它在不同名字空間中的含義是互不相干的。這樣，在一個新的名字空間中可定義任何標識符，它們不會與任何已有的標識符發生沖突，因為已有的定義都處于其他名字空間中。
TypeScript 中命名空間使用 namespace 來定義，語法格式如下：
namespace SomeNameSpaceName {
export interface ISomeInterfaceName { }
export class SomeClassName { }
}
以上定義了一個命名空間 SomeNameSpaceName，如果我們需要在外部可以調用 SomeNameSpaceName 中的類和接口，則需要在類和接口添加 export 關鍵字。
要在另外一個命名空間調用語法格式為：
SomeNameSpaceName.SomeClassName;
如果一個命名空間在一個單獨的 TypeScript 文件中，則應使用三斜杠 /// 引用它，語法格式如下：
/// <reference path = "SomeFileName.ts" />
以下實例演示了命名空間的使用，定義在不同文件中：
IShape.ts 文件代碼：
namespace Drawing {
export interface IShape {
draw();
}
}
Circle.ts 文件代碼：
/// <reference path = "IShape.ts" />
namespace Drawing {
export class Circle implements IShape {
public draw() {
console.log("Circle is drawn");
}
}
}
Triangle.ts 文件代碼：
/// <reference path = "IShape.ts" />
namespace Drawing {
export class Triangle implements IShape {
public draw() {
console.log("Triangle is drawn");
}
}
}
TestShape.ts 文件代碼：
/// <reference path = "IShape.ts" />
/// <reference path = "Circle.ts" />
/// <reference path = "Triangle.ts" />
function drawAllShapes(shape:Drawing.IShape) {
shape.draw();
}
drawAllShapes(new Drawing.Circle());
drawAllShapes(new Drawing.Triangle());
使用 tsc 命令編譯以上代碼：
tsc --out app.js TestShape.ts
得到以下 JavaScript 代碼：
JavaScript
/// <reference path = "IShape.ts" />
var Drawing;
(function (Drawing) {
var Circle = /** @class */ (function () {
function Circle() {
}
Circle.prototype.draw = function () {
console.log("Circle is drawn");
};
return Circle;
}());
Drawing.Circle = Circle;
})(Drawing || (Drawing = {}));
/// <reference path = "IShape.ts" />
var Drawing;
(function (Drawing) {
var Triangle = /** @class */ (function () {
function Triangle() {
}
Triangle.prototype.draw = function () {
console.log("Triangle is drawn");
};
return Triangle;
}());
Drawing.Triangle = Triangle;
})(Drawing || (Drawing = {}));
/// <reference path = "IShape.ts" />
/// <reference path = "Circle.ts" />
/// <reference path = "Triangle.ts" />
function drawAllShapes(shape) {
shape.draw();
}
drawAllShapes(new Drawing.Circle());
drawAllShapes(new Drawing.Triangle());
使用 node 命令查看輸出結果為：
$ node app.js
Circle is drawn
Triangle is drawn
嵌套命名空間
命名空間支持嵌套，即你可以將命名空間定義在另外一個命名空間里頭。
namespace namespace_name1 {
export namespace namespace_name2 {
export class class_name { }
}
}
成員的訪問使用點號 . 來實現，如下實例：
Invoice.ts 文件代碼：
namespace Runoob {
export namespace invoiceApp {
export class Invoice {
public calculateDiscount(price: number) {
return price * .40;
}
}
}
}
InvoiceTest.ts 文件代碼：
/// <reference path = "Invoice.ts" /> var invoice = new Runoob.invoiceApp.Invoice(); console.log(invoice.calculateDiscount(500));
使用 tsc 命令編譯以上代碼：
tsc --out app.js InvoiceTest.ts
得到以下 JavaScript 代碼：
JavaScript
var Runoob;
(function (Runoob) {
var invoiceApp;
(function (invoiceApp) {
var Invoice = /** @class */ (function () {
function Invoice() {
}
Invoice.prototype.calculateDiscount = function (price) {
return price * .40;
};
return Invoice;
}());
invoiceApp.Invoice = Invoice;
})(invoiceApp = Runoob.invoiceApp || (Runoob.invoiceApp = {}));
})(Runoob || (Runoob = {}));
/// <reference path = "Invoice.ts" />
var invoice = new Runoob.invoiceApp.Invoice();
console.log(invoice.calculateDiscount(500));
使用 node 命令查看輸出結果為：
$ node app.js
200
TypeScript 語言特性
TypeScript 是一種給 JavaScript 添加特性的語言擴展。增加的功能包括：
以下功能是從 ECMA 2015 反向移植而來：
JavaScript 與 TypeScript 的區別
TypeScript 是 JavaScript 的超集，擴展了 JavaScript 的語法，因此現有的 JavaScript 代碼可與 TypeScript 一起工作無需任何修改，TypeScript 通過類型注解提供編譯時的靜態類型檢查。
TypeScript 可處理已有的 JavaScript 代碼，并只對其中的 TypeScript 代碼進行編譯。
總結
到此這篇關于TypeScript 命名空間的文章就介紹到這了,更多相關TypeScript 命名空間內容請搜索億速云以前的文章或繼續瀏覽下面的相關文章希望大家以后多多支持億速云！
免責聲明：本站發布的內容（圖片、視頻和文字）以原創、轉載和分享為主，文章觀點不代表本網站立場，如果涉及侵權請聯系站長郵箱：is@yisu.com進行舉報，并提供相關證據，一經查實，將立刻刪除涉嫌侵權內容。
