1.在全局中安装typescript
npm i typescript -g
2.编写.ts文件
3.编译.ts文件
tsc filename.ts
//会生成filename.js文件
//然后用node执行js文件
ts定义数组
let arr:number[]=[1,2,3]
let arr:Array<number>=[]//泛型写法
typescript类型
TS变量声明
var [变量名] : [类型] = 值;
声明变量并初始值,但不设置类型,该变量可以是任意类型:
var [变量名] = 值;
TS类型断言(Type Assertion)
类型断言可以用来手动指定一个值的类型,即允许变量从一种类型更改为另一种类型。
语法格式:<类型>值
var str = '1'
var str2:number = <number> <any> str //str、str2 是 string 类型
console.log(str2)
TS类型推断
当类型没有给出时,TypeScript 编译器利用类型推断来推断类型。
如果由于缺乏声明而不能推断出类型,那么它的类型被视作默认的动态 any 类型
var num = 2; // 类型推断为 number
console.log("num 变量的值为 "+num);
num = "12"; // 编译错误
console.log(num);
TS函数定义
TS元组
TS联合类型
TS接口
接口是一系列抽象方法的声明,是一些方法特征的集合,这些方法都应该是抽象的,需要由具体的类去实现,然后第三方就可以通过这组抽象方法调用,让具体的类执行具体的方法。
通俗的来说,接口与抽象类的区别就是需要实现接口的虚函数的直接就是对象
TypeScript 接口定义如下:
interface interface_name {
}
interface IPerson {
firstName:string,
lastName:string,
sayHi: ()=>string
}
var customer:IPerson = {
firstName:"Tom",
lastName:"Hanks",
sayHi: ():string =>{return "Hi there"}
}
console.log("Customer 对象 ")
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)
TS联合接口类型
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());
接口和数组
接口中我们可以将数组的索引值和元素设置为不同类型,索引值可以是数字或字符串。
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" // 错误
TS接口继承
多继承语法
Child_interface_name extends super_interface1_name, super_interface2_name,…,super_interfaceN_name
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)
TS对继承类的方法重写
类继承后,子类可以对父类的方法重新定义,这个过程称之为方法的重写。
其中 super 关键字是对父类的直接引用,该关键字可以引用父类的属性和方法。
class PrinterClass {
doPrint():void {
console.log("父类的 doPrint() 方法。")
}
}
class StringPrinter extends PrinterClass {
doPrint():void {
super.doPrint() // 调用父类的函数
console.log("子类的 doPrint()方法。")
}
}
TS static 关键字
static 关键字用于定义类的数据成员(属性和方法)为静态的,静态成员可以直接通过类名调用。
TS使用类实现接口(implement关键字)
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 )
TS命名空间
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());
TS泛型
指在定义函数、接口或类的时候,不预先指定具体的类型,而在使用的时候再指定具体类型的一种特性。
function test<T>(x:T,y:T):T[]
{
let arr=[]
arr.push(x)
arr.push(y)
return arr
}
console.log(test<string>("x","y"));//[ 'x', 'y' ]
console.log(test<number>(1,3));//[ 1, 3 ]
ts枚举类型
enum Color {Red = 1, Green, Blue}
let colorName: string = Color[2]
console.log(colorName) // 'Green'
ts类型断言
类型断言这种方式可以告诉编译器,“相信我,我知道自己在干什么”。 类型断言好比其它语言里的类型转换,但是不进行特殊的数据检查和解构。 它没有运行时的影响,只是在编译阶段起作用。 TypeScript 会假设你,程序员,已经进行了必须的检查。
function getParmLength(str:number|string):number
{
//if(str.length)
//return str.lengthif里面会报错
//使用类型断言
if((<string>str).length)
return str.length
else
return str.toString().length
}
只读属性
在属性前面加一个readonly
ts函数接口
interface FuncIFC\
{
(str:string):string
}
const test:FuncIFC=(str:string)=>{
return str;
}
接口与类之间的关系
interface ifc
{
func()
}
//接口可以作为类的规范
//一个类的类型可以实现一个或者多个接口,实现多个接口的时候,多个接口之间使用逗号分隔。
class Person implements ifc
{
func(){console.log("sss");}
}
多个接口实现整合
interface ifc1
{}
interface ifc2{}
interface ifc extends ifc1,ifc2
class Test implements ifc{}
ts类
class Animal
{
name:string;
constructor(name:string)
{
this.name=name;
}
run(distance:number=0)
{
console.log(`${this.name} run ${distance}`);
}
}
class Snake extends Animal
{
constructor(name:string)
{
//调用父类构造函数
super(name);
}
run(distance:number=5)
{
//重写父类的方法
console.log('sliding---');
super.run(distance)
}
}
class Horse extends Animal
{
constructor(name:string)
{
super(name);
}
run(distance:number=10)
{
console.log("jiajiajia--");
super.run(distance)
}
}
let snake=new Snake("simple")
let horse=new Horse("bailongma")
snake.run()
horse.run()
构造函数中的参数
class Person
{
//构造函数中的参数一旦用
//readonly,public,private,protected修饰之后,就会默认在类中添加此属性,不用再声明此属性了
constructor(readonly name:string="siple"){}
}
let person:Person=new Person("bob");
console.log(person.name);
类中的getter和setter
class Person
{
firstName:string
lastName:string
constructor(firstName:string,lastName:string)
{
this.firstName=firstName;
this.lastName=lastName
}
//读取器
get fullName()
{
return this.firstName+this.lastName
}
//设置器
set fullName(val)
{
let names=val.split("-");
this.firstName=names[0];
this.lastName=names[1];
}
}
let person:Person=new Person("simple","wang");
console.log(person.fullName);
person.fullName="wang-sipeng";
console.log(person.fullName);
ts抽象类
抽象类不能被实例化,只能作为基类使用,派生类必须实现基类的方法
abstract class Animal
{
abstract cry()//抽象的方法不能被实现
}
class Dog extends Animal
{
cry()
{
console.log("dog cry");
}
}
ts可选参数和默认参数
function test(str1:string="bob",str2?:string):string
{
return str1+str2;
}
console.log(test("simple"));
console.log(test());
ts剩余参数
function restParm(str:string,...rest:Array<string>)
{
return {rest,str};
}
console.log(restParm("simple","bob","jack"));
//{ rest: [ 'bob', 'jack' ], str: 'simple' }
ts函数重载
函数名字相同,参数个数或者类型不同
function add(x:string,y:string){}
function add(x:number,y:number){}
泛型接口
泛型约束
//泛型约束
interface GerLength
{
//定义一个接口,用来约束将来某个类型必须要有这一属性
length:number
}
function getLength<T extends GerLength>(x:T):number
{
return x.length;
}
console.log(getLength<string>("simple"));