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));

用符号(=>)表示的箭头函数可以帮助您创建匿名函数和方法。这将导致更短的语法。例如，下面是一个简单的“Add”函数，它返回两个数字的加法。

function Add(num1 , num2 ){
return num1 + num2;
}

通过使用如下所示的“箭头”语法，上面的函数变得更短。

上述代码有两部分，如上图所示:-

输入:—指定匿名函数的输入参数。

逻辑:-这部分出现在符号“=>”之后。本节符合实际函数的逻辑。

许多开发人员认为箭头函数使您的语法更短，更简单，从而使您的代码可读。

如果你相信上面这句话，那么让我向你保证这是一个神话。如果你想一下，一个正确编写的带有名称的函数比在一行中使用箭头符号创建的神秘函数更具可读性。

箭头函数的主要用途是确保代码运行在 呼叫者上下文。

请参阅下面的代码，其中定义了一个全局变量“context”，该全局变量在函数“SomeOtherMethod”中访问，该函数从其他方法“SomeMethod”中调用。

这个“SomeMethod”具有本地“context”变量。现在因为“SomeOtherMethod”是从“SomeMethod”中调用的，我们期望它显示“本地上下文”，但它显示“全局上下文”。

var context = “global context”;

function SomeOtherMethod(){
alert(this.context);
}

function SomeMethod(){
this.context = “local context”;
SomeOtherMethod();
}

var instance = new SomeMethod();

但是如果使用Arrow函数替换调用，它将显示“本地上下文”。

var context = "global context";
   
    function SomeMethod(){
        this.context = "local context";
        SomeOtherMethod = () => {
            alert(this.context);
        }
        SomeOtherMethod();
    }
    var instance = new SomeMethod();

我鼓励你阅读这个链接(JavaScript中的箭头函数)，它解释了JavaScript上下文的所有场景，以及在哪些场景中调用者上下文不受尊重。

你也可以在我制作的youtube视频中看到用javascript演示的箭头函数，它实际上演示了上下文这个术语。

对其他答案不满意。截至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)的快捷方式

正如所有其他答案已经说过的，它是ES2015箭头函数语法的一部分。更具体地说，它不是一个操作符，而是一个标点符号，将参数与正文分隔开来。例如(params) => {/* body */}。

正如其他人所说，这是一种创建函数的新语法。

但这类函数与普通函数不同:

They bind the this value. As explained by the spec, An ArrowFunction does not define local bindings for arguments, super, this, or new.target. Any reference to arguments, super, this, or new.target within an ArrowFunction must resolve to a binding in a lexically enclosing environment. Typically this will be the Function Environment of an immediately enclosing function. Even though an ArrowFunction may contain references to super, the function object created in step 4 is not made into a method by performing MakeMethod. An ArrowFunction that references super is always contained within a non-ArrowFunction and the necessary state to implement super is accessible via the scope that is captured by the function object of the ArrowFunction. They are non-constructors. That means they have no [[Construct]] internal method, and thus can't be instantiated, e.g. var f = a => a; f(123); // 123 new f(); // TypeError: f is not a constructor

使用Arrowfunction添加简单的CRUD示例

 //Arrow Function
 var customers   = [
   {
     name: 'Dave',
     contact:'9192631770'
   },
   {
     name: 'Sarah',
     contact:'9192631770'
   },
   {
     name: 'Akhil',
     contact:'9928462656' 
   }],

// No Param READ
 getFirstCustomer = () => { 
   console.log(this);
   return customers[0];
 };
  console.log("First Customer "+JSON.stringify(getFirstCustomer())); // 'Dave' 

   //1 Param SEARCH
  getNthCustomer = index=>{
    if( index>customers.length)
    {
     return  "No such thing";
   }
   else{
       return customers[index];
     } 
  };
  console.log("Nth Customer is " +JSON.stringify(getNthCustomer(1))); 

   //2params ADD
  addCustomer = (name, contact)=> customers.push({
     'name': name,
     'contact':contact
    });
  addCustomer('Hitesh','8888813275');
  console.log("Added Customer "+JSON.stringify(customers)); 

  //2 param UPDATE
  updateCustomerName = (index, newName)=>{customers[index].name= newName};
  updateCustomerName(customers.length-1,"HiteshSahu");
  console.log("Updated Customer "+JSON.stringify(customers));

  //1 param DELETE
  removeCustomer = (customerToRemove) => customers.pop(customerToRemove);
  removeCustomer(getFirstCustomer());
  console.log("Removed Customer "+JSON.stringify(customers));