本文翻译自:What's the meaning of “=>” (an arrow formed from equals & greater than) in JavaScript?

I know that the >= operator means more than or equal to, but I've seen => in some source code. 我知道>=运算符的含义是大于或等于,但我在某些源代码中已经看到=> What's the meaning of that operator? 该运算符是什么意思?

Here's the code: 这是代码:

promiseTargetFile(fpParams, aSkipPrompt, relatedURI).then(aDialogAccepted => {if (!aDialogAccepted)return;saveAsType = fpParams.saveAsType;file = fpParams.file;continueSave();
}).then(null, Components.utils.reportError);

#1楼

参考:https://stackoom.com/question/1gTr1/JavaScript中-gt-等于或大于的箭头-的含义是什么


#2楼

This would be the "arrow function expression" introduced in ECMAScript 6. 这将是ECMAScript 6中引入的“箭头函数表达式”。

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/arrow_functions https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/arrow_functions

For historical purposes (if the wiki page changes later), it is: 出于历史目的(如果Wiki页面稍后更改),则为:

An arrow function expression has a shorter syntax compared to function expressions and lexically binds the this value. 箭头函数表达式的语法比函数表达式短,并且在词法上绑定了此值。 Arrow functions are always anonymous. 箭头函数始终是匿名的。


#3楼

What It Is 这是什么

This is an arrow function. 这是一个箭头功能。 Arrow functions are a short syntax, introduced by ECMAscript 6, that can be used similarly to the way you would use function expressions. 箭头函数是ECMAscript 6引入的一种短语法,可以与使用函数表达式的方式类似地使用。 In other words, you can often use them in place of expressions like function (foo) {...} . 换句话说,您经常可以使用它们代替诸如function (foo) {...}类的表达式。 But they have some important differences. 但是它们有一些重要的区别。 For example, they do not bind their own values of this (see below for discussion). 例如,它们不与他们的自身价值this (见下面的讨论)。

Arrow functions are part of the ECMAscript 6 specification. 箭头功能是ECMAscript 6规范的一部分。 They are not yet supported in all browsers, but they are partially or fully supported in Node v. 4.0+ and in most modern browsers in use as of 2018. (I've included a partial list of supporting browsers below). 并非所有浏览器都支持它们,但是在Node v.4.0 +和截至2018年使用的大多数现代浏览器中都部分或完全支持它们。(我在下面提供了部分支持的浏览器列表)。

You can read more in the Mozilla documentation on arrow functions . 您可以在Mozilla文档的箭头功能中内容 。

From the Mozilla documentation: 从Mozilla文档中:

An arrow function expression (also known as fat arrow function) has a shorter syntax compared to function expressions and lexically binds the this value (does not bind its own this , arguments , super , or new.target ). 相比箭头函数表达式(也称为脂肪箭头功能)具有更短的语法函数表达式和词法结合this值(不结合其自身的thisargumentssupernew.target )。 Arrow functions are always anonymous. 箭头函数始终是匿名的。 These function expressions are best suited for non-method functions and they can not be used as constructors. 这些函数表达式最适合于非方法函数,因此不能用作构造函数。

A Note on How this Works in Arrow Functions 关于如何注意this在箭厂的功能

One of the most handy features of an arrow function is buried in the text above: 上面的文本中隐藏了箭头功能最方便的功能之一:

An arrow function... lexically binds the this value (does not bind its own this ...) 箭头函数...按词法绑定this值(不绑定自身的this ...)

What this means in simpler terms is that the arrow function retains the this value from its context and does not have its own this . 用简单的术语来说,这意味着arrow函数从其上下文保留了this值,而没有自己的this A traditional function may bind its own this value, depending on how it is defined and called. 传统函数可以根据其定义和调用方式绑定自己的this值。 This can require lots of gymnastics like self = this; 这可能需要很多体操,例如self = this; , etc., to access or manipulate this from one function inside another function. 等,以从另一个功能中的一个功能访问或操作this功能。 For more info on this topic, see the explanation and examples in the Mozilla documentation . 有关此主题的更多信息,请参见Mozilla文档中的解释和示例 。

Example Code 范例程式码

Example (also from the docs): 示例(同样来自文档):

var a = ["We're up all night 'til the sun","We're up all night to get some","We're up all night for good fun","We're up all night to get lucky"
];// These two assignments are equivalent:// Old-school:
var a2 = a.map(function(s){ return s.length });// ECMAscript 6 using arrow functions
var a3 = a.map( s => s.length );// both a2 and a3 will be equal to [31, 30, 31, 31]

Notes on Compatibility 兼容性说明

You can use arrow functions in Node, but browser support is spotty. 您可以在Node中使用箭头功能,但浏览器支持不一。

Browser support for this functionality has improved quite a bit, but it still is not widespread enough for most browser-based usages. 浏览器对此功能的支持已经改善了很多,但是对于大多数基于浏览器的用法来说,它仍然不够广泛。 As of December 12, 2017, it is supported in current versions of: 自2017年12月12日起,当前版本的软件支持:

  • Chrome (v. 45+) Chrome(v。45+)
  • Firefox (v. 22+) Firefox(22岁以上版本)
  • Edge (v. 12+) 边缘(v。12+)
  • Opera (v. 32+) 歌剧(v。32+)
  • Android Browser (v. 47+) Android浏览器(v。47+)
  • Opera Mobile (v. 33+) Opera Mobile(v。33+)
  • Chrome for Android (v. 47+) Chrome for Android(v。47+)
  • Firefox for Android (v. 44+) 适用于Android的Firefox(版本44或更高)
  • Safari (v. 10+) Safari(10岁以上)
  • iOS Safari (v. 10.2+) iOS Safari(10.2以上版本)
  • Samsung Internet (v. 5+) 三星互联网(v。5+)
  • Baidu Browser (v. 7.12+) 百度浏览器(7.12+)

Not supported in: 不支持:

  • IE (through v. 11) IE(通过第11版)
  • Opera Mini (through v. 8.0) Opera Mini(通过8.0版)
  • Blackberry Browser (through v. 10) 黑莓浏览器(通过第10版)
  • IE Mobile (through v. 11) IE Mobile(通过v。11)
  • UC Browser for Android (through v. 11.4) 适用于Android的UC浏览器(通过11.4版)
  • QQ (through v. 1.2) QQ(通过1.2版)

You can find more (and more current) information at CanIUse.com (no affiliation). 您可以在CanIUse.com上找到更多(和更多最新信息)(无隶属关系)。


#4楼

I've read, this is a symbol of Arrow Functions in ES6 我读过,这是ES6Arrow Functions的象征

this 这个

var a2 = a.map(function(s){ return s.length });

using Arrow Function can be written as 使用Arrow Function可以写成

var a3 = a.map( s => s.length );

MDN Docs MDN文件


#5楼

That's known as an Arrow Function, part of the ECMAScript 2015 spec ... 这被称为箭头功能,是ECMAScript 2015规范的一部分 ...

 var foo = ['a', 'ab', 'abc']; var bar = foo.map(f => f.length); console.log(bar); // 1,2,3 

Shorter syntax than the previous: 语法比以前短:

 // < ES6: var foo = ['a', 'ab', 'abc']; var bar = foo.map(function(f) { return f.length; }); console.log(bar); // 1,2,3 

DEMO 演示

The other awesome thing is lexical this ... Usually, you'd do something like: 其他真棒事情是词汇 this ......通常情况下,你会做这样的事情:

 function Foo() { this.name = name; this.count = 0; this.startCounting(); } Foo.prototype.startCounting = function() { var self = this; setInterval(function() { // this is the Window, not Foo {}, as you might expect console.log(this); // [object Window] // that's why we reassign this to self before setInterval() console.log(self.count); self.count++; }, 1000) } new Foo(); 

But that could be rewritten with the arrow like this: 但这可以用如下箭头重写:

 function Foo() { this.name = name; this.count = 0; this.startCounting(); } Foo.prototype.startCounting = function() { setInterval(() => { console.log(this); // [object Object] console.log(this.count); // 1, 2, 3 this.count++; }, 1000) } new Foo(); 

DEMO 演示

MDN MDN
More on Syntax 有关语法的更多信息

For more, here's a pretty good answer for when to use arrow functions. 有关更多信息, 这是 何时使用箭头功能的一个很好的答案。


#6楼

just to add another example of what a lambda can do without using map: 只是要添加另一个示例,说明lambda无需使用地图即可执行的操作:

a = 10
b = 2var mixed = (a,b) => a * b;
// OR
var mixed = (a,b) => { (any logic); return a * b };console.log(mixed(a,b))
// 20

JavaScript中“ =gt;”(等于或大于的箭头)的含义是什么?相关推荐

  1. Javascript中!!(两个感叹号,双感叹号)的含义

    使用Javascript时,有时会在变量前面加上两个感叹号,这样做表示什么含义呢?Javascript中,!表示运算符"非",如果变量不是布尔类型,会将变量自动转化为布尔类型,再取 ...

  2. Javascript中不等于的代码是什么

    != !== 前面不考虑类型,后者要求比较对象是相同类型且值一样

  3. 深入浅出 JavaScript 中的 this

    为什么80%的码农都做不了架构师?>>>    在 Java 等面向对象的语言中,this 关键字的含义是明确且具体的,即指代当前对象.一般在编译期确定下来,或称为编译期绑定.而在 ...

  4. 如何解决JavaScript中0.1+0.2不等于0.3

    原文转载自:https://www.cnblogs.com/weshare/archive/2018/02/20/8455470.html >console.log(0.1+0.2===0.3) ...

  5. js中当等于最小值是让代码不执行_28 个JavaScript编程黑科技,装逼指南,高逼格代码,让你惊叹不已...

    Javascript 是一门很厉害的语言,我可能学了假的 JavaScript,哈哈,大家还有什么推荐的,欢迎补充. 1.单行写一个评级组件 "★★★★★☆☆☆☆☆".slice( ...

  6. jQuery中过滤选择器的eq,ne等于gt大于lt小于

    eq 等于 gt大于 lt小于 用法: <!DOCTYPE html> <html lang="en"> <head><meta char ...

  7. linux if else 格式,linux shell中 if else以及大于、小于、等于逻辑表达式

    在linux shell编程中,大多数情况下,可以使用测试命令来对条件进行测试,这里简单的介绍下,方便需要的朋友 比如比较字符串.判断文件是否存在及是否可读等,通常用"[]"来表示 ...

  8. [译]JavaScript中,{}+{}等于多少?

    最近,Gary Bernhardt在一个简短的演讲视频"Wat"中指出了一个有趣的JavaScript怪癖:在把对象和数组混合相加时,会得到一些你意想不到的结果.本篇文章会依次讲解 ...

  9. lua 从一串数字中取出偶数位的数字_为什么JavaScript中 0.1 0.2 不等于0.3?

    在 js 中进行数学的运算时,会出现0.1+0.2=0.300000000000000004的结果,一开始认为是浮点数的二进制存储导致的精度问题,但这似乎不能很好的解释为什么在同样的存储方式下0.3+ ...

最新文章

  1. 纯CSS3进行hover时显示带箭头和动画的tips效果
  2. react 之 setState
  3. ​Java 中的内存溢出和内存泄露是什么?我给你举个有味道的例子​
  4. 在linux下安装配置DNS服务器
  5. Linux常用命令笔记---故障排除
  6. java委托机制教程_通过反射实现Java下的委托机制代码详解
  7. 学生管理系统stuSystem函数
  8. Sublime与远程服务器代码同步工具SFTP
  9. Python类的魔法方法
  10. php gif 切成一帧,GIF动画帧提取器 如何截取gif的每一帧图片
  11. 【2012百度之星资格赛】J:百度的新大厦
  12. MAC 打开safari和Chrome打开开发者工具的快捷键
  13. 【吐血经验】在 windows 上安装 spark 遇到的一些坑 | 避坑指南
  14. linux中的root命令,在linux终端中执行root命令
  15. 拓端tecdat|在R语言中用模拟探索回归的P值
  16. 如何增强台式计算机无线网络,台式机无线网信号差怎么解决
  17. SICP第一章:构造过程抽象(1.1)
  18. 前端加速必备之BootCDN
  19. 基于STM32_HAL库GY-30(BH1750FLV)驱动
  20. linux虚拟机之ubuntu的软件包管理(6/10)

热门文章

  1. Android开发之GridView的使用(解读谷歌官方API)
  2. quake3使用指南(转载)
  3. Android Stadio调试gradle 插件 || Android Stadio 远程调试 || Anroid APT调试
  4. 【Java源码分析】HashTable源码分析
  5. Android获取挂载U盘的属性
  6. getDimension/getDimensionPixelSize/getDimensionPixelOffset()
  7. 第八周项目四-角色有多样武器
  8. 使用Android Studio新建Project并建立多个module
  9. 深入浅出Android系统启动流程
  10. python软件在下载库文件_python – 并行下载多个文件的库或工具