TypeScript中"=>"的含义是什么？(胖箭)

Question

我刚开始学习TypeScript,我看到有很多代码使用这个sytax =>.我通过阅读TypeScript版本1.6规范和一些谷歌搜索做了一些研究.我还是无法理解其含义=>.
对我来说,感觉就像是C++中的指针.但我无法确认.如果有人可以解释以下示例,那将是很好的.谢谢!

以下是我在阅读Typescript规范时发现的示例:

对象类型

var MakePoint: () => {  
    x: number; y: number;  
};

问题:这段代码在做什么？创建一个名为MakePoint的对象,其中x和y字段是数字类型？这是MakePoint的构造函数还是函数？

功能类型

function vote(candidate: string, callback: (result: string) => any) {  
 // ...  
}

问:这是什么意思=> any？你必须返回一个字符串类型？

有人能用简单的英语向我解释这些例子的区别或目的吗？感谢您的时间!

Answer 1

也许您将类型信息与函数声明混淆.如果您编译以下内容:

var MakePoint: () => {x: number; y: number;};

你会看到它产生:

var MakePoint;

在TypeScript中,:在=(赋值)之后但是之前的所有内容都是类型信息.所以你的例子是说MakePoint的类型是一个函数,它接受0个参数并返回一个具有两个属性的对象,x以及y两个数字.它没有为该变量分配函数.相比之下,编译:

var MakePoint = () => 1;

生产:

var MakePoint = function () { return 1; };

请注意,在这种情况下,=>胖箭头位于赋值运算符之后.

Answer 2

在类型位置,=>定义一个函数类型,其中参数位于左侧,=>返回类型位于右侧.所以callback: (result: string) => any意味着" callback是一个类型是函数的参数.该函数接受一个名为resulttype的参数string,函数的返回值是类型any".

对于表达式级别的构造,请参阅JavaScript中"=>"(由等于和大于等形成的箭头)的含义是什么？

Answer 3

var MakePoint: () => {  
    x: number; y: number;  
};

MakePoint是一个变量.它的类型是一个不带参数并产生数字x和y的函数.现在箭头有意义吗？

Answer 4

作为一个聪明人曾经说过"我讨厌JavaScript,因为它很容易失去这个意思".

它被称为胖箭(因为它->是一个细箭头,=>是一个胖箭头),也称为lambda函数(因为其他语言).另一个常用功能是胖箭头功能()=>something.胖箭的动机是:

1. 您不需要继续输入function.
2. 它在词汇上捕捉到了它的含义this.
3. 它在词汇上捕捉到了它的含义 arguments

function Person(age) {
this.age = age;
this.growOld = function() {
    this.age++;
  }
}

var person = new Person(1);
setTimeout(person.growOld,1000);

setTimeout(function() { console.log(person.age); },2000); // 1, should have been 2

如果你在浏览器中运行这个代码,那么函数中的这个代码将指向window,因为window将执行growOld函数.修复是使用箭头功能:

function Person(age) {
this.age = age;
this.growOld = () => {
    this.age++;
  }
}
var person = new Person(1);
setTimeout(person.growOld,1000);

setTimeout(function() { console.log(person.age); },2000);// 2

Answer 5

它被称为"胖箭".它被添加到EcmaScript6中并替换了function关键字等.

更多内容可以在这里阅读.