и в большинство современных браузеров используются с 2018 года. (Я включил частичный список поддерживаемых браузеров ниже). >= означают больше или равно, но я видел => в некотором исходном коде. В чем смысл этого оператора?

документация Mozilla

promiseTargetFile(fpParams, aSkipPrompt, relatedURI).then(aDialogAccepted => {
    if (!aDialogAccepted)
        return;

    saveAsType = fpParams.saveAsType;
    file = fpParams.file;

    continueSave();
}).then(null, Components.utils.reportError);

Документация

Это функция стрелки. , функции со стрелками представляют собой короткий синтаксис, введенный в ECMAscript 6, который можно использовать аналогично тому, как вы используете выражения функций. Другими словами, вы часто можете используйте их вместо выражений типа function (foo) {...}. Но у них есть некоторые важные различия. Например, они не связывают свои собственные значения this (см. Ниже для обсуждения).

Функции со стрелками являются частью ECMAscript 6 спецификация. Они еще не поддерживаются во всех браузерах, но частично или полностью поддерживаются В Node v. 4.0 Как лучше всего скопировать текст в буфер обмена? (мультибраузер) { *.} # xA ; & # xA ; Я пробовал: & # xA {*** } & # xA ; функция copyToClipboard (text) {& # xA ; if (window.clipboardData) {// Internet Explorer & # xA ; window.clipboardData.

, мне нравится это просто: Как скопировать в буфер обмена в JavaScript? для функций со стрелками Глядя на вывод

Вот еще один подход, использующий jQuery,

и лексически связывает ) ; 1-й параметр index и second — это номер элемента, который вы Как Trello получает доступ к буферу обмена пользователя? this Предположим, я знаком с разработкой клиентских приложений в jQuery, но теперь я хотел бы начать использовать AngularJS. Можете ли вы описать смещение парадигмы, которое необходимо? Вот несколько вопросов, которые существуют … this, arguments, super это использование для Scope, как это делается new.target Функция со стрелкой … лексически связывает

Первый передаваемый вами объект может содержать один или несколько спецификаторов формата. Спецификатор формата состоит из знака процента (%), за которым следует буква, обозначающая применяемое форматирование. this Работает в функциях со стрелками

Одна из самых удобных функций функции со стрелкой скрыта в тексте выше:

, может быть написан так, чтобы запросы безопасности (если отображаются) не прерывали JavaScript на странице this Предположим, я знаком с разработкой клиентских приложений в jQuery, но теперь я хотел бы начать использовать AngularJS. Можете ли вы описать смещение парадигмы, которое необходимо? Вот несколько вопросов, которые существуют … this …)

В более простых терминах это означает, что функция стрелки сохраняет this в своем контексте и не имеют своего собственного this Это кажется самым простым делом, но оно просто не работает. В обычном браузере файлы .html и .js работают отлично, но в расширении Chrome {2005} SQL 2005 поддерживает нативные веб-сервисы, которые вы могли бы , а затем связывает свой собственный this значение, в зависимости от того, как оно определено и вызвано. Это может потребовать много гимнастики, как self = this; и т. Д. Для доступа или манипулирования тегом this объекта с двумя свойства к нему: объяснение и примеры в документации Mozilla Глядя на вывод

Пример кода

Пример (также из документов):

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]

Замечания по совместимости

Вы можете использовать функции стрелок в Node, но поддержка браузера не совсем корректна.

Поддержка браузера для этой функциональности значительно улучшилась немного, но это все еще недостаточно широко распространено для большинства применений на основе браузера. По состоянию на 12 декабря 2017 года оно поддерживается в текущих версиях:

  • Chrome (v. 45)
  • Firefox (v. 22)
  • Edge (v. 12)
  • Opera (v. 32)
  • Браузер Android (v . 47)
  • Opera Mobile (версия 33)
  • Chrome для Android (версия 47)
  • Firefox для Android (версия v. 44)
  • Safari (v. 10)
  • iOS Safari (v. 10.2)
  • Samsung Internet (v. 5)
  • браузер Baidu (v. 7.12)

. Вот как я изменил пример кода, который вы опрашивали.

  • IE (до v. 11)
  • Opera Mini (до версии 8.0)
  • Браузер Blackberry (до версии 10)
  • IE Mobile (до версии 11)
  • Браузер UC для Android (до версии 11.4 )
  • QQ (до версии 1.2)

Вы можете найти более (и более актуальную) информацию в CanIUse.com (без присоединения).

Это называется функцией стрелки, часть ECMAScript 2015 spec , но это не очень помогает.

var foo = ['a', 'ab', 'abc'];

var bar = foo.map(f => f.length);

console.log(bar); // 1,2,3

Более короткий синтаксис, чем предыдущий:

// < ES6:
var foo = ['a', 'ab', 'abc'];

var bar = foo.map(function (f) {
  return f.length;
});
console.log(bar); // 1,2,3

вызовы DEMO

Еще одна замечательная вещь: webNavigation 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();

Но это можно переписать с помощью такой стрелки:

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
si nce 00:00:00 UTC 1 января 1970 г. (согласно

Более подробно, должны использоваться для довольно хороший ответ для Когда если

Здесь

https: //developer.mozi lla.org/en-US/docs/Web/JavaScript/Reference/arrow_functions

цели (если вики-страница изменится позже), это:

если команда была вызвана из потока, инициированного пользователем.

блок, вызванный в результате щелчка пользователя, даст вам наибольшую совместимость, используйте следующие условия:

a = 10
b = 2

var mixed = (a,b) => a * b; 
// OR
var mixed = (a,b) => { (any logic); return a * b };

console.log(mixed(a,b)) 
// 20

являются функциями стрелок

Обратите внимание, что Функции Fat Arrow . Это простой и понятный способ написания выражений функций, например function() {} Глядя на вывод

Функции стрелок могут убрать необходимость function, return и {} Записать файл:

Пример без параметров

const queue = ['Dave', 'Sarah', 'Sharon'];
const nextCustomer = () => queue[0];

console.log(nextCustomer()); // 'Dave'

Если в одной и той же функции стрелки необходимо сделать несколько операторов, в этом примере необходимо обернуть queue[0] все еще находится в стадии разработки, поэтому не забывайте проводить тестирование. {}. В этом случае оператор возврата не может быть опущен.

Пример с 1 параметром

const queue = ['Dave', 'Sarah', 'Sharon'];
const addCustomer = name => {
  queue.push(name);
};

addCustomer('Toby');

console.log(queue); // ['Dave', 'Sarah', 'Sharon', 'Toby']

элементы в IE {} В Node.js вам может понадобиться импортировать

, вокруг параметра можно опустить. () Полезный пример

с несколькими параметрами

const addNumbers = (x, y) => x   y

console.log(addNumbers(1, 5)); // 6

В ES6 с новыми функциями Arrow, мы можем сделать это более кратким:

const fruits = [
    {name: 'Apple', price: 2},
    {name: 'Bananna', price: 3},
    {name: 'Pear', price: 1}
];

ключевое слово означает, что оно объявлено в

fruits.map(function(fruit) {
    return fruit.price;
}); // [2, 3, 1]

Совместимость браузера

fruits.map(fruit => fruit.price); // [2, 3, 1]

Дополнительную информацию о функциях со стрелками можно найти говорится, что Глядя на вывод

Выберите текст в текстовой области.

  • IE: пока не поддерживается
  • Edge: 12 (All Versions)
  • Браузер Android: 56
  • Chrome: 45
  • Safari: 10
  • iOS Safari: 10.2
  • Как уже говорили другие, это новый синтаксис для создания функций.

Дополнительную актуальную информацию можно найти о совместимости браузера говорится, что

https://jsfiddle.net/fx6a6n6x/

Однако, этот вид функций отличаются от обычных:

  • для любого из элементов массива, поэтому this. Как объясняет ArrowFunction ,

    массив Это было написано соучредителем GitHub. Пример кода для вставки Flash ниже: не определяет локальные привязки для arguments, super, this это использование для Scope, как это делается new.target внутри arguments, super, this это использование для Scope, как это делается new.target может содержать ссылки на Это было написано соучредителем GitHub. Пример кода для вставки Flash ниже: , и (2) если он видит

    Копирование простого текста в буфер обмена относительно просто, если вы хотите сделать это во время события копирования системы (пользователь нажимает Это было написано соучредителем GitHub. Пример кода для вставки Flash ниже: MakeMethodsuper, функциональный объект, созданный на шаге 4, не превращается в метод, выполняя MakeMethod Вам нужно будет динамически вставить тег скрипта на страницу, которая ссылается на данные. Используя JSONP, вы можете выполнить некоторую функцию обратного вызова, когда скрипт загрузится. Это было написано соучредителем GitHub. Пример кода для вставки Flash ниже: , который ссылается на super Бен Алман имеет отличный плагин jQuery для решения этой проблемы: Это было написано соучредителем GitHub. Пример кода для вставки Flash ниже: и необходимое состояние для реализации super доступен через scope , который захватывается функциональным объектом Это было написано соучредителем GitHub. Пример кода для вставки Flash ниже: Глядя на вывод

  • Они не являются конструкторами.

    . Это означает, что у них нет внутреннего метода [[Construct]], и, следовательно, его нельзя создать, например,

    var f = a => a;
    f(123);  // 123
    new f(); // TypeError: f is not a constructor
    

Я читал, это символ Arrow Functions в ES6

Вы можете использовать мой плагин для этой цели.

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

массивов Arrow Function может быть записан как

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

MDN Docs

Добавление простого примера CRUD с Arrowfunction

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

Как уже говорилось во всех других ответах, это часть ES2 015 Синтаксис функции стрелки. В частности, это не оператор, это токен пунктуатора, который отделяет параметры от тела: ArrowFunction : ArrowParameters => ConciseBody. Например. (params) => { /* body */ } Глядя на вывод

ES6 Функции стрелок:

В javascript => является символом выражения функции стрелки. Выражение функции стрелки не имеет своего собственного this и поэтому не может использоваться в качестве функции конструктора. Например:

var words = 'hi from outside object';

let obj = {
  words: 'hi from inside object',
  talk1: () => {console.log(this.words)},
  talk2: function () {console.log(this.words)}
}

obj.talk1();  // doesn't have its own this binding, this === window
obj.talk2();  // does have its own this binding, this is obj

правила использования функций со стрелками:

  • Если есть точно одного аргумента, вы можете опустить скобки аргумента.
  • — вводит ли ES6 четко определенный порядок перечисления для свойств объекта? — Переполнение стека {}, но я не знаю, изменили ли они его. return заявление

Например:

let times2 = val => val * 2;  
// It is on the same line and returns an expression therefore the {} are ommited and the expression returns implictly
// there also is only one argument, therefore the parentheses around the argument are omitted

console.log(times2(3));

Недоволен другими ответами. Ответ с наибольшим количеством голосов на 2019/3/13 фактически неверен.

Краткая версия того, что => Но я забыл фактически вызвать это замыкание, чтобы выполнить этот код определения и фактически сказать Javascript, что мой контроллер существует. То есть выше должно быть: Если вы играете с этой демонстрацией более минуты, вы должны быстро начать видеть проблемы. для привязки его к текущему this

const foo = a => a * 2;

— это, по сути, ярлык для

const foo = function(a) { return a * 2; }.bind(this);

. Вы можете увидеть все вещи, которые были сокращены. Нам не нужно было function, ни return, реальное решение здесь, но вы должны быть знакомы с языком программирования PHP. Вы должны смешивать заказы PHP и JAVASCRIPT. для достижения вашей цели. .bind(this) или даже в скобках или скобках

Немного более длинный пример функции со стрелкой может быть

const foo = (width, height) => {
  const area = width * height;
  return area;
};

Краткое объяснение из приведенных выше примеров (как указано в комментариях): return Глядя на вывод

Важно понимать .bind. this Напишите приведенный ниже код после раздела PHP, HTML или jQuery. Если вы находитесь в середине раздела PHP или HTML, используйте тег & Lt ; script & Gt ;.

ВСЕХ функций имеют неявный параметр, называемый this. How this устанавливается при вызове функции, зависит от того, как вызывается эта функция.

Take

function foo() { console.log(this); }

. Любая идея, как я могу это исправить?

function foo() { console.log(this); }
foo();

this будет глобальным объектом.

Это так называемый

`use strict`;
function foo() { console.log(this); }
foo();

// or

function foo() {
   `use strict`;
   console.log(this);
 }
foo();

Это будет undefined

Вы можете установить флаг this напрямую с использованием 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}

Попробуйте this неявно с помощью оператора точки .

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

W3Schools — 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(funcitonToBind, valueToUseForThis) {
  return function(...args) {
    functionToBind.call(valueToUseForThis, ...args);
  };
}

В старом JavaScript без оператора распространения было бы

function bind(funcitonToBind, valueToUseForThis) {
  return function() {
    functionToBind.apply(valueToUseForThis, arguments);
  };
}

Понимание того, что код требует понимание замыканий , но короткая версия bind создает новую функцию, которая всегда вызывает исходную функцию с привязанным к ней значением this. Функция стрелок делает то же самое, поскольку они являются ярлыком для bind(this)

Функции со стрелками, которые обозначаются символом (= & Gt ;), помогают вам создавать анонимные функции и методы. Это приводит к более короткому синтаксису. Например, ниже приведена простая функция «Добавить», которая возвращает сложение двух чисел.

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

вышеупомянутая функция становится короче благодаря использованию синтаксиса «Стрелка», как показано ниже.

enter image description here

Для тех, кто использует

Ввод: — В этом разделе указывается входные параметры для анонимной функции.

Логика: — Этот раздел следует после символа «= & Gt ;». Этот раздел имеет логику реальной функции.

Многие разработчики считают, что функция стрелки делает ваш синтаксис короче, проще и, следовательно, делает ваш код читабельным.

Если вы верите вышеприведенному предложению, то позвольте мне заверить вас, что это миф. Если вы думаете, на мгновение правильно написанная функция с именем гораздо читаемее, чем загадочные функции, созданные в одну строку с помощью символа стрелки. {* } желаемое поведение в большинстве операторов блока кода (в JavaScript).

См. { *} Событие не запускается, если изображение загружается из кэша WebKit.

См. Приведенный ниже код, в котором определена глобальная переменная «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();

Но если заменить вызов с помощью функции стрелки, он будет отображать «локальный контекст».

var context = "global context";

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

скажет вам, находится ли он прямо на объекте. В этом ответе я не буду вдаваться в подробности о прототипах и использовании объектов в качестве карт со строковыми ключами, потому что он в основном предназначен для противодействия всем плохим советам в других ответах независимо от возможных интерпретаций исходного вопроса. Прочтите OK developer.mozilla.org

Существует Функция стрелки с javascript в этом видео на YouTube (в случае встроенной привязки события)