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函数定义

typescript object 如何定义value类型 typescript类型定义文件_泛型

TS元组

typescript object 如何定义value类型 typescript类型定义文件_命名空间_02

TS联合类型

typescript object 如何定义value类型 typescript类型定义文件_命名空间_03


typescript object 如何定义value类型 typescript类型定义文件_父类_04

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 ]

typescript object 如何定义value类型 typescript类型定义文件_命名空间_05

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){}

泛型接口

typescript object 如何定义value类型 typescript类型定义文件_父类_06

泛型约束

//泛型约束
interface GerLength
{
//定义一个接口,用来约束将来某个类型必须要有这一属性
    length:number
}
function getLength<T extends GerLength>(x:T):number
{
    return x.length;
}
console.log(getLength<string>("simple"));