Як записати названу функцію стрілки в ES2015?

У мене є функція, яку я намагаюся перетворити на новий синтаксис стрілки в ES6 . Це названа функція:

function sayHello(name) {
    console.log(name + ' says hello');
}

Чи є спосіб надати ім'я без заяви var:

var sayHello = (name) => {
    console.log(name + ' says hello');
}

Очевидно, я можу використовувати цю функцію лише після того, як я її визначив. Щось таке:

sayHello = (name) => {
        console.log(name + ' says hello');
    }

Чи є новий спосіб зробити це в ES6 ?

Як записати названу функцію стрілки в ES2015?

Ви робите це так, як ви вирішили у своєму запитанні: ви розміщуєте його в правій частині завдання або ініціалізатора властивостей, де змінна або ім'я властивості може розумно використовуватись як ім'я двигуном JavaScript. Немає іншого способу зробити це, але зробити це правильно і повністю охоплено специфікацією.

За специфікацією ця функція має справжнє ім'я sayHello:

var sayHello = name => {
    console.log(name + ' says hello');
};

Це визначено в Операторах присвоєння> Семантика виконання: Оцінка, коли вона викликає абстрактну SetFunctionNameоперацію (цей виклик зараз знаходиться на етапі 1.e.iii).

Similiarly, Runtime Semantics: PropertyDefinitionEvaluation викликає SetFunctionNameі таким чином дає цій функції справжнє ім'я:

let o = {
    sayHello: name => {
        console.log(`${name} says hello`);
    }
};

Сучасні двигуни встановлюють внутрішню назву функції для таких операторів; Edge все ще має біт, який робить його доступним, як nameна екземплярі функції за прапором виконання.

Наприклад, у Chrome або Firefox відкрийте веб-консоль і запустіть цей фрагмент:

"use strict";
let foo = () => { throw new Error(); };
console.log("foo.name is: " + foo.name);
try {
  foo();
} catch (e) {
  console.log(e.stack);
}

У Chrome 51 і новіших версіях, Firefox 53 і вище (і на Edge 13 і вище з експериментальним прапором), коли ви запустите це, ви побачите:

foo.name: foo
Помилка
    в foo (http://stacksnippets.net/js:14:23)
    за адресою http://stacksnippets.net/js:17

Зверніть увагу на foo.name is: fooі Error...at foo.

У Chrome 50 і новіших версіях, Firefox 52 і новіших версіях, і Edge без експериментального прапора, ви побачите це замість цього, оскільки вони не мають Function#nameвластивості (поки):

foo.name: 
Помилка
    в foo (http://stacksnippets.net/js:14:23)
    за адресою http://stacksnippets.net/js:17

Зверніть увагу , що ім'я відсутнє foo.name is:, але це буде показано в трасуванні стека. Просто реальна реалізація name властивості функції мала нижчий пріоритет, ніж деякі інші функції ES2015; У Chrome і Firefox зараз є; Edge має його за прапором, імовірно, він не буде позаду прапора набагато довше.

Очевидно, я можу використовувати цю функцію лише після того, як я її визначив

Правильно. Не існує синтаксису оголошення функцій для функцій стрілок, лише синтаксис вираження функцій , і немає стрілки, еквівалентної імені, у старому стилі з іменем виразу функції ( var f = function foo() { };). Тож немає еквівалента:

console.log(function fact(n) {
    if (n < 0) {
        throw new Error("Not defined for negative numbers");
    }
    return n == 0 ? 1 : n * fact(n - 1);
}(5)); // 120

Ви повинні розбити його на два вирази (я б заперечував, ви все одно повинні це робити ) :

let fact = n => {
    if (n < 0) {
      throw new Error("Not defined for negative numbers.");
    }
    return n == 0 ? 1 : n * fact(n - 1);
};
console.log(fact(5));

Звичайно, якщо вам потрібно поставити це там, де потрібен єдиний вираз, ви завжди можете ... використовувати функцію стрілки:

console.log((() => {
    let fact = n => {
        if (n < 0) {
            throw new Error("Not defined for negative numbers.");
        }
        return n == 0 ? 1 : n * fact(n - 1);
    };
    return fact(5);
})()); // 120

Я не кажу, що це досить, але це працює, якщо вам абсолютно позитивно потрібна обгортка з одним виразом.

Ні. Синтаксис стрілки - це коротка форма для анонімних функцій. Анонімні функції, ну, анонімні.

Іменовані функції визначаються за допомогою functionключового слова.

Якщо під "ім'ям" ви маєте на увазі, що хочете встановити .nameвластивість функції стрілки, вам пощастить.

Якщо функція стрілки визначена в правій частині виразу призначення, двигун візьме ім’я з лівої сторони і використовуватиме його для встановлення функції стрілки .name, наприклад

var sayHello = (name) => {
    console.log(name + ' says hello');
}

sayHello.name //=== 'sayHello'

Сказавши це, ваше питання, здається, більше: "чи можу я отримати функцію стрілки на підйомник?". Боюся, що відповідь на це - великий «ні».

Здається, що це стане можливим за допомогою ES7: https://babeljs.io/blog/2015/06/07/react-on-es6-plus#arrow-functions

Наведений приклад:

class PostInfo extends React.Component {
  handleOptionsButtonClick = (e) => {
    this.setState({showOptionsModal: true});
  }
}

Корпус функцій стрілок ES6 має таку саму лексичну, як і код, який їх оточує, що дає нам бажаний результат через спосіб визначення ініціалізаторів властивостей ES7.

Зауважте, що для роботи з babel мені потрібно було включити найбільш експериментальний синтаксис ES7 етап 0. У своєму файлі webpack.config.js я оновив навантажувач babel так:

{test: /\.js$/, exclude: /node_modules/, loader: 'babel?stage=0'},

Насправді схоже, що одним із способів назви функцій стрілок (принаймні, щодо хрому 77 ...) є це:

"use strict";
let fn_names = {};
fn_names.foo = () => { throw new Error(); };
console.log("foo.name is: " + foo.name);
try {
  foo();
} catch (e) {
  console.log(e.stack);
}

для того, щоб написати названу стрілочну функцію, ви можете скористатись наведеним нижче прикладом, де у мене є клас з ім'ям LoginClass, і всередині цього класу я написав функцію зі стрілкою з ім'ям , назване successAuth клас LoginClass {

    constructor() {

    }

    successAuth = (dataArgs)=> { //named arow function

    }

}

ЦЕ Є ES6

Так, я думаю, що ти шукаєш щось таке:

const foo = (depth) => {console.log("hi i'm Adele")}
foo -> // the function itself
foo() -> // "hi i'm Adele"

Ви можете пропустити функціональну частину та частину стрілки для створення функцій. Приклад:

 class YourClassNameHere{

   constructor(age) {
     this.age = age;
   }

   foo() {
     return "This is a function with name Foo";
   }

   bar() {
     return "This is a function with name bar";
   }

 }

let myVar = new YourClassNameHere(50);
myVar.foo();