TypeScipt -回调函数

同步的例子

 // 同步的写法
function add(a: number, b: number) :number {
    return a + b
}
// add()必须等 a + b算完，如果这段代码是很长的网络请求，将会很耗时间
// 同时前端如果在这儿一直等待，就会卡住
console.log(add(2,3))

异步-回调函数

回调函数基础语法-将函数作为参数

// 1.首先看懂这个函数
// 2. 首先声明了一个返回值为void，名字叫做add的函数
// 3. 这个add函数有三个形参，第一个是number类型的a,第二个是number类型的b,第三个是一个函数，它的名字叫做callback, 这个函数的样子应该是有一个number作为形参，返回值为void
// 4. add函数的函数体是将 (a+b)作为形参传给 自己的形参 callback
function add(a: number, b: number, 
    callback: (res: number) => void): void {
        callback(a + b)
}

demo1

function add(a: number, b: number, 
    callback: (res: number) => void): void {
        callback(a + b)
}
function test (result: number) : void {
    console.log(result)
}
// 把参数都丢进去调用即可
add(2, 3, test) 

// 最后的打印出 5
 

demo2

function add(a: number, b: number, 
    callback: (res: number) => void): void {
        callback(a + b)
}
// 直接丢个函数体进去
add(2, 3, res=> {
    console.log('2+3', res)
})

// 最后的打印出 "2+3",  5

demo3 - 积蓄利用局部变量

function add(a: number, b: number, 
    callback: (res: number) => void): void {
        callback(a + b)
}

add(2, 3, res=> {
    console.log('2+3',res)
    // 想继续利用局部变量就得回调函数套回调函数
    add(res,4, res2 => {
        console.log('2 + 3 + 4', res)
    })
})
// 结果是
//[LOG]: "2+3",  5 
//[LOG]: "2 + 3 + 4",  5