TypeScript 中的 function 和 => 有什么区别？ [复制]答案

【问题标题】：What's the difference between function and => in TypeScript? [duplicate]TypeScript 中的 function 和 => 有什么区别？ [复制]
【发布时间】：2017-04-28 04:21:14
【问题描述】：

目前，我正在学习 TypeScript。我对关键字函数和=>（胖箭头）之间的区别感到很困惑。请看下面的代码：

interface Counter {
    (start: number);
    interval: number;
    reset() : void;
}

let a = <Counter>function(start: number) { };
let b = <Counter>(start: number) => { };

a.reset(); //OK
b.reset(); //error: Property 'reset' does not exist on type <Counter>(start: number) => void

看来胖箭头和关键字函数的作用不一样。

【问题讨论】：

这与 TypeScript 无关。这纯粹是一个 JS (ES6) 问题。 SO 上的数百篇博文、文档页面和问题都很好地解释了这种差异。
@torazaburo 知道了。非常感谢。

标签： javascript typescript ecmascript-6

【解决方案1】：

与函数表达式相比，胖箭头函数的语法更短，并且在词法上绑定了 this 值。箭头函数始终是匿名的，可以有效地将function (arguments) { return expression; } 转换为(arguments) => expression。如果在箭头后使用表达式，则返回是隐式的，因此不需要返回。

【讨论】：

“胖箭头函数”这个词已经过时了。正确的术语是“箭头函数”。

【解决方案2】：

这一切都是为了在 JavaScript 中保留上下文/范围。看这里：What is this in JavaScript and Typescript。

【讨论】：