Stack Overflow
Stack Overflow

Questions tagged [arrow-functions]

Questions about the compact function syntax in ECMAScript2015 (ES6) called "arrow functions" because of their use of "=>".

"Arrow functions" are a compact syntax for function definitions in ECMAScript 2015 (ES6).

Arrow functions differ from regular functions in several ways:

  • They cannot be named. They are anonymous only.
  • They are not constructors, don't have a .prototype and cannot be instantiated by new.
  • They use lexically scoped this instead of binding this dynamically on the call

Arrow functions are also available in CoffeeScript.

1520 questions
10
votes
3 answers

When using React Is it preferable to use fat arrow functions or bind functions in constructor?

When creating a React class, which is preferable? export default class Foo extends React.Component { constructor (props) { super(props) this.doSomething = this.doSomething.bind(this) } doSomething () { ... } } or export default class…
davegri
  • 2,206
  • 2
  • 26
  • 45
10
votes
2 answers

This values for arrow functions

I am trying to understand arrow functions in ECMAScript 6. This is the definition I came across while reading: Arrow functions have implicit this binding, which means that the value of the this value inside of an arrow function is aways the …
Liondancer
  • 15,721
  • 51
  • 149
  • 255
10
votes
1 answer

When does the "fat arrow" (=>) bind to "this" instance

The fat arrow can be used in different settings but it somehow doesn't always bind to the instance I want.
robkuz
  • 9,488
  • 5
  • 29
  • 50
9
votes
4 answers

How fix this warrning warning Array.prototype.map() expects a return value from arrow function array-callback-return?

My real problem is : i have data.js file inside this file i create a static array like this: const products = [ { _id:1, name: 'Slim Shirt', category:'Shirt', image:'/images/d1.jpg', …
karim chelly
  • 93
  • 1
  • 1
  • 5
9
votes
3 answers

java-script arrow function returns (x++,x)

i don't know how the code:const countFrom = x => () => (x++, x); from here, works: const countFrom = x => () => (x++, x); let a = countFrom(1) console.log('output:', a()) // output: 2 console.log('output:', a()) // output:…
Babak Karimi Asl
  • 332
  • 2
  • 9
9
votes
2 answers

D3.js v4: Access current DOM element in ES6 arrow function event listener

In D3.js v4, when registering an event listener through a traditional callback function, this references the current DOM element: d3.select("div").on('mouseenter', function() { d3.select(this).text("Yay"); }); ES6 offers arrow functions, which…
Rahel Lüthy
  • 6,837
  • 3
  • 36
  • 51
9
votes
2 answers

Angular2 subscribe understand arrow function

I try to understand arrow functions of typescript by the example of Angular 2 Observable subscribe method. Could somebody explain me: I have this code which works: this.readdataservice.getPost().subscribe( posts => { this.posts = posts;…
miholzi
  • 922
  • 1
  • 14
  • 36
9
votes
1 answer

Difference of .bind() to arrow function () => usage in React

Suppose that I have a function generateList() that updates the state and mapping it to an onClick to a
  • .
  • Product
    • There are times that I encounter errors…
    anobilisgorse
    • 906
    • 2
    • 11
    • 25
    9
    votes
    1 answer

    How do you return an object with a fat arrow function without rebinding this?

    I have a simple function (within a React component): getInitialState: function() { return { text: this.props.text } } But I want to fat arrowify it: getInitialState: () => { text: this.props.text } except I get an error, because a {…
    at.
    • 50,922
    • 104
    • 292
    • 461
    9
    votes
    1 answer

    Why can't I access `this` within an arrow function?

    This code below should work as expected, and log "meow", here an example. function Cat () { this.animalNoise = 'meow' } Cat.prototype.sound = () => { console.log(this.animalNoise) } let cat = new Cat() cat.sound() It doesn't work, this error…
    ThomasReggi
    • 55,053
    • 85
    • 237
    • 424
    8
    votes
    4 answers

    Rewriting an anonymous function in php 7.4

    There is the following anonymous recursive function: $f = function($n) use (&$f) { return ($n == 1) ? 1 : $n * $f($n - 1); }; echo $f(5); // 120 I try to rewrite to version 7.4, but there is an error, please tell me what I'm missing? $f =…
    wnull
    • 217
    • 6
    • 21
    8
    votes
    4 answers

    Javascript 'this' returns undefined inside object

    I have following code: let myObj = { foo: "bar", getFoo: function() { console.log(this.foo); }, method: function() { if (true) { window.addEventListener('scroll', this.getFoo); } else { …
    galingong
    • 323
    • 1
    • 4
    • 14
    8
    votes
    3 answers

    JavaScript: Arrow Function with Destruction?

    On MDN, the following code is used as an example of how arrow functions are used to write shorter functions. var materials = [ 'Hydrogen', 'Helium', 'Lithium', 'Beryllium' ]; materials.map(function(material) { return material.length;…
    Magnus
    • 6,791
    • 8
    • 53
    • 84
    8
    votes
    3 answers

    How to use arrow function with || operator

    Using Babel, I can see that callback = () => {}; compiles to callback = function callback() {}; which is what I expect. However I get an error when I try to use it with || callback = callback || () => {} Which I'd expect to be equivalent to …
    1252748
    • 14,597
    • 32
    • 109
    • 229
    8
    votes
    1 answer

    this is undefined inside arrow function

    I am trying to access this inside my arrow function: import myObject from '../myObjectPath'; export const myClass = Fluxxor.createStore({ initialize() { this.list = []; this.id = null; }, myOutsideFunction(variable1) { …
    Besat
    • 1,428
    • 13
    • 27
    1 2 3
    …
    99 100