TypeScript基础总结

TypeScript是微软开发的开源编程语言

TypeScriptJavaScript的超集,其本质是向JavaScript添加了数据类型面向对象特征

TypeScript 代码可JavaScript一起使用

TypeScript文件扩展名为.ts,可以编译为JavaScript代码,扩展名为.js文件

创建TypeScript项目

创建文件夹

新建typescript文件 记事本文件更改后缀名为.ts

文件里输入console.log(“Hello World”)

hello world 程序完成

运行 TypeScript项目

打开cmd命令行进到文件所在文件夹

tsc 文件名.ts // 将ts文件编译为.js文件

使用node命令运行js文件

node 文件名.js

TypeScript支持数据类型系统

 类型名称 说明
boolean 布尔类型
number 数字类型
string 字符串类型
Array 数组类型
enum 枚举类型
any 任意类型

声明变量

let 变量名:数据类型=

在TypeScript中,浮点数、整数均属于number类型

let num1:number=3;

 let num2:number=3.2;

 let num3:number=0b1010;

 let num4:number=0o744;

 let num5:number=0xf00d;

在TypeScript中, 字符串类型的值需要通过双引号或单引号将字符串的值进行包裹

 let name1string=“Hello, my name is ‘Lin’   ”

 let name2string=‘Hello, my name is “Lin”   ’ 

Array数组类型

两种定义方式:

let arr1:number[ ]=[2,7,9];

 let arr2Array<number>=[2,7,9];

let arr3:[string,number]=[“age”,30]; //元组 数组中元素类型不同时使用

enum枚举类型

定义格式:

enum 枚举类型名{   常数名1=常数值1, 常数名2=常数值……. }

any任意类型

当不确定数据类型时可以使用any类型

let aa1:any=20;

let aa2:any=“abc”;

let aa3:any=true;

let aa4:any[ ]=[1,true,”freee”];

无参函数和有参函数

无参函数定义

 function  函数名称(){

     //函数主体

}

function  buildName( ){

     return “MaYun”;

}

有参函数定义:

function  函数名称(参数名1:参数类型,参数名2:参数类型…){

     //函数主体

}

//调用并传值

let name1:string =buildName(“Ma”,”Huateng”);

ps:

每个参数必须传入值(可传递null,undefined,

传递的值的个数与定义的参数个数一致

传递的值的类型与定义的参数类型一致

名函数

匿名函数语法 :

let 变量名称=function (x:参数类型,y:参数类型){

     return x+y;

}

 let buildName=function(x:string,y:string ){

     return  x+y;

}

可选参数

当不确定传入某一类型的参数时,可通过在参数名后面加入?符号,使该参数变为可选参数。

function buildNamefirstName:string, lastname? :string{

   if(lastName!=null){     

       return firstname+”  ”+lastName

   }else{

       return firstname;

   }

}

let result1:string=buildName(“Bob”,”Adams”);

let result2:string=buildName(“Bob”);

剩余参数

当剩余多个同一类型的参数同时存在时,可以使用剩余参数

参数名前添加

参数类型使用数组类型

剩余参数与可选参数类似,可以传入值(任意个值),也可不传值(一个值也不传

function buildName(firstname:string,restOfName:string[ ]){

    return firstname+” “+restOfName.join(“,”); 

}

let result:string=buildName(“Lili“,”John”,”David”,”Durban“);

console.log(result);

属性定义格式:

//class:声明的关键字,Stu:类名,首字母大写

class Stu{

    //属性:格式:属性名:属性类型

    id:number; //学号

    name:string; //姓名

    agenumber//年龄

 }

方法定义格式:

class Stu{

    id:number;

    name:string;

    age:number

   print(){

         //this:代表自身,name:属性名

         console.log(“my name is “+this.name);

   }

}

//与声明变量的语法类似(let 变量名:类型名=值)

//let 对象名:类名= 实例化的对象

//使用new关键字,实例化该类的对象,

//let  对象名:类名= new 类名();

let p:Stu=new Stu();

//给属性赋值:对象名.属性=值;

p.name=”张三“;

//调用方法:对象名.方法名();

p.print();

构造函数:

class Stu{

    id:number;

    name:string;

    age:number

   print(){

         console.log(“my name is “+this.name);

   }

   //构造函数的名字是constructor,不能改  

   constructor(id:number,name:string,age:number){

    this.id=id;//this表示类自身

    this.name=name;

    this.age=age;

   }

}

//new 类名(),自动调用构造函数

//new 类名(1,值2,值3)

let p:Stu=new Stu(1,”lisi”,30);

p.print();

类的继承

可以在子类中重写添加新的行为

//继承的关键字:extends

class  ziStu extends Stu{

    sayHello(){

        console.log(“我是一个子类“);

    }

    print(){

        console.log(“重写父类中的方法”);

    }

}

//调用继承过来的构造函数

let zi:ziStu=new ziStu(2,”wangwu”,20);

//调用重写print()方法

zi.print();

//调用添加新方法say()

zi.sayHello();

方法的重载

调用时根据传入自动选择对应的方法执行

class  AA{

   //1.方法重载定义,没有方法体

  add(a:number,b:number);

  add(a:string,b:string);

  //2.声明一个any类型重载定义,并实现方法体

  add(a:any,b:any){

    console.log(a+b);

  }

}

let a:AA = new AA();

a.add(1,2);

a.add(“zhang“,”san”);

评论

  1. ww
    2年前
    2019-12-26 11:12:45

    666

  2. wcc
    博主
    9月前
    2021-8-24 9:22:17

    999

发送评论 编辑评论


				
|´・ω・)ノ
ヾ(≧∇≦*)ゝ
(☆ω☆)
(╯‵□′)╯︵┴─┴
 ̄﹃ ̄
(/ω\)
∠( ᐛ 」∠)_
(๑•̀ㅁ•́ฅ)
→_→
୧(๑•̀⌄•́๑)૭
٩(ˊᗜˋ*)و
(ノ°ο°)ノ
(´இ皿இ`)
⌇●﹏●⌇
(ฅ´ω`ฅ)
(╯°A°)╯︵○○○
φ( ̄∇ ̄o)
ヾ(´・ ・`。)ノ"
( ง ᵒ̌皿ᵒ̌)ง⁼³₌₃
(ó﹏ò。)
Σ(っ °Д °;)っ
( ,,´・ω・)ノ"(´っω・`。)
╮(╯▽╰)╭
o(*////▽////*)q
>﹏<
( ๑´•ω•) "(ㆆᴗㆆ)
😂
😀
😅
😊
🙂
🙃
😌
😍
😘
😜
😝
😏
😒
🙄
😳
😡
😔
😫
😱
😭
💩
👻
🙌
🖕
👍
👫
👬
👭
🌚
🌝
🙈
💊
😶
🙏
🍦
🍉
😣
Source: github.com/k4yt3x/flowerhd
颜文字
Emoji
小恐龙
花!
上一篇
下一篇