函数

与js一样，ts可以创建有名字的函数和匿名函数。

定义函数

function add(x: number, y: number): number {
    return x + y;
}//有名字的函数

let myAdd = function(x: number, y: number): number { return x + y; };//匿名函数

函数类型包含了两个部分：参数类型和返回值类型.
所以我们可以给一个变量赋值一个函数类型：
let add2:{x:number,y:number}=>number

参数

//可选参数
function add(x: number, y?: number): number {
    return x + y;
}
//ts里面的每个函数都必须有值。当然，如果允许的话，我们也可以传递undefined或者null。参数多一个或者少一个都是不能通过编译时检查的，如果我们希望后续的参数是可选的，可以如上例所示使用？，表示可选参数。注意：可选参数必须跟在必要参数后面。

//默认参数：用户没有传递这个参数或者传递的值是undefined时。
function buildName(firstName: string, lastName = "Smith") {
    return firstName + " " + lastName;
}
//默认参数存放的位置没有任何限制，但是如果不是放在最后面，就必须使用undefined或者null对该参数的位置进行占位处理。

//剩余参数
function buildName(firstName: string, ...restOfName: string[]) {
  return firstName + " " + restOfName.join(" ");
}

let employeeName = buildName("Joseph", "Samuel", "Lucas", "MacKinzie");
//剩余参数会被当做个数不限的可选参数。 可以一个都没有，同样也可以有任意个。 编译器创建参数数组，名字是你在省略号（ ...）后面给定的名字，你可以在函数体内使用这个数组。

async和await
这两个关键字是es8中提出的，它们用一种声明的方式告诉ts运行时在await关键字处停止执行代码，等待结果返回，并在结果返回处继续执行代码。

async function a(id:string){
    try{
       return await a(id);
    }catch(err){
       console.log(err);
    }
}

回调函数和promise

promise是拥有过程状态的，通过Promise构造器创建，reslove和reject是两个参数，分别处理成功和失败的情况。

const promise = new Promise((resolve,reject)=>{
    resolve(2333);
});

promise.then((res)=>{
    console.log("res:"+res);
}).catch((err)=>{
//有异常才会走这段逻辑
    console.log("err:"+err);
})

const promise = new Promise((resolve,reject)=>{
    reject(new Error("出错了"));
});

promise.then((res)=>{
//不会走这段逻辑
    console.log("res:"+res);
}).catch((err)=>{
    console.log("err:"+err);
})

//promise具有链式性的优点，一旦得到一个Promise对象，从那一个promise起，使用Promise会不断地得到新的promise

案例如下：
const fs = require('fs');
function readFileAsync(filePath:string):Promise<any>{
    return new Promise((resolve,reject)=>{
        fs.readFile(filePath,(error,result)=>{
            if(error){
                reject(error)
            }else{
                resolve(result)
            }
        })
    })
};

function loadJSONAsync(filePath:string):Promise<any>{
    return readFileAsync(filePath).then(function(result){
        return JSON.parse(result)
    })
}

loadJSONAsync('test.json')
  .then(function(result){
      console.log(result);
  }).catch(function(error){
      console.log(error);
  })

并行控制流

function fethUserInfo(userId:string):Promise<{}>{
    return new Promise(resolve => {
        setTimeout(() => {
            resolve({ userId })
        }, 1000);
    })
}
function fethCartInfo(userId:string):Promise<{}>{
    return new Promise(resolve => {
        setTimeout(() => {
            resolve({ userId })
        }, 1200);
    })
}

Promise.all([fethCartInfo("1"),fethUserInfo("2")]).then(res =>{
    console.log(res);
})
//执行一系列的异步任务，并在所有任务完成后执行操作。

TypeScript基础入门2

函数

猜你喜欢