我知道>=运算符意味着大于或等于，但我在一些源代码中看到过=>。这个运算符是什么意思?
代码如下:
promiseTargetFile(fpParams, aSkipPrompt, relatedURI).then(aDialogAccepted => {
if (!aDialogAccepted)
return;
saveAsType = fpParams.saveAsType;
file = fpParams.file;
continueSave();
}).then(null, Components.utils.reportError);
当前回答
对其他答案不满意。截至2019/3/13投票最多的答案实际上是错误的。
简单来说，=>的意思是，它是一个编写函数AND的快捷方式，用于将它绑定到当前的this
const foo = a => a * 2;
是有效的捷径吗
const foo = function(a) { return a * 2; }.bind(this);
你可以看到所有被缩短的地方。我们不需要function、return、.bind(this)，甚至不需要大括号或圆括号
箭头函数的一个稍微长一点的例子是
const foo = (width, height) => {
const area = width * height;
return area;
};
如果我们想要函数的多个参数，我们需要圆括号，如果我们想要写多个表达式，我们需要大括号和显式返回。
理解.bind部分很重要，这是一个很大的主题。这与JavaScript中的含义有关。
所有函数都有一个隐式形参this。在调用函数时如何设置此值取决于该函数的调用方式。
Take
function foo() { console.log(this); }
如果正常的话
function foo() { console.log(this); }
foo();
这将是全局对象。
如果你处于严格模式
`use strict`;
function foo() { console.log(this); }
foo();
// or
function foo() {
`use strict`;
console.log(this);
}
foo();
它是没有定义的
你可以直接使用call或apply来设置
function foo(msg) { console.log(msg, this); }
const obj1 = {abc: 123}
const obj2 = {def: 456}
foo.call(obj1, 'hello'); // prints Hello {abc: 123}
foo.apply(obj2, ['hi']); // prints Hi {def: 456}
您还可以使用点操作符隐式地设置此值。
function foo(msg) { console.log(msg, this); }
const obj = {
abc: 123,
bar: foo,
}
obj.bar('Hola'); // prints Hola {abc:123, bar: f}
当您想要使用函数作为回调或监听器时，就会出现一个问题。创建类并想将一个函数赋值为访问该类实例的回调函数。
class ShowName {
constructor(name, elem) {
this.name = name;
elem.addEventListener('click', function() {
console.log(this.name); // won't work
});
}
}
上面的代码将无法工作，因为当元素触发事件并调用函数时，this值将不是类的实例。
解决这个问题的一种常用方法是使用.bind
class ShowName {
constructor(name, elem) {
this.name = name;
elem.addEventListener('click', function() {
console.log(this.name);
}.bind(this); // <=========== ADDED! ===========
}
}
因为箭头语法和我们写的是一样的
class ShowName {
constructor(name, elem) {
this.name = name;
elem.addEventListener('click',() => {
console.log(this.name);
});
}
}
Bind有效地创建了一个新函数。如果bind不存在，你基本上可以像这样创建自己的
function bind(functionToBind, valueToUseForThis) {
return function(...args) {
functionToBind.call(valueToUseForThis, ...args);
};
}
在没有展开运算符的旧JavaScript中，它是
function bind(functionToBind, valueToUseForThis) {
return function() {
functionToBind.apply(valueToUseForThis, arguments);
};
}
理解这些代码需要理解闭包，但简单来说，bind创建了一个新函数，它总是调用带有绑定到它的this值的原始函数。箭头函数做同样的事情，因为它们是bind(this)的快捷方式
其他回答
这些是箭头函数
也称为胖箭头函数。它们是一种简洁明了的方法来编写函数表达式，例如function(){}。
箭头函数可以在定义函数时去掉function、return和{}。它们是一行程序，类似于Java或Python中的Lambda表达式。
不带参数的示例
const queue = ['Dave'， 'Sarah'， 'Sharon']; const nextCustomer = () => queue[0] console.log (nextCustomer ());/ /“大卫”
如果需要在同一个箭头函数中执行多条语句，那么在本例中，您需要将队列[0]封装在尖括号{}中。在这种情况下，return语句不能省略。
带有1个参数的示例
const queue = ['Dave'， 'Sarah'， 'Sharon']; const addCustomer = name => { queue.push(名称); }; addCustomer(“托比”); console.log(队列);// ['Dave'， 'Sarah'， 'Sharon'， 'Toby']
你可以从上面省略{}。
当只有一个参数时，参数周围的括号()可以省略。
带有多个参数的示例
const addNumbers = (x, y) => x + y console.log (addNumbers(1、5));/ / 6
一个有用的例子
const fruits = [
{ name: 'Apple', price: 2 },
{ name: 'Bananna', price: 3 },
{ name: 'Pear', price: 1 }
];
如果我们想在一个数组中获取每个水果的价格，在ES5中我们可以这样做:
fruits.map(function(fruit) {
return fruit.price;
}); // [2, 3, 1]
在ES6的新箭头函数中，我们可以让它更简洁:
fruits.map(fruit => fruit.price); // [2, 3, 1]
关于箭头函数的更多信息可以在这里找到。
JavaScript箭头函数大致相当于python中的lambda函数或Ruby中的块。这些是具有自己特殊语法的匿名函数，并在其封闭作用域的上下文中操作。这意味着它们没有自己的“This”，而是从直接的封闭函数中访问one。
来自ECMA标准:
ArrowFunction不为参数定义本地绑定， 超级，这个，或者新的目标。任何对参数、super、this或new的引用。ArrowFunction中的target必须解析为 在词汇封闭的环境中绑定。通常这将是 直接封闭函数的函数环境。
通常你会读成“箭头函数表达式是传统函数表达式的紧凑替代”，这是不正确的。箭头函数不是传统函数的简写，它们的行为与传统函数不同。
语法
// Traditional Function
// Create their own scope inside the function
function (a){
return a + 100;
}
// Arrow Function
// Do NOT create their own scope
// (Each step along the way is a valid "arrow function")
// 1. Remove the word "function" and place arrow between the argument and opening body bracket
(a) => {
return a + 100;
}
// 2. Remove the body braces and word "return" -- the return is implied.
(a) => a + 100;
// 3. Remove the argument parentheses (only valid with exactly one argument)
a => a + 100;
对其他答案不满意。截至2019/3/13投票最多的答案实际上是错误的。
简单来说，=>的意思是，它是一个编写函数AND的快捷方式，用于将它绑定到当前的this
const foo = a => a * 2;
是有效的捷径吗
const foo = function(a) { return a * 2; }.bind(this);
你可以看到所有被缩短的地方。我们不需要function、return、.bind(this)，甚至不需要大括号或圆括号
箭头函数的一个稍微长一点的例子是
const foo = (width, height) => {
const area = width * height;
return area;
};
如果我们想要函数的多个参数，我们需要圆括号，如果我们想要写多个表达式，我们需要大括号和显式返回。
理解.bind部分很重要，这是一个很大的主题。这与JavaScript中的含义有关。
所有函数都有一个隐式形参this。在调用函数时如何设置此值取决于该函数的调用方式。
Take
function foo() { console.log(this); }
如果正常的话
function foo() { console.log(this); }
foo();
这将是全局对象。
如果你处于严格模式
`use strict`;
function foo() { console.log(this); }
foo();
// or
function foo() {
`use strict`;
console.log(this);
}
foo();
它是没有定义的
你可以直接使用call或apply来设置
function foo(msg) { console.log(msg, this); }
const obj1 = {abc: 123}
const obj2 = {def: 456}
foo.call(obj1, 'hello'); // prints Hello {abc: 123}
foo.apply(obj2, ['hi']); // prints Hi {def: 456}
您还可以使用点操作符隐式地设置此值。
function foo(msg) { console.log(msg, this); }
const obj = {
abc: 123,
bar: foo,
}
obj.bar('Hola'); // prints Hola {abc:123, bar: f}
当您想要使用函数作为回调或监听器时，就会出现一个问题。创建类并想将一个函数赋值为访问该类实例的回调函数。
class ShowName {
constructor(name, elem) {
this.name = name;
elem.addEventListener('click', function() {
console.log(this.name); // won't work
});
}
}
上面的代码将无法工作，因为当元素触发事件并调用函数时，this值将不是类的实例。
解决这个问题的一种常用方法是使用.bind
class ShowName {
constructor(name, elem) {
this.name = name;
elem.addEventListener('click', function() {
console.log(this.name);
}.bind(this); // <=========== ADDED! ===========
}
}
因为箭头语法和我们写的是一样的
class ShowName {
constructor(name, elem) {
this.name = name;
elem.addEventListener('click',() => {
console.log(this.name);
});
}
}
Bind有效地创建了一个新函数。如果bind不存在，你基本上可以像这样创建自己的
function bind(functionToBind, valueToUseForThis) {
return function(...args) {
functionToBind.call(valueToUseForThis, ...args);
};
}
在没有展开运算符的旧JavaScript中，它是
function bind(functionToBind, valueToUseForThis) {
return function() {
functionToBind.apply(valueToUseForThis, arguments);
};
}
理解这些代码需要理解闭包，但简单来说，bind创建了一个新函数，它总是调用带有绑定到它的this值的原始函数。箭头函数做同样的事情，因为它们是bind(this)的快捷方式
这被称为箭头函数，是ECMAScript 2015规范的一部分…
Var foo = ['a'， 'ab'， 'abc']; Var bar = foo。Map (f => f.length); console.log(栏);/ / 1、2、3
比前面的语法更短:
// < es6: Var foo = ['a'， 'ab'， 'abc']; Var bar = foo.map(函数(f) { 返回f.length; })； console.log(栏);/ / 1、2、3
DEMO
另一件很棒的事情是词汇上的。通常，你会这样做:
函数Foo() { This.name = name; 这一点。计数= 0; this.startCounting (); ｝ Foo.prototype.startCounting = function() { Var self = this; setInterval(函数(){ //这是窗口，而不是Foo{}，因为你可能期望 console.log(这个);//[对象窗口] //这就是为什么我们在setInterval()之前重新分配给self console.log (self.count); self.count + +; }, 1000) ｝ 新Foo ();
但可以用箭头这样重写:
函数Foo() { This.name = name; 这一点。计数= 0; this.startCounting (); ｝ Foo.prototype.startCounting = function() { setInterval(() => { console.log(这个);// [object对象] console.log (this.count);// 1, 2, 3 this.count + +; }, 1000) ｝ 新Foo ();
DEMO
中数 更多关于语法
这里有一个关于何时使用箭头函数的很好的答案。
ES6 Arrow功能:
在javascript中=>是箭头函数表达式的符号。箭头函数表达式没有自己的this绑定，因此不能用作构造函数。例如:
Var单词= 'hi从外部对象'; 让obj = { Words: 'hi from inside object'， Talk1:() => {console.log(this.words)}， Talk2: function () {console.log(this.words)} ｝ obj.talk1 ();//没有它自己的this绑定，this ===窗口 obj.talk2 ();//有它自己的this绑定，这是obj
箭头函数的使用规则:
如果只有一个参数，可以省略参数的括号。 如果你在同一行返回一个表达式，你可以省略{}和return语句
例如:
val * 2; //它在同一行，返回一个表达式，因此省略{}，表达式隐式返回 //也只有一个参数，因此参数周围的括号被省略 console.log (times2 (3));
