学习记录--TypeScript

TS知识

TS基础

一、基础类型

数据类型	关键字	描述
任意类型	any	声明为any的变量可以赋予任意类型的值
数字类型	number	双精度64位浮点值。它可以用来表示整数和分数
字符串类型	string	一个字符系列，使用单引号（‘）或双引号("")来表示字符串类型，反引号（`）来定义多行文本和内嵌表达式
布尔类型	boolean	表示逻辑值：true和false let flag : boolean = true
数组类型	无	声明变量为数组 // 在元素类型后面加上[] let arr : number[] = [1,2];
元组	无	元组类型用来表示已知元素数量和类型的数组，各元素的类型不必相同 let x :[string, number]; x= ['cjk' ,1]
枚举	enum	枚举类型用于定义数值集合 enum Color {Red, Green, Blue}; let c: Color = Color.Blue; console.log(c); // 输出 2
void	void	用于表示方法返回的类型,表示该方法没有返回值
null	null	表示对象值缺失
undefined	undefined	用于初始化变量为一个未定义的值
never	never	never是其它类型（包括null和undefined）的子类型，代表从不会出现的 值。

注意：TypeScript和JavaScript 没有整数类型

二、变量声明

1、类型断言（Type Assertion）

类型断言可以用来手动指定一个值的类型，即允许变量从一种类型更改为另一种类型。
语法格式：
<类型> 值
或
值 as 类型
实例

var str = '1';
var str2:number = <number><any> str //str、str2是string类型
console.log(str2)

2、类型推断

当类型没有给出时,TypeScript 编译器利用类型推断来推断类型
如果由于缺乏声明而不能推断出类型，那么它的类型被视为默认的动态any类型。

var num = 2；
console.log("num 变量的值为"+num);
num = "12";
console.log(num);

• 第一行代码声明了变量num 并设置初始值为2，注意变量声明没有指定类型。因此，程序使用类型推断来确定变量的数据类型，第一次赋值为2，num设置为number类型。
• 第三行代码，当我们再次为变量设置字符串类型的值时，这时编译会错误，因为变量已经设置为number类型
  error TS2332 : Type '"12"' is not assignable to type ''number

三、运算符

1、算术运算符

同java、js

2、关系运算符

== 、 > 、< 、等
同java、js

3、逻辑运算符

&& 、|| 、！
同java、js

4、短路运算符

&& 、||
如果前面为false,&&后者不执行

5、位运算符

运算符	描述	例子	类似于	结果
~	取反，取反是一元运算符，对一个二进制的每一位执行逻辑反操作。使数字1成为0，0成为1	x=~5	~0101	1010,即 -6（补码 = 原码取反 + 1）

位运算符同java

6、赋值运算符

同java

7、三元运算符

同Java

8、类型运算符

8.1、typeof运算符

typeof是一元运算符，返回操作数的数据类型。

var num = 12;
console.log(typeof num); // 输出结果：number

8.2、instanceof

instanceof 运算符用于判断对象是否为指定的类型。

9、其他运算符

9.1负号运算符（-）

更改操作数的符号

var x:number = 4;
var y = -x;
console.log("x 值为：",x); // 输出结果为4
console.log("y 值为：",y); //输出结果为-4

10、字符串运算符：连接运算符（+）

+运算符可以拼接两个字符串

var msg:string = "chenjk4"+".com";
console.log(msg);

四、条件语句

1、switch…case 语句

switch语句必须遵循下面的规则：

• switch 语句中的expression是一个常量表达式，必须是一个整型或枚举类型
• 不是每一个case都需要包含break。如果case语句不包含break，控制流将会继续后续的case，直到遇到break

– ts循环

1、for…in循环

for…in 语句用于一组值的集合或列表进行迭代输出
语法

 for(var val in list){
 }
 var j:any;
 var n:any = "a b c";
 for(j in n){
	console.log(n[j])
}

2、for…of循环

let someArray = [1,"string",false];
for(let entry of someArray){
	console.log(entry);
}

3、forEach、every、while

3.1forEach

let list = [4,5,6];
list.forEach((val, idx, array)=>){
	//val :当前值
	//idx:当前index
	//array : Array
})

因为forEach 在iteration中无法返回，所以可以使用every和some来取代forEach。

3.2every

let list = [4,5,6];
list.every((val, idx, array) =>{
	//val :当前值
	//idx:当前index
	//array:Array
	return true;
})

五、函数

基本同java函数

function buildName(firstName: string, lastName: string) {
    return firstName + " " + lastName;
}
let result1 = buildName("Bob");                  // 错误，缺少参数
let result2 = buildName("Bob", "Adams", "Sr.");  // 错误，参数太多了
let result3 = buildName("Bob", "Adams");         // 正确

1、可选参数和默认参数

可选参数
在TypeScript函数里，如果我们定义了参数，则我们必须传入这些参数，除非将这些参数设置为可选，可选参数使用问号?。

function buildName(firstName :string, lastName?:string){
		if(lastName){
			return firstName + "" + lastName;
		}else{
			return firstName;
		}
}
let result1 = buildName("Bob"); // 正确
let result2 = buildName("Bob“,"Adams","cjk"); //错误，参数太多了
let result3 = buldName("Bob","Adams"); //正确

可选参数必须跟在必需参数后面。 如果上例我们想让 firstName 是可选的，lastName 必选，那么就要调整它们的位置，把 firstName 放在后面。

2、默认参数

我们也可以设置参数的默认值，这样在调用函数的时候，如果不传入该参数的值，则使用默认参数。

function calculate_discount(price :number , rate:number = 0.50){
	var discount = price * rate;
	console.log("计算结果：",discount);
}
calculate_discount(1000);
calculate_discount(1000,0.30);

3、剩余参数

有一种情况，我们不知道向函数传入多少个参数，这时候我们就可以使用剩余参数来定义。
剩余参数语法允许我们将一个不确定数量的参数作为一个数组传入。

function buildName(firstName:string, ...restOfName : string[]){
	return firstName + "" + restOfName.join(" ");
}
let employeeName

4、匿名函数

匿名函数是一个没有函数名的函数
匿名函数在程序运行时动态声明，除了没有函数名外，其他的与标准函数一样。
我们可以将匿名函数赋值一个变量，这种表达式就成为函数表达式。

var res = function([arguments]){...}

var msg = function(){
	return "helli world";
}
console.log(msg()); // 输出hello world

var res = function(a:number,b:number){
return a*b;
}
console.log(res(12,2)); //输出24

5、匿名函数自调用

匿名函数自调用在函数后使用（）即可

（function(){
	  var x = "hello!";
	  console.log(x);
}）();

6、构造函数

TypeScript 也支持使用JavaScript 内置的构造函数Function（）来定义函数

var res = new Function([arg1[,arg2[,...argN]],] functionBody)
- arg1,arg2...argN:参数列表
- functionBody: 一个含有包括函数定义的JavaScript语句的字符串

var myFunction = new Function("a","b","return a*b");
var x = myFunction(4,3);
console.log(x); //输出12

7、Lambda 函数

Lambda 函数也称之为箭头函数
箭头函数表达式的语法比函数表达式更短
函数只有一行语句
（[param1,param2,…paramN]） => statement;

var foo = (x:number) => {
     x = 10+x;
     console.log(foo(100));
     }
     foo(100) ; // //输出110

六、Number对象

1、对象属性

序号	属性&描述
1	prototype Number对象的静态属性。使您有能力向对象添加属性和方法。
2	constructor 返回对创建此对象的Number函数的引用
3	NaN 非数字值（Not-A-Number）

1.1、NaN实例

var month = 0;
if(month<=0 || month>12){
	month = Number.NaN;
	console.log("月份是：”+ month);
}else{
	console.log("正确");
}

1.2、prototype 实例

function employee(id:number,name:string){
	this.id = id ;
	this.name = name;
}
var emp = new emplpyee(123,"cjk“);
employee.prototype.email = "[e-mail]";

console.log("员工号："+emp.id);
console.log("员工姓名："+emp.name);
console.log("员工邮箱："+emp.email)

2、Number对象方法

Number对象，支持以下方法

序号	方法&描述	实例
1	toExponential 把对象的值转换为指数计数法	//toExponential()
		var num1 = 1225.30
		var val = num1.toExponential();·
		console.log(val) // 输出： 1.2253e+3

2.1、toFixed()

把数字转换成为字符串，并对小数点指定位数

var num3 = 177.234;
console.log("num3.toFixed()为" + num3.toFixed()) ; //输出：177
console.log("num3.toFixed(2)为"+ num3.toFixed(2)); // 输出：177.23
console.log("num3.toFixed(6)为"+ num3.toFixed(6)); 
//输出：177.234000

2.2、toPrecision()

把数字格式化为指定的长度

var num = new Number(7.123456);
console.log(num.toPrecision()); // 输出：7.123456
console.log(num.toPrecision(1)); //输出：7
console.log(num.toPrecision(2)); //输出：7.1

2.3、toString()

把数字转换为字符串，使用指定的基数。数字的基数是2~36之间的整数。若省略该参数，则使用基数10.

var num = new Number(10);
console.log(num.toString()); //输出10进制：10
console.log(num.toString(2)); //输出2进制：1010
console.log(num.toString(8)) ;// 输出8进制：12

2.3、valueOf()

返回一个Number对象的原始数字值

var num = new Number(10);
console.log(num.valueOf()); //输出：10

七、String (字符串)

1、String对象属性

1.1、constructor

对创建该对象的函数引用

var str = new String("This is string");
console.log("str.constructor is:"+str.constructor);
//输出结果
str.constructor is : function String(){ [native code] }

1.2、prototype

允许您向对象添加属性和方法

function employee(id:number,name:string){
	this.id = id ;
	this.name = name;
}
var emp  = new employee(123,"cjk");
employee.prototype.email="[e-mail]" // 添加属性 email
console.log("员工号: "+emp.id) 
console.log("员工姓名: "+emp.name) 
console.log("员工邮箱: "+emp.email)

八、Array(数组)

数组对象是使用单独的变量名来存储一系列的值

var sites : string[];
sites = ["Google","Runoob","Taobao"];

//或者
var numlist : number[] = [2,4,6,8];

1、数据解构

我们也可以把数组元素赋值给变量，如下所示

var arr:number[] = [12,13];
var[x,y] = arr; //将数组的两个元素赋值给变量x和y
console.log(x);
console.log(y);

2、数组迭代

我们可以使用for语句来循环输出数组各个元素

var j:any;
var nums: number[] = [1001,1002,1003,1004];

for(j in nums){
	 console.log(nums);
}

3、数组方法

3.1、concat()

连接两个或更多数组，并返回结果

var alpha = ["a","b","c"]；
var number = [1,2,3];

var alphaNum = alpha.concat(number);
console.log("alphaNum : " + alphaNum ); // a,b,c,1,2,3

3.2、every()

检测数值元素的每个元素是否都符合条件

function isBigEnough(elemet , index, array){
	return (element >= 10);
}

var passed = [12,5,8,130,44].every(isBigEnough);
console.log("Test value:" + passed); //false

3.3、filter()

检测数值元素，并返回符合条件所有元素的数组

function isBigEnough(element, index, array){
	return (element >= 10);
}
var passed = [21,5,6,130,44].filter(isBigEnough);
console.log("Test Value："+ passed); //21,130,44

3.4、forEach()

数组每个元素都执行一次回调函数

let num = [7,8,9];
num.forEach(function(value){
	console.log(value);
});

3.5、indexOf()

搜索数组中的元素，并返回它所在的位置。如果搜索不到，返回值-1，代表没有此项

var inde = [12,5,8,130,44].indexOf(8);
console.log("index is: " + index); //2

3.6、join()

把数组的所有元素放入一个字符串

var arr = new Array("First","Second","Third");
var str = arr.join();
console.log("str:"+ str); //First,Second,Third

var  str = arr.join(" + ");
console.log("str："+ str); //First + Second + Third

3.7、lastIndexOf()

返回一个指定的字符串值最后出现的位置，在一个字符串中的指定位置从后向前搜索

var index = [12,5,8,130,44].lastIndexOf(8);
coosole.log("index is : "+index); // 2

3.8、map()

通过指定函数处理数组的每个元素，并返回处理后的数组

var numbers = [1,4,9];
var roots = numbers.map(Math.sqrt); //开根号
console.log("roots is : "+ roots); //1,2,3

3.9、pop()

删除数组的最后一个元素并返回删除的元素

var numbers = [1,4,9];
var element = numbers.pop();
console.log("element is :" + element); //9
var element = numbers.pop();
console.log("element is : " + element); //4  

3.10、push()

向数组的末尾添加一个或更多元素，并返回新的长度

var numbers = new Array(1,4,9);
var length = numbers.push(10);
console.log("new numbrees is : " + numbers); //1，4，9，10
length = numbers.push(20);
console.log("new numbers is :"+ numbers); //1,4,9,10,20

3.11、reduce()/reduceRight()

将数组元素计算为一个值（从左到右） (reduceRight()从右到左)

var total = [0,1,2,3].reduce(function(a,b){
	return a +b;
});
console.log("total is :" + total); //6

3.12、reverse()

反转数组的元素数据

var arr = [0,1,2,3].reverse();
console.log("Reversed array is : " + arr); //3,2,1,0

3.13、shift()

删除并返回数组的第一个元素

var arr = [10,1,2,3].shift();
console.log("Shifted value is ：" + arr); //10

3.14、slice()

选取数组的一部分，并返回一个新的数组

var arr = ["orange", "mango","banana","sugar","tea"];
console.log("arr.slice(1,2) :" + arr.slice(1,2)); // mango
console.log("arr.slice(1,3) :" + arr.slice(1,2)); // mango,banana

3.15、some()

检测数组元素中是否有元素符合指定条件

function isBigEnough(element, index, array){
	return (element >= 10);
}
var retval = [2,,5,8,1,4].some(isBigEnough);
console.log("value:" + retval ) ； // false

var retval = [12,5,8,1,4].some(isBigEnough);
console.log("value:"+ retval); // true

3.16、sort()

对数组的元素进行排序

var arr = new Array("orange","mango","banana","sugar");
var sorted = arr.sort();
console.log("return string is ："+ sorted); // banana,mango,orange,sugar

3.17、splice()

从数组中添加或删除元素 (0：添加，1：删除)

var arr = ["orange", "mango", "banana", "sugar","tea"];
var removed = arr.splice(2,0,"water");
console.log("After adding 1:" + arr); //orange,mango,water,banana
removed = arr.splice(3,1);
console.log("After removing 1:" + arr); //orange,mango,water,sugar,tea
console.log（”remmoved is :“ + removed）; //banana

3.18、toString()

把数组转换为字符串，并返回结果

var arr = new Array("orange","mango","banana","sugar");
var str = arr.toString();
console.log(""+ str) ; // orange,mango,banana,sugar

3.19、unshift()

向数组的开头添加一个或更多元素，并返回新的长度

var arr = new Array("orange","mango","banana","sugar");
var length = arr;unshift("water");
console.log("Returned array is : " + arr); //water, orange,mango,banana,sugar
console.log(""+ length); //5

九、Map对象

Map对象保存键值对，并且能够记住键的原始插入顺序。
任何值（对象或原始值）都可以作为一个键或一个值。

1、创建Map

TypeScript 使用Map类型和new关键字来创建Map:
Map 相关的函数与属性：

• map.clear() – 移除 Map 对象的所有键/值对 。
• map.set() – 设置键值对，返回该 Map 对象。
• map.get() – 返回键对应的值，如果不存在，则返回 undefined。
• map.has() – 返回一个布尔值，用于判断 Map 中是否包含键对应的值。
• map.delete() – 删除 Map 中的元素，删除成功返回 true，失败返回 false。
• map.size – 返回 Map 对象键/值对的数量。
• map.keys() - 返回一个 Iterator 对象， 包含了 Map 对象中每个元素的键 。
• map.values() – 返回一个新的Iterator对象，包含了Map对象中每个元素的值 。

2、迭代Map

Map对象中的元素是按顺序插入的，我们可以迭代Map对象，每一次迭代返回[key,value]。

let nameSiteMapping = new Map();
nameSiteMapping.set("Google",1);
nameSiteMapping.set("sf",2);
nameSiteMapping.set("tx",3);

//迭代Map中的key
for( let key of nameSiteMapping.keys()){
	console.log(key);
}
//迭代Map中的value
for(let value of nameSiteMapping.values()){
	console.log(value);
}
//迭代Map中的key=>value
for(let entry of nameSiteMapping.entries()){
	console.log(entry[0],entry[1]);
}
//使用对象解析
for(let [key,value] of nameSiteMapping){
	console.log(key,value);
}

//输出结果为：
Google
Runoob
Taobao
1
2
3
Google 1
Runoob 2
Taobao 3
Google 1
Runoob 2

十、元组

1、解构元组

我们可以把元组元素赋值给变量

var  a = [10,"Runnoob"];
var [b,c] = a;
console.log(b);
console.log(c);
//输出结果
10
Runoob

十一、联合类型

联合类型（Union Types）可以通过管道(|)将变量设置多种类型，赋值时可以根据设置的类型来赋值。
注意：只能赋值指定的类型，如果赋值其它类型就会报错。

Type|Type1|Type2

//实例
var val:string|number
val = 12;
console.log("数字为 "+val);
val = "Runoob";
console.log("字符串为"+ val);

将联合类型作为函数参数使用

function disp(name:string|string[]){
	if(typeof name == "string"){
			console.log(name);
	}else{
			var i;
			for(i = 0;i<name.length;i++){
				console.log(name[i]);
		}
	}
}
disp("Runoob");
disp(["Runoob","Google","Taobao"]);

1、联合类型数组

var arr:number[] | string[];
var i:number;
arr = [1,2,4];
console.log("");

for(i = 0;i<arr.length;i++){
	console.log(arr[i]);
}
arr = ["Runoob","Google","Taobao"]
console.log("")
for(i = 0;i<arr.length;i++){
	console.log(arr[i]);
}

十二、TypeScript接口

接口时一系列抽象方法的声明，是一些方法特征的集合，这些方法都应该是抽象的，需要由具体的类去实现，抽象方法调用，让具体的类执行具体的方法

interface interface_name{
}

实例

//接口IPerson
interface IPerson{
	firstName : string,
	lastName : string,
	sayHi:()=> string
}
//实现接口
var customer:IPerson = {
		firstName : "Tom",
		lastName : "Hanks",
		sayHi:():string =>{return "Hi there"}
}
//调用具体对象的方法
console.log(customer.firstName);
console.log(customer.lastName);
console.log(customer.sayHi());

var employee:IPerson = { 
    firstName:"Jim",
    lastName:"Blakes", 
    sayHi: ():string =>{return "Hello!!!"} 
} 
 
console.log("Employee  对象 ") 
console.log(employee.firstName) 
console.log(employee.lastName)

接口不能转成JavaScript，它只是TypeScript的一部分

1、联合类型和接口

interface RunOptions{
	program: string;
	commandline : string[] | string | (()=>string);
}

//commandline 是字符串
var options : RunOptions = {program:"test1", commandline : "Hello"};
console.log(options.commandline)

//commandline 是字符串数组
options = {program:"test1", commandline:["Hello","World"]};
console.log(options.commandline[0]);
console.log(options.commandline[1]);

//commandline 是一个函数表达式
options = {program : "test1",commandline: ()=> {return "Hello World"}}；

var fn:any = options.commandline;
console.log(fn());

2、接口和数组

接口中我们可以将数组的索引值和元素设置为不同类型，索引值可以是数字或字符串

interface namelist{
	[index:number] : string
}
var list2:namelist = ["John", 1 , "Bran"] //错误元素1 不是string类型
interface ages{
	[index : string] : number
}
var agelist : ages;
agelist["John"] = 15 // 正确
agelist[2] = "nine" //错误， index为string类型

3、接口继承

接口继承就是说接口可以通过其他接口来扩展自己
TypeScript 允许接口继承多个接口
继承使用关键字extends
单接口继承语法格式:

Child_interface_name extends super_interface_name

多接口继承语法格式：

Child_interface_name extends super_interface1_name,super_interface2_name,...

4、多继承

interface IParent1{
	v1: number
}
interface IParent2{
	v2:number
}
interface Child extends IParent1, IParent2{}
var Iobj : Child = { v1:12, v2:23}
console.log("value 1:"+ Iobj.v1 + "value 2:"+ Iobj.v2);

十三、TypeScript类

TypeScript是面向对象的JavaScript.
类描述了所创建的对象共同的属性和方法
TypeScript 支持面向对象的所有特性，比如类、接口等
定义类的关键字为class，后面紧跟类名，类可以包含以下几个模块（类的数据成员）：

• ** 字段** -字段是类里面声明的变量。字段表示对象的有关数据
• ** 构造函数** -类实例化时调用，可以为类的对象分配内存
• 方法 -方法为对象要执行的操作

实例

class Person{}

1、创建类的数据成员

this关键字表示当前类实例化的对象。注意构造函数的参数名与字段名相同，this.engine表示类的字段

class Car{
	//字段
	engine : string;
	//构造函数
	constructor(engine:string){
		   this.engine = engine;
	}
	//方法
	disp():void{
			console.log("发动机为："+this.engine)
	}
}

2、实例化对象

class Car{
	//字段
	engine : string;
	costructor(engine : string){
			this.engine = engine;
	}
	disp():void{
		 	console.log(""+this.engine);
	}
}
//创建一个对象
var obj = new Car("XXSY1")；
//访问字段
console.log(obj.engine+"");
obj.disp();

3、类的继承

同java

4、继承类的方法重写

同java

5、static关键字

同java

6、instanceof 运算符

同java
var isPersion = obj instanceof Persion

7、访问控制修饰符

• public (默认)：公有，可以在任何地方被访问
• protected ： 受保护，可以被其自身以及其子类和父类访问
• privater ：私有，只能被其定义所在的类访问

8、类和接口

类可以实现接口，使用关键字implements,并将interest字段作为类的属性使用。

interface ILoan{
	interest : number
}
class AgriLoan implements ILoan{
	interest : number
	rebate : number
	constructor(interest:number,rebate:number){
		   this.interest = interset;
		   this.rebate = rebate;
	}
}

var obj = new AgriLoan(10,1);
console.log("利润为：" + obj.interest + ",抽成："+ obj.rebate);

9、TypeScript对象

对象是包含一组键值对的实例。值可以是标量、函数、数组、对象等

var object_name = {
		key1: "value1",
		key2: "value2",
		key3: function(){
			//函数
		}，
		key4:["content1","content2"] //集合
}

以上对象包含了标量，函数，集合（数组或元组）

10、对象实例

var sites = {
	 site1 : "Runoob",
	 site2 : "Google"
};
//访问对象的值
console.log(sites.site1);
console.log(sites.site2);

11、TypeScript类型模板

Typescript中的对象必须是特定类型的实例

var sites = {
		site1: "Runoob",
		site2: "Google",
		sayHello : function(){} //类型模板
}；
sites.sayHello = function(){
	    console.log("hello" + sites.site1);
};
sites.sayHello();

此外对象也可以作为一个参数传递给函数

var sites = {
		site1 : "Runoob",
		site2:  "Google"
};
var invokesites = function(obj : {site1:string, site2: string}){
	  console.log("site1:"+ obj.site1);
	  console.log("site2:"+ obj.site2);
}
invokesites(sites);

12、Duck Typing

动态类型的一种风格，是多态的一种形式
在这种风格中，一个对象有效的语义，不是由继承自特定的类或实现特定的接口，而是由"当前方法和属性的集合"决定。
在鸭子类型中，关注点在于对象的行为，能作什么；而不是关注对象所属的类型。例如，在不使用鸭子类型的语言中，我们可以编写一个函数，它接受一个类型为"鸭子"的对象，并调用它的"走"和"叫"方法。在使用鸭子类型的语言中，这样的一个函数可以接受一个任意类型的对象，并调用它的"走"和"叫"方法。如果这些需要被调用的方法不存在，那么将引发一个运行时错误。任何拥有这样的正确的"走"和"叫"方法的对象都可被函数接受的这种行为引出了以上表述，这种决定类型的方式因此得名。

interface IPoint { 
    x:number 
    y:number 
} 
function addPoints(p1:IPoint,p2:IPoint):IPoint { 
    var x = p1.x + p2.x 
    var y = p1.y + p2.y 
    return {x:x,y:y} 
} 
 
// 正确
var newPoint = addPoints({x:3,y:4},{x:5,y:1})  
 
// 错误 
var newPoint2 = addPoints({x:1},{x:4,y:3})

十四、TypeScript命名空间

区分范围
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());

输出

$ node app.js
Circle is drawn
Triangle is drawn

1、嵌套命名空间

命名空间支持嵌套，即你可以将命名空间定义在另外一个命名空间里头。

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

2、TypeScript模块

3、TypeScript声明文件

TypeScript 作为 JavaScript 的超集，在开发过程中不可避免要引用其他第三方的 JavaScript 的库。虽然通过直接引用可以调用库的类和方法，但是却无法使用TypeScript 诸如类型检查等特性功能。为了解决这个问题，需要将这些库里的函数和方法体去掉后只保留导出类型声明，而产生了一个描述 JavaScript 库和模块信息的声明文件。通过引用这个声明文件，就可以借用 TypeScript 的各种特性来使用库文件了。

假如我们想使用第三方库，比如 jQuery，我们通常这样获取一个 id 是 foo 的元素：

$('#foo');
// 或
jQuery('#foo');

但是在 TypeScript 中，我们并不知道 $ 或 jQuery 是什么东西：

jQuery('#foo');

// index.ts(1,1): error TS2304: Cannot find name ‘jQuery’.
这时，我们需要使用 declare 关键字来定义它的类型，帮助 TypeScript 判断我们传入的参数类型对不对：

declare var jQuery: (selector: string) => any;

jQuery('#foo');

declare 定义的类型只会用于编译时的检查，编译结果中会被删除。

上例的编译结果是：

jQuery('#foo');

声明文件
声明文件以 .d.ts 为后缀，例如：

runoob.d.ts

声明文件或模块的语法格式如下：

declare module Module_Name {
}

TypeScript 引入声明文件语法格式：

/// <reference path = " runoob.d.ts" />

当然，很多流行的第三方库的声明文件不需要我们定义了，比如 jQuery 已经有人帮我们定义好了

实例
以下定义一个第三方库来演示：

CalcThirdPartyJsLib.js 文件代码：

var Runoob;  
(function(Runoob) {
    var Calc = (function () { 
        function Calc() { 
        } 
    })
    Calc.prototype.doSum = function (limit) {
        var sum = 0; 
 
        for (var i = 0; i <= limit; i++) { 
            sum = sum + i; 
        }
        return sum; 
    }
    Runoob.Calc = Calc; 
    return Calc; 
})(Runoob || (Runoob = {})); 
var test = new Runoob.Calc();

如果我们想在 TypeScript 中引用上面的代码，则需要设置声明文件 Calc.d.ts，代码如下：

Calc.d.ts 文件代码：

declare module Runoob { 
   export class Calc { 
      doSum(limit:number) : number; 
   }
}

声明文件不包含实现，它只是类型声明，把声明文件加入到 TypeScript 中：

CalcTest.ts 文件代码：

/// <reference path = "Calc.d.ts" /> 
var obj = new Runoob.Calc(); 
// obj.doSum("Hello"); // 编译错误
console.log(obj.doSum(10));

基础完结