函数是JavaScript应用程序的基础。 它帮助你实现抽象层,模拟类,信息隐藏和模块。 在TypeScript里,虽然已经支持类,命名空间和模块,但函数仍然是主要的定义 行为的地方。 TypeScript为JavaScript函数添加了额外的功能,让我们可以更容易地使用。


一、js中的三种定义函数的ts实现

二、ts中函数声明和实现分离的写法

(1)利用type声明函数

(2)利用interface声明函数

三、js函数参数的三种用法的ts实现

(1)可选参数

(2)默认参数

(3)剩余参数


        和JavaScript一样,TypeScript函数可以创建有名字的函数和匿名函数。 你可以随意选择适合应用程序的方式,不论是定义一系列API函数还是只使用一次的函数。通过下面的例子可以迅速回想起这两种JavaScript中的函数:

// Named function
function add(x, y) {
    return x + y;
}

// Anonymous function
let myAdd = function(x, y) { return x + y; };

一、js中的三种定义函数的ts实现

TS中的函数大部分和JS相同,不同之处在于ts会在函数的(参数)这中间和后面加上类型声明

// JavaScript定义函数的方法
// 命名函数

function say1(name) {

  console.log(name);

}

// 匿名函数

let say2 = function (name) {

  console.log(name);

}

// 箭头函数

let say3 = (name) => {

  console.log(name);

}
// typescript定义函数的方法
// 命名函数

function say1(name:string):void {

  console.log(name);

}

// 匿名函数

let say2 = function (name:string):void {

  console.log(name);

}

// 箭头函数

let say3 = (name:string):void =>{

  console.log(name);

}

二、ts中函数声明和实现分离的写法

(1)利用type声明函数

// 先利用type声明一个函数
type AddFun = (a:number, b:number)=>number;
// 再根据声明去实现这个函数
// 此时函数的参数和返回值可以不需要写类型声明了,因为ts可以通过这个函数声明推断出来类型了
let add:AddFun = function (x, y) {
    return x + y;
};
let res = add(30, 20);
console.log(res);

(2)利用interface声明函数

// 先利用interface声明一个函数
interface AddFun {
     (a:number, b:number):number   
}
let add:AddFun = function (x, y) {
    return x + y;
};
let res = add(30, 20);
console.log(res);

三、js函数参数的三种用法的ts实现

(1)可选参数

// 需求: 要求定义一个函数可以实现2个数或者3个数的加法

function add(x:number, y:number, z?:number):number {

  return x + y + (z ? z : 0);

}

let res = add(10, 20);

let res = add(10, 20, 30);

注意事项:可选参数可以是一个或多个。

(2)默认参数

function add(x:number, y:number=10):number {

  return x + y;

}

let res = add(10);

let res = add(10, 30);

(3)剩余参数

function add(x:number, ...ags:number[]) {

  console.log(x);

  console.log(ags);

}

add(10, 20, 30, 40, 50)

        函数是一组一起执行一个任务的语句。您可以把代码划分到不同的函数中。如何划分代码到不同的函数中是由您来决定的,但在逻辑上,划分通常是根据每个函数执行一个特定的任务来进行的。函数声明告诉编译器函数的名称、返回类型和参数。函数定义提供了函数的实际主体。