一、搭建
1、TypeScript环境搭建
npm install -g typescript
2、TypeScript打包成js
tsc helloworld.ts
3、运行js
node helloworld.js
二、搭建
1、TypeScript环境搭建
npm install -g typescript
2、打包并运行
npm install -g ts-node
ts-node helloworld.js
三、静态类型(Static Typing)
//静态类型
const count:number=1; //count会继承数字类型的方法
const name1: string = '李白'
// null undefinde,boolean,void,symbol
//对象类型包括 对象,数组,类,函数
const duixiao:{
name:string,
age:number
}={
name:"字符串",
age:50
}
const arr:string[]=["字符串","名字"];
class Person{};
const lei:Person=new Person();
const functions:()=>string=()=>{return ""};
三、类型注解与推断
// type annotation 类型注解
let num:number;
num=10;
// type inference 类型推断
let strings="asda"
//工作使用问题(潜规则)
// 如果Ts能够自动分析变量类型,我们就上面也不要做了
// 如果Ts无法分析变量类型的话,我们就需要使用类型注解
//不用类型注解
const one=1;
const two=2;
const three=one+two;
//需要类型注解
function getTotal(one,two){
return one+two
}
const total=getTotal(1,2);
四、函数参数和返回值的注解
//1、函数返回类型的注解
//规定返回类型
function getTotal(one:number,two:number):number{
return one+two;
}
getTotal(1,2);
//不返回
function sayHello():void{
console.log("")
}
//函数永远不能执行完、死循环
function errunction():never{
throw new Error()
}
errunction();
function forNever():never{
while(true){}
}
//2、函数参数注解 函数中传递对象,写一个相同的对象并把注解加上
function getoneTwo({one,two}:{one:number,two:number}){
return one+two
}
getoneTwo({one:1,two:2});
//单个对象
function getOne({one}:{one:number}){
return one;
}
getOne({one:1})
五、数组类型注解
//数组类型注解的方法
const numberArr:number[]=[1,2,3];
const stringArr:string[]=['a','b','c']
const undefindeArr:undefined[]=[undefined,undefined,undefined];
//数组多类型注解
const arr:(number | string)[]=[1,'string',2];
console.log(arr);
//数组 内对象
const xiaojiejie:{name:string,age:number}[]=[
{name:"刘艺",age:15},
{ name:"李四",age:20}
]
//数组内对象 另外一种形式
//type作用就是给类型起一个新名字,支持基本类型、联合类型、元祖及其它任何你需要的手写类型,常用于\color{red}{联合类型}
type Lady={name:string,age:number};
const xiaojiejie1:Lady[]=[
{name:"刘艺",age:15},
{ name:"李四",age:20}
]
//可用class来代替类型别名type
class Madam{
name:string;
age:number;
}
const xiaojiejie2:Madam[]=[
{name:"刘艺",age:15},
{ name:"李四",age:20}
]
六、元组的使用和类型约束
//元组的使用和类型约束
const xiaojiejie:[string,string,number]=['asdas','asdas',29];
const xiaojiejie1:[string,string,number][]=[
['sdqw','qweqa',23],
['asd','qeqw',36]
]
7、接口的使用(结合实现与继承)
//接口interface
const screenResume=(name:string,age:number,bust:number)=>{
age<24&&bust>=90 && console.log(name+'进入面试')
age>=24||bust<90&&console.log(name+'你被淘汰')
}
const getResume=(name:string,age:number,bust:number)=>{
console.log(name+'年龄是'+age);
}
screenResume('加大',18,94);
getResume('加大',18,94);
//以上写法 重复太多
//定义一个接口 规定参数 定义类型,重复使用,减少代码。
interface Girl{
name:string,
age:number,
bust:number,
[propname:string]:any,//任意类型与值
say():string
}
//一个接口继承另外一个接口
interface teacher extends Girl{
teach():string
}
//类实现接口
class xjj implements Girl{
name="王婷"
age=26
bust=10
qwe="qwe"
say(){
return "很有感觉"
}
}
let girl={
name:"王婷",
age:26,
bust:10,
qwe:"qwe",
say(){
return "很有感觉"
},
teach(){
return ""
}
}
const screenResumeage=(girl:Girl)=>{
girl.age<24&&girl.bust>=90 && console.log(name+'进入面试')
girl.age>=24||girl.bust<90&&console.log(name+'你被淘汰')
}
const getResumeage=(girl:Girl)=>{
console.log(girl.name+'年龄是'+girl.age,girl.qwe,girl.say());
}
screenResumeage(girl);
const teachers=(girl:teacher)=>{
console.log(girl.name+'年龄是'+girl.age,girl.qwe,girl.say());
}
teachers(girl)
8、类的复习
1、类的使用
//类的使用
class lady{
name="虚空";
sayhello():string{
return "你好"
}
}
class xiaojijie extends lady{
//子继承父 子可以重写父的方法 super可以点出父类中的属性
sayhello(): string {
return "帅哥,你好"+super.sayhello()
}
saylove(): string {
return "i love you"
}
}
let say=new xiaojijie();
console.log(say.name,say.sayhello)
2、类的访问类型
//public 公共的 在类的外部和内部 继承都能访问
//
// privat私有的 类的外部不能访问 继承也不能访问
//
//protected 类的内部 和继承能使用,类的外部不能访问
class Person{
public name:String;
private age:number;
protected sex:number;
}
const person=new Person();
//报错 person.age='jspang'
// 报错类的外部不能访问 person.sex;
person.name='jspang'
console.log(person.name);
3、类的构造函数
//类的构造函数
class aperson{
//不太优雅
// public name:string;
// constructor(name:string){
// this.name=name;
// }
//简化版
constructor(public name:string){}
}
//子类继承父类 必须写super()
class apersonone extends aperson {
constructor(public age:number){
super("")
}
}
const person=new aperson('wl')
console.log(person.name)
const apersononebig=new apersonone(20)
console.log(apersononebig.age)
4、类的getter,setter ,static
//类的getter,setter
class xiaojiejie{
constructor(private _age:number){}
get age(){
return this._age-10;
}
set myage(age:number){
this._age=age;
}
}
const myxiaojiejie = new xiaojiejie(20);
//类的getter,setter是一个属性不是方法
console.log(myxiaojiejie.age)
myxiaojiejie.myage=50;
console.log(myxiaojiejie.age)
//statc 静态属性 直接通过类名调用方法
class Girl{
static sayLove(){
}
}
console.log(Girl.sayLove())
5、抽象类和抽象方法
//抽象类 如果一个抽象类中有抽象方法 那么继承抽象方法的类 要实现这个抽象方法。
abstract class Girls{
abstract skill()
}
class Waiter extends Girls {
skill(){
return "端茶倒水"
}
}
class fuwu extends Girls {
skill(){
return "fuwu"
}
}
9、联合类型,类型断言。
//联合类型和类型保护
interface Waiter
{
anjiao:boolean,
say:()=>{}
}
interface Teacher{
anjiao:boolean,
sayyingyu:()=>{}
}
//联合类型
function judgeWho(animal:Waiter|Teacher){
//类型守护1
if(animal.anjiao){
//类型断言
(animal as Waiter).say()
}else{
(animal as Teacher).sayyingyu()
}
}
//联合类型
function judgeWhotwo(animal:Waiter|Teacher){
//类型守护2
if("say" in animal){
animal.say()
}else{
animal.sayyingyu()
}
}
//联合类型
function add(first:string | number,second:string | number){
//用typeof做类型守护 字符串拼接 数字相加
if(typeof first==="string" || typeof second==="string"){
return `${first}${second}`
}
return first+second
}
class NumberObj{
cont:number=0;
}
//联合类型
function addObj(first:object | NumberObj,second:object|NumberObj){
//用instanceof做类型守护
if(first instanceof NumberObj && second instanceof NumberObj){
return first.cont+second.cont
}
return 0;
}
var Numberdeobj=new NumberObj();
console.log(addObj({},Numberdeobj))
10、枚举类型
//初级程序员 写判断值
function getServe(Statis:number):string{
if(Statis===0){
return "anjiao"
}else if(Statis===1){
return "spa"
}else if(Statis===2){
return"dbj"
}else{
return ""
}
}
getServe(2)
//中级程序员 写的判断值
var todygan={
anjiao:0,
spa:1,
dbj:2
}
function getServetwo(statis:number):string{
if(statis===todygan.anjiao){
return "anjiao"
}else if(statis===todygan.spa){
return "spa"
}else if(statis===todygan.dbj){
return"dbj"
}else{
return ""
}
}
getServetwo(todygan.dbj);
//高级程序员定义一个枚举 枚举内参数不赋值 默认从0开始
enum Statis{
anjiao,
spa,
dbj
}
//也可以赋值 给第一个赋值 后面会con第一个值开始递增
enum Statistwo{
anjiao=1,
spa,
dbj
}
function getServethree(statis:number):string{
if(statis===todygan.anjiao){
return "anjiao"
}else if(statis===todygan.spa){
return "spa"
}else if(statis===todygan.dbj){
return"dbj"
}else{
return ""
}
}
console.log(getServethree(Statis.dbj))
11、泛型
//泛型
function join<weilei>(first:weilei,secound:weilei){
return `${first}${secound}`
}
join<string>("ad","ada");
//泛型中数组的使用
function myFun<ANY>(params:ANY[]){
return params
}
myFun<string>(["1","2","3"])
//泛型中数组的使用
function myFuntwo<T>(params:Array<T>){
return params
}
myFuntwo<string>(["1","2","3"])
//多个泛型的使用
function jointwo<weilei,d>(first:weilei,secound:d){
return `${first}${secound}`
}
jointwo<string,number>("魏磊",20)
//在类中使用泛型
class SelectGirs<T>{
constructor(private girls:T[]){}
getGirl(index:number):T{
return this.girls[index];
}
}
const SelectGirss=new SelectGirs<string>(["a","b","c"]);
SelectGirss.getGirl(0);
//泛型监测接口
interface Girltwo{
name:string
}
class SelectGirstwo<T extends Girltwo>{
constructor(private girls:T[]){}
getGirl(index:number):string{
return this.girls[index].name;
}
}
const SelectGirsstwo=new SelectGirstwo([
{name:"a"},
{name:"b"}
])
console.log(SelectGirsstwo.getGirl(0))
//泛型约束 通过继承其他类型来约束
class SelectGirsthree<T extends string|number>{
constructor(private girls:T[]){}
getGirl(index:number):T{
return this.girls[index];
}
}
const SelectGirssthree=new SelectGirsthree<string>(["a","b"])
console.log(SelectGirssthree.getGirl(0))
12、ts命令空间
//命名空间
namespace qwer{
export class a{
constructor(){
console.log(a)
}
}
export class b{
constructor(){
console.log(b)
}
}
}
//命名空间嵌套
namespace qwers{
namespace qwerst{
export class a{
constructor(){
console.log(a)
}
}
export class b{
constructor(){
console.log(b)
}
}
}
export class a{
constructor(){
console.log(a)
}
}
export class b{
constructor(){
console.log(b)
}
}
}