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
30
votes
1 answer

ES6 arrow functions and array.map

I am trying to understand some shorthand ways of writing ES6. What I cannot fully understand in the example below is the last shorthand "({length})" - I comprehend that it does work, and that it gets the length property of the array, but not why.…
Kermit
  • 2,865
  • 3
  • 30
  • 53
29
votes
1 answer

Do ES6 arrow functions still close over "this" even if they don't use it?

I'm trying to understand the rules of when this is lexically bound in an ES6 arrow function. Let's first look at this: function Foo(other) { other.callback = () => { this.bar(); }; this.bar = function() { console.log('bar called'); …
cfh
  • 4,576
  • 1
  • 24
  • 34
26
votes
9 answers

How to fix "Expected to return a value in arrow function" with reactjs?

I have two function in my react-app components componentDidMount() { if(Object.keys(this.props.praticiens).length>0) Object.keys(this.props.praticiens).map((praticien) => { …
Ichrak Mansour
  • 1,850
  • 11
  • 34
  • 61
25
votes
3 answers

Does PHP Support Arrow Function Syntax?

After complaining about the tumultuous task of writing the keyword function over and over, I asked someone about an easier way. The person said that PHP is going to have arrow function syntax similar to es6. const foo = (x, y) => { return x…
Abulurd
  • 1,018
  • 4
  • 15
  • 31
22
votes
2 answers

$('elems').each() with fat arrow

I started to use ES6 fat arrow function notation and I really like it. But I am a little bit confused about it context. As far as I know, keyword this inside fat arrow function refers to context where the function is currently running. I wanted to…
exoslav
  • 2,094
  • 3
  • 21
  • 26
21
votes
3 answers

How to use arrow functions in PHP?

I got to know about arrow functions in PHP 7.4. I tried using them like { return $num + 1; } echo $arrowfunction(); Because I saw the => operator in the pull request. Just like javascript. I expected '2'…
weegee
  • 3,256
  • 2
  • 18
  • 32
20
votes
3 answers

Arrow functions vs Fat arrow functions

I've found on the internet about both names, arrow functions and fat arrow functions but no information about what is different between them. Are there any differences?
Samurai Jack
  • 2,985
  • 8
  • 35
  • 58
20
votes
2 answers

What does arrow function '() => {}' mean in Javascript?

I was reading the source for ScrollListView and in several places I see the use of () => {}. Such as on line 25, this.cellReorderThreshold = () => { var ratio = (this.CELLHEIGHT*this.cellsWithinViewportCount)/4; return ratio <…
cnotethegr8
  • 7,342
  • 8
  • 68
  • 104
19
votes
5 answers

Arrow style user defined type guard?

The typescript handbook on user defined type guards defines an example type guard as function isFish(pet: Fish | Bird): pet is Fish { return (pet).swim !== undefined; } Is there a corresponding syntax for arrow functions?
LudvigH
  • 3,662
  • 5
  • 31
  • 49
19
votes
2 answers

Why can I not use `new` with an arrow function in JavaScript/ES6?

As far as I know, the arrow function is similar to a normal function. There aren’t any problem when I use it like this: let X = () => {}; let Y = function() {}; X(); Y(); However, the error occurred when I used them with new: let X = () =>…
Ricky
  • 569
  • 4
  • 16
18
votes
2 answers

Passing parameters to a callback function using arrow function

I know this is a duplicated question with ES5, but I am looking for the syntax with ES6 arrow function. My code below: fetchItems = (callback) => { //After ajax success callback(response); } const myParams =…
Jaison James
  • 4,414
  • 4
  • 42
  • 54
18
votes
4 answers

Are there performance gains in using ES6 Arrow Functions?

The new arrow functions in ES6, are like one-liner functions which make code more clean and concise, and also allow you to keep the scope of the caller inside the function, so that you don’t need to do things like var _this = this;, or use the bind…
grizzthedj
  • 7,131
  • 16
  • 42
  • 62
17
votes
1 answer

react export function vs export const: FC

So I am just wondering what is the difference or reasons to use one over the other... export function Name() { return
} vs export const Name = () => { return
}
wynx
  • 243
  • 2
  • 14
17
votes
2 answers

How to remove arrow functions from webpack output

After running my code through webpack it contians arrow functions. I need the code to work in ie11 so I need to get rid of the arrow functions. I'm using babel-loader for all .js files. I wrote a loader to check code for arrow functions and ran it…
17
votes
4 answers

Can I use arrow function in constructor of a react component?

This question is similar to When using React Is it preferable to use fat arrow functions or bind functions in constructor? but a little bit different. You can bind a function to this in the constructor, or just apply arrow function in constructor.…
ycdesu
  • 725
  • 1
  • 4
  • 12