1.简介:
TypeScript 是 JavaScript 的一个超集、由微软开发的自由和开源的编程语言、设计目标是开发大型应用。是一种面向对象的编程语言,遵循强类型
javascript与typescript的区别:
1.TypeScript 是 JavaScript 的超集，扩展了 JavaScript 的语法，因此现有的 JavaScript 代码可与 TypeScript 一起工作无需任何修改，TypeScript 通过类型注解提供编译时的静态类型检查。
2.TypeScript 可处理已有的 JavaScript 代码，并只对其中的 TypeScript 代码进行编译。
安装:
npm install -g typescript使用node命令执行js
$ node XXX.js2.数据类型
1.数字类型(number)
/* 3.数字类型 */
let num:number = 12315;
num = 1008611
console.log(num)2.字符串类型(string)
/* 使用单引号(')或者双引号(")来表示字符串类型，反引号(`)来定义多行文本或者内嵌表达 */
/* 2.字符串类型 */
let strs:string = "好想爱这个世界啊";
strs = "恋爱的犀牛"
console.log(strs)3.布尔类型(boolean)
/* 1.布尔类型 */
let flag:boolean = true;
flag = false;
console.log(flag)4.数组类型
有两种表现形式
// 在元素类型后面加上[]
let arr: number[] = [1, 2];
// 或者使用数组泛型
let arr: Array<number> = [1, 2];5.任意类型(any)
声明为 any 的变量可以赋予任意类型的值
任意值允许在编译时可选择地包含或移除类型检查
/*7.任意类型(any) */
let temp:any = 123156;
temp = "年少有为"
console.log(temp)6.元祖
用来表示已知元素数量和类型的数组，各元素的类型不必相同，对应位置的类型需要相同。
let x: [string, number];
x = ['Runoob', 1]; // 一类型对应一值7.枚举(enum)
枚举类型用于定义数值集合
enum Color {Red, Green, Blue};
let c: Color = Color.Blue;
console.log(c); // 输出 28.void
于标识方法返回值的类型，表示该方法没有返回值。
/* 9.void 无返回值类型 */
function run():number{
console.log("run")
return 1234
}
console.log(run())9.null
表示对象缺失10.undefined
用于初始化变量为一个未定义的值
/* 8.null 与 undefined */
let to:null
to=null
let tos:null | undefined
tos =undefined11.never
never 是其它类型（包括 null 和 undefined）的子类型，代表从不会出现的值。2.1TypeScript遵循强类型
类型断言(Type Assertion)
类型断言可以用来手动指定一个值的类型，即允许变量从一种类型更改为另一种类型。
var str = '1'
var str2:number = <number> <any> str //str、str2 是 string 类型
console.log(str2)
如何确定单个断言是否足够
当 S 类型是 T 类型的子集，或者 T 类型是 S 类型的子集时，S 能被成功断言成 S。这是为了在进行类型断言时提供额外的安全性，完全毫无根据的断言是危险的，如果你想这么做，你可以使用 any。
它之所以不被称为类型转换，是因为转换通常意味着某种运行时的支持。但是，类型断言纯粹是一个编译时语法，同时，它也是一种为编译器提供关于如何分析代码的方法。
编译后生成的JavaScript代码
var str = '1';
var str2 = str; //str、str2 是 string 类型
console.log(str2);类型推断
当类型没有给出时，TypeScript 编译器利用类型推断来推断类型。
如果由于缺乏声明而不能推断出类型，那么它的类型被视作默认的动态 any 类型。变量作用域
TypeScript 有以下几种作用域：
全局作用域 −
全局变量定义在程序结构的外部，它可以在你代码的任何位置使用。
类作用域 −
这个变量也可以称为 字段。类变量声明在一个类里头，但在类的方法外面。 该变量可以通过类的对象来访问。类变量也可以是静态的，静态的变量可以通过类名直接访问。
局部作用域 −
局部变量，局部变量只能在声明它的一个代码块（如：方法）中使用。
var global_num = 12 // 全局变量
class Numbers {
num_val = 13; // 实例变量
static sval = 10; // 静态变量
storeNum():void {
var local_num = 14; // 局部变量
}
}
console.log("全局变量为: "+global_num)
console.log(Numbers.sval) // 静态变量
var obj = new Numbers();
console.log("实例变量: "+obj.num_val)3.函数
函数是一组一起执行一个任务的语句。
定义函数
// 函数定义
function greet():string { // 有返回值切返回一个string
return "Hello World"
}
function caller() { //无返回值
var msg = greet() // 调用 greet() 函数
console.log(msg)
}带参数的函数
function add(x: number, y: number): number {
return x + y;
}
console.log(add(1,2))可选参数与默认参数
可选参数使用问号标识 "?"
//可选参数
function buildName(firstName: string, lastName?: string) {
if (lastName){
return firstName + " " + lastName;
}else{
return firstName;
}
}
调用该函数时如果未传入参数则使用该默认值
//默认参数
function calculate_discount(price:number,rate:number = 0.50) {
var discount = price * rate;
console.log("计算结果: ",discount);
}剩余参数
//以 ... 为前缀，它将成为一个由剩余参数组成的数组.
function addNumbers(...nums:number[]) {
var i;
var sum:number = 0;
for(i = 0;i<nums.length;i++) {
sum = sum + nums[i];
}
console.log("和为：",sum)
}匿名函数
var msg = function() {
return "hello world";
}匿名函数自调用
(function () {
var x = "Hello!!";
console.log(x)
})()构造函数
TypeScript 也支持使用 JavaScript 内置的构造函数 Function() 来定义函数
var myFunction = new Function("a", "b", "return a * b");
var x = myFunction(4, 3);
console.log(x);递归函数
递归函数即在函数内调用函数本身
function factorial(number) {
if (number <= 0) { // 停止执行
return 1;
} else {
return (number * factorial(number - 1)); // 调用自身
}
};Lambda函数（箭头函数）
Lambda 函数也称之为箭头函数。
箭头函数表达式的语法比函数表达式更短。
//
var foo = (x:number)=>10 + x
console.log(foo(100)) //输出结果为 110
//
var foo = (x:number)=> {
x = 10 + x
console.log(x)
}
foo(100)
//不指定参数类型，通过函数内判断
var func = (x)=> {
if(typeof x=="number") {
console.log(x+" 是一个数字")
} else if(typeof x=="string") {
console.log(x+" 是一个字符串")
}
}
func(12)
func("Tom")
//无参数时可以设置空括号，单个参数时括号()是可选的
var disp =()=> {
console.log("Function invoked");
}
disp();函数重载
重载是方法名字相同，而参数不同，返回类型可以相同也可以不同。
每个重载的方法（或者构造函数）都必须有一个独一无二的参数类型列表。
//参数类型不同
function disp(s1:string):void;
//参数数量不同
function disp(n1:number,s1:string):void;
//参数类型顺序不同
function disp(x:any,y?:any):void;4.接口
接口是一系列抽象方法的声明，
是一些方法特征的集合，这些方法都应该是抽象的，需要由具体的类去实现，
然后第三方就可以通过这组抽象方法调用，让具体的类执行具体的方法。
实例
//interface 定义接口
interface IPerson {
firstName:string,
lastName:string,
sayHi: ()=>string
}
//customer 实现了接口 IPerson 的属性和方法。
var customer:IPerson = {
firstName:"Tom",
lastName:"Hanks",
sayHi: ():string =>{return "Hi there"}
}联合类型接口
interface RunOptions {
program:string;
commandline:string[]|string|(()=>string); //联合类型参数
}接口和数组
interface ages {
[index:string]:number
}
var agelist:ages;
agelist["John"] = 15 // 正确
agelist[2] = "nine" // 错误接口继承
接口继承就是说接口可以通过其他接口来扩展自己。
Typescript 允许接口继承多个接口。
继承使用关键字 extends。
//单继承
interface Person {
age:number
}
interface Musician extends Person {
instrument:string
}
var drummer = <Musician>{};
drummer.age = 27
drummer.instrument = "Drums"
//多继承
interface IParent1 {
v1:number
}
interface IParent2 {
v2:number
}
interface Child extends IParent1, IParent2 { }
var Iobj:Child = { v1:12, v2:23}5.类
TypeScript 是面向对象的 JavaScript。
TypeScript 支持面向对象的所有特性，比如 类、接口等。
定义类的关键字为 class，后面紧跟类名，类可以包含以下几个模块（类的数据成员）：
- 字段 − 字段是类里面声明的变量。字段表示对象的有关数据。
- 构造函数 − 类实例化时调用，可以为类的对象分配内存。
- 方法 − 方法为对象要执行的操作。
访问控制修饰符
TypeScript 中，可以使用访问控制符来保护对类、变量、方法和构造方法的访问。TypeScript 支持 3 种不同的访问权限。
public（默认） : 公有，可以在任何地方被访问。
protected : 受保护，可以被其自身以及其子类和父类访问。
private : 私有，只能被其定义所在的类访问。类
class Cat{
name:string
//构造函数
constructor(name:string){
this.name = name
})
//方法
run():string{
return this.name
}
}
//创建一个对象
var obj = new Cat("狸猫")
//访问字段
obj.name
//访问方法
obj.run();类的继承
class Cat{ //猫
name:string
age:number
//构造函数
constructor(name:string){
this.name = name
})
}
class liMao extends Cat{ //狸猫，继承猫类
constructor(name:string){
super(name)
})
eat():void{
console.log(this.age) //子类可以直接使用父类的属性
}
}
子类只能继承一个父类，TypeScript 不支持继承多个类，但支持多重继承
class Root {str:string; }
class Child extends Root {}
class Leaf extends Child {}继承类的方法重写
class PrinterClass {
doPrint():void {
console.log("父类的 doPrint() 方法。")
}
}
class StringPrinter extends PrinterClass {
doPrint():void {
super.doPrint() // 调用父类的函数
console.log("子类的 doPrint()方法。")
}
}static关键字
用于定义类的数据成员（属性和方法）为静态的，静态成员可以直接通过类名调用。
class StaticMem {
static num:number; //添加static关键字
static disp():void {
console.log("num 值为 "+ StaticMem.num) //类名.属性名
}
}
StaticMem.num = 12 // 初始化静态变量
StaticMem.disp() // 调用静态方法instanceof运算符
用于判断对象是否是指定的类型，如果是返回 true，否则返回 false。
class Person{ }
var obj = new Person()
var isPerson = obj instanceof Person;
//true类和接口
类可以实现接口，使用关键字 implements，并将 interest 字段作为类的属性使用
interface ILoan {
interest:number
}
class AgriLoan implements ILoan {
interest:number
rebate:number
constructor(interest:number,rebate:number) {
this.interest = interest
this.rebate = rebate
}
}
var obj = new AgriLoan(10,1)
console.log("利润为 : "+obj.interest+"，抽成为 : "+obj.rebate )