Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

What is the difference between () => {} and function() {} in react-native javascript? [duplicate]

I have seen some functions defined as function(){} and some functions defined as () => {}.

Is this related to Javascript version ES6?

Also, how does use of this keyword change from one function definition to another?

like image 354
Parth Tiwari Avatar asked Jun 13 '16 18:06

Parth Tiwari


People also ask

How are arrow functions () => {} different than traditional function expressions?

Unlike regular functions, arrow functions do not have their own this . The value of this inside an arrow function remains the same throughout the lifecycle of the function and is always bound to the value of this in the closest non-arrow parent function.

What does () => mean in JavaScript?

It's a new feature that introduced in ES6 and is called arrow function. The left part denotes the input of a function and the right part the output of that function.

What does {} mean in react?

Curly braces { } are special syntax in JSX. It is used to evaluate a JavaScript expression during compilation. A JavaScript expression can be a variable, function, an object, or any code that resolves into a value.

What is the difference between arrow functions and regular JavaScript functions?

Regular functions created using function declarations or expressions are 'constructible' and 'callable'. Since regular functions are constructible, they can be called using the 'new' keyword. However, the arrow functions are only 'callable' and not constructible.


1 Answers

The () => {} is called an arrow function. They are, as you said, part of ES6. From the linked page:

An arrow function expression has a shorter syntax compared to function expressions and lexically binds the this value (does not bind its own this, arguments, super, or new.target). Arrow functions are always anonymous.

like image 169
cyberbit Avatar answered Sep 20 '22 18:09

cyberbit