在本教程中，我们将学习TypeScript中的箭头函数。

什么是箭头函数？

箭头函数(又称胖箭头函数)是编写函数表达式的简洁方法。

在下面的示例中，我们有两种以ES5和ES6编码风格编写函数的方式。

//ES5
var getResult = function(username, points) {
  return username + ' scored ' + points + ' points!';
};

//ES6
var getResult = (username: string, points: number): string => {
  return `${ username } scored ${ points } points!`;
}

无参数且无返回值的箭头函数

要创建没有参数且没有返回值的箭头函数，我们使用给定的语法。

() => {}

在下面的示例中，我们有一个函数" fun1"，该函数不带任何参数且不返回任何值。

var fun1 = () => {
  console.log("Hello World");
};

//calling
fun1();

上面的代码类似于以下代码。

var fun1 = function() {
  console.log("Hello World");
};

没有参数但返回一些值的箭头函数

以下是没有参数但返回一些值的箭头函数的语法。

(): type => {
  return expr;
}

在下面的示例中，我们有一个函数fun2，该函数不带任何参数，但返回的值为number类型。

var fun2 = (): number => {
  return Math.random();
};

//calling
console.log("Random number: " + fun2());

上面的代码类似于下面的代码。

var fun2 = function() {
  return Math.random();
};

具有参数但无返回值的箭头函数

以下是具有某些参数但不返回任何值的箭头函数的语法。

(v1: type, v2: type, ...): void => {}

在下面的示例中，我们有一个函数" fun3"，该函数接受两个参数(字符串和数字)并且不返回任何值。

var fun3 = (username: string, points: number): void => {
  let str = `${ username } scored ${ points } points!`;
  console.log(str);
};

//calling
fun3('theitroad', 10);

上面的代码类似于以下代码。

var fun3 = function(username, points) {
  var str = username + ' scored ' + points + ' points!';
  console.log(str);
};

带参数的箭头函数并返回一些值

以下是具有某些参数并返回某些值的箭头函数的语法。

(v1: type, v2: type, ...): type => {
  return expr;
}

在下面的示例中，我们有一个函数fun4，它接受两个参数(字符串和数字)并返回一个字符串值。

var fun4 = (username: string, points: number): string => {
  return `${ username } scored ${ points } points!`;
};

//calling
console.log(fun4('theitroad', 10));

上面的代码类似于以下代码。

var fun4 = function(username, points) {
  return username + ' scored ' + points + ' points!';
};