TypeScript学习(四)函数

文章目录

  • 1.定义函数
  • 2.函数类型
  • 3.可选类型和默认参数
  • 4.剩余参数
  • 5.this

1.定义函数

   使用function关键字来定一个函数。

function hello() {
  console.log("hello")
}

hello(); // hello

2.函数类型

   和变量一样,在TypeScript中,函数同样可以像变量一样声明类型。通常可以不声明函数类型,因为TypeScript可以通过return语句自动推断出函数的返回值类型。

function add(a: number, b: number): number {
  return a + b;
}

(1)完整函数类型

   函数类型包含两部分,函数的参数类型和返回值类型。

let add: (a: number, b: number) => number = function (
  a: number,
  b: number
): number {
  return a + b;
};

(2)推断类型

   如果在赋值语句的一边声明了类型,而另一边没有声明类型,TypeScript编译器会自动识别出类型。

let add = function (
  a: number,
  b: number
): number {
  return a + b;
};

let add: (a: number, b: number) => number = function (a, b) {
  return a + b;
};

3.可选类型和默认参数

   TypeScript中,每个函数参数都是必须的。也就是说,传递给每一个函数的参数个数必须与函数期望的参数个数一致。JavaScript里,每个参数都是可选的,可传可不传。 没传参的时候,它的值就是undefined。 在TypeScript里我们可以在参数名旁使用 ?实现可选参数的功能。可选参数必须跟在必须参数后面。

   在TypeScript里,我们也可以为参数提供一个默认值当用户没有传递这个参数或传递的值是undefined时。 它们叫做有默认初始化值的参数。在所有必须参数后面的带默认初始化的参数都是可选的,与可选参数一样,在调用函数的时候可以省略。 也就是说可选参数与末尾的默认参数共享参数类型。

   与普通可选参数不同的是,带默认值的参数不需要放在必须参数的后面。 如果带默认值的参数出现在必须参数前面,用户必须明确的传入 undefined值来获得默认值。

function add(a: number, b: number = 2): number {
  return a + b;
}

console.log(add(2)); // 4

4.剩余参数

   在JavaScript里,你可以使用 arguments来访问所有传入的参数。在TypeScript里,你可以把所有参数收集到一个变量里。

function sayNames(id: number, ...names: string[]): string {
  return id + names.join("");
}

5.this

   在TypeScript中使用this可能会被警告犯了一个错误,因为this的类型是any。这时我们可以通过提供一个显式的this参数,出现在参数列表的最前面,来指定this的类型。

function sayNames(this:void, id: number, ...names: string[]): string {
  return id + names.join("");
}

你可能感兴趣的:(TypeScript,typescript,javascript,学习)