You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Arrow functions are not just a "shorthand" for writing small stuff.
5
+
As *arrow functions* não são somente uma "abreviação" para escrevermos menos código.
6
6
7
-
JavaScript is full of situations where we need to write a small function, that's executed somewhere else.
7
+
O *JavaScript* está cheio de situações onde precisamos escrever uma pequena função que será executada em um outro lugar.
8
8
9
-
For instance:
9
+
Por exemplo:
10
10
11
-
-`arr.forEach(func)` -- `func`is executed by`forEach`for every array item.
12
-
-`setTimeout(func)` -- `func`is executed by the built-in scheduler.
13
-
- ...there are more.
11
+
-`arr.forEach(func)` -- `func`é executada por`forEach`para cada item do *array*.
12
+
-`setTimeout(func)` -- `func`é executada pelo agendador embutido.
13
+
- ...entre outros.
14
14
15
-
It's in the very spirit of JavaScript to create a function and pass it somewhere.
15
+
Uma das características mais marcantes do *JavaScript* é criar uma função e passá-la para outro lugar.
16
16
17
-
And in such functions we usually don't want to leave the current context.
17
+
E, nessas funções, geralmente não queremos sair de nosso contexto atual.
18
18
19
-
## Arrow functions have no "this"
19
+
## Arrow functions não possuem "this"
20
20
21
-
As we remember from the chapter <info:object-methods>, arrow functions do not have `this`. If`this`is accessed, it is taken from the outside.
21
+
Assim como vimos no capítulo <info:object-methods>, *arrow functions* não possuem `this`. Se`this`é acessada, ela vem do contexto externo em que está inserida.
22
22
23
-
For instance, we can use it to iterate inside an object method:
23
+
Por exemplo, podemos usá-la para iterar dentro de um método de objeto:
24
24
25
25
```js run
26
26
let group = {
27
-
title:"Our Group",
27
+
title:"Nosso Grupo",
28
28
students: ["John", "Pete", "Alice"],
29
29
30
30
showList() {
@@ -39,13 +39,13 @@ let group = {
39
39
group.showList();
40
40
```
41
41
42
-
Here in`forEach`, the arrow function is used, so`this.title`in it is exactly the same as in the outer method `showList`. That is: `group.title`.
42
+
Aqui em`forEach`, a *arrow function* é usada, então`this.title`dentro dela é a mesma que a da função em que está inserida `showList`. Ou seja: `group.title`.
43
43
44
-
If we used a "regular" function, there would be an error:
44
+
Se usássemos uma função "regular", haveria um erro:
45
45
46
46
```js run
47
47
let group = {
48
-
title:"Our Group",
48
+
title:"Nosso Grupo",
49
49
students: ["John", "Pete", "Alice"],
50
50
51
51
showList() {
@@ -61,28 +61,28 @@ let group = {
61
61
group.showList();
62
62
```
63
63
64
-
The error occurs because`forEach`runs functions with`this=undefined`by default, so the attempt to access `undefined.title`is made.
64
+
O erro acontece porque`forEach`executa funções com`this=undefined`por padrão. Então, a tentativa de acessar `undefined.title`é feita.
65
65
66
-
That doesn't affect arrow functions, because they just don't have`this`.
66
+
Isso não acontece com *arrow functions*, porque elas não possuem`this`.
67
67
68
-
```warn header="Arrow functions can't run with`new`"
69
-
Not having`this`naturally means another limitation: arrow functions can't be used as constructors. They can't be called with`new`.
68
+
```warn header="Arrow functions não podem ser executadas com`new`"
69
+
Não possuir`this`traz naturalmente outra limitação: *arrow functions* não podem ser usadas com construtores. Elas não podem ser chamadas com`new`.
70
70
```
71
71
72
72
```smart header="Arrow functions VS bind"
73
-
There's a subtle difference between an arrow function `=>` and a regular function called with `.bind(this)`:
73
+
Existe uma diferença sutil entre uma *arrow function* `=>` e uma função regular chamada com `.bind(this)`:
74
74
75
-
- `.bind(this)` creates a "bound version" of the function.
76
-
- The arrow `=>` doesn't create any binding. The function simply doesn't have `this`. The lookup of `this` is made exactly the same way as a regular variable search: in the outer lexical environment.
75
+
- `.bind(this)` cria uma "versão vinculada" da função.
76
+
- A *arrow* `=>` não cria nenhum vínculo. A função simplesmente não possui `this`. A busca por `this` é feita exatamente da mesma maneira que uma busca por uma variável regular: em seu contexto léxico onde está inserida.
77
77
```
78
78
79
-
## Arrows have no "arguments"
79
+
## Arrows não possuem "arguments" (argumentos)
80
80
81
-
Arrow functions also have no `arguments` variable.
81
+
*Arrow functions* também não possuem a variável `arguments`.
82
82
83
-
That's great for decorators, when we need to forward a call with the current `this`and`arguments`.
83
+
Isso é ótimo para *decorators*, quando precisamos encaminhar uma chamada com os atuais `this`e`arguments`.
84
84
85
-
For instance, `defer(f, ms)`gets a function and returns a wrapper around it that delays the call by `ms`milliseconds:
85
+
Por exemplo, `defer(f, ms)`recebe uma função e retorna um *wrapper* (invólucro) ao seu redor que atrasa a chamada por `ms`milissegundos:
86
86
87
87
```js run
88
88
functiondefer(f, ms) {
@@ -92,14 +92,14 @@ function defer(f, ms) {
92
92
}
93
93
94
94
functionsayHi(who) {
95
-
alert('Hello, '+ who);
95
+
alert('Olá, '+ who);
96
96
}
97
97
98
98
let sayHiDeferred =defer(sayHi, 2000);
99
-
sayHiDeferred("John"); //Hello, John after 2 seconds
99
+
sayHiDeferred("John"); //Olá, John depois de 2 segundos
100
100
```
101
101
102
-
The same without an arrow function would look like:
102
+
O mesmo sem uma *arrow function* seria algo assim:
103
103
104
104
```js
105
105
functiondefer(f, ms) {
@@ -112,15 +112,15 @@ function defer(f, ms) {
112
112
}
113
113
```
114
114
115
-
Here we had to create additional variables `args`and`ctx`so that the function inside `setTimeout`could take them.
115
+
Aqui precisamos criar as variáveis adicionais `args`e`ctx`para que a função chamada dentro de `setTimeout`possam acessá-las.
116
116
117
-
## Summary
117
+
## Resumo
118
118
119
-
Arrow functions:
119
+
*Arrow functions* (funções seta):
120
120
121
-
-Do not have`this`.
122
-
-Do not have`arguments`.
123
-
-Can't be called with`new`.
124
-
- (They also don't have`super`, but we didn't study it. Will be in the chapter<info:class-inheritance>).
121
+
-Não possuem`this`.
122
+
-Não possuem`arguments`.
123
+
-Não podem ser chamadas com`new`.
124
+
- (Elas também não possuem`super`, mas ainda não a estudamos. Veremos no capítulo<info:class-inheritance>).
125
125
126
-
That's because they are meant for short pieces of code that do not have their own "context", but rather works in the current one. And they really shine in that use case.
126
+
Isso porque elas são feitas para pequenos trechos de código que não possuem seus próprios "contextos", mas sim utilizam o contexto em que estão inseridas. E elas realmente brilham nesses casos.
0 commit comments