mirror of
https://github.com/Stone-Red-Code/website.git
synced 2026-09-04 09:15:58 +02:00
content(resources): update JS arrow functions
This is both adding more content to the existing article, as well as explaining the use of parameters inside immediate return arrow functions. > The correction was changing it from telling the reader it was for one-line expression returns only, to logic-less expression returns as they could take up multiple lines in the case of it being an object or array or such.
This commit is contained in:
committed by
Jean-Philippe Sirois
parent
b2ab8d3781
commit
7f00d07c11
@@ -1,6 +1,7 @@
|
||||
---
|
||||
authors:
|
||||
- "T0M#5956"
|
||||
- "Hayden#5036"
|
||||
created_at: 2019/10/08
|
||||
updated_at: 2019/10/13
|
||||
title: Arrow functions
|
||||
@@ -40,12 +41,31 @@ const sayHello = name => {
|
||||
};
|
||||
```
|
||||
|
||||
Another interesting feature that also reduces the syntax within arrow functions, is that if a function only returns an expression using one line of code, you can omit the `return` keyword and the curly braces. In arrow functions without braces, the `return` is implicit, meaning you don't need to include the `return` keyword. The following function returns "hello":
|
||||
Another interesting feature that also reduces the syntax within arrow functions, is that if the function is an expression, you can omit the `return` keyword and the curly braces. In arrow functions without braces, the `return` is implicit, meaning you don't need to include the `return` keyword. The following function returns "hello":
|
||||
|
||||
```js
|
||||
const sayHello = () => "hello";
|
||||
```
|
||||
|
||||
The same is also true of functions returning an expression using parameters, too.
|
||||
|
||||
```js
|
||||
const sayHello = name => `hello ${name}`;
|
||||
```
|
||||
|
||||
Or even...
|
||||
|
||||
```js
|
||||
const helloObject = name => ({
|
||||
isGreeting: true,
|
||||
helloName: name,
|
||||
});
|
||||
```
|
||||
|
||||
This is essentially wrapping an object expression inside a grouped expression, causing it to return an object instead of expanding into a whole function body.
|
||||
|
||||
Long story short, we heard you liked expressions, so we put an expression inside your expression to give you nicer expressions.
|
||||
|
||||
## Handling of the Keyword This
|
||||
|
||||
The keyword `this` is handled differently in arrow functions. In an arrow function, `this` inherits its binding from the parent scope. That means that the keyword `this` inside of an arrow function references the same object that it does immediately outside of the arrow function where the arrow function is declared. On the other hand, when you use the older `function` syntax, `this` typically refers to the object that the function was called on, if the function is called as an instance method. If the function is not called as an instance method, `this` will usually be undefined (though it is possible to use functions like `call` or `bind` to manually provide a binding).
|
||||
|
||||
Reference in New Issue
Block a user