Skip to content

Commit c92327d

Browse files
committed
merging all conflicts
2 parents b757f4f + 0599d07 commit c92327d

File tree

18 files changed

+224
-112
lines changed

18 files changed

+224
-112
lines changed

1-js/01-getting-started/1-intro/article.md

Lines changed: 15 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,10 @@
11
# Uma Introdução ao JavaScript
22

3+
<<<<<<< HEAD
34
Vamos ver o que há de tão especial no JavaScript, o que podemos fazer com ele, e que outras tecnologias funcionam bem com ele.
5+
=======
6+
Let's see what's so special about JavaScript, what we can achieve with it, and what other technologies play well with it.
7+
>>>>>>> 0599d07b3c13ee25f583fc091cead3c17a7e7779
48
59
## O que é JavaScript?
610

@@ -67,8 +71,13 @@ Exemplos de tais restrições incluem:
6771

6872
Os navegadores modernos permitem que ele trabalhe com arquivos, mas o acesso é limitado e fornecido apenas se o usuário executar determinadas ações, como "dropping" de um arquivo em uma janela do navegador ou selecioná-lo por meio de uma tag `<input>`.
6973

74+
<<<<<<< HEAD
7075
Existem maneiras de interagir com a câmera / microfone e outros dispositivos, mas eles exigem permissão explícita do usuário. Assim, uma página habilitada para JavaScript pode não habilmente habilitar uma câmera web, observar os arredores e enviar as informações para a [NSA](https://pt.wikipedia.org/wiki/Ag%C3%AAncia_de_Seguran%C3%A7a_Nacional).
7176
- Diferentes abas/janelas geralmente não se conhecem mutuamente. Às vezes sim, por exemplo, quando uma janela usa JavaScript para abrir a outra. Mas mesmo neste caso, JavaScript de uma página pode não acessar a outra se eles vierem de sites diferentes (de um domínio, protocolo ou porta diferente).
77+
=======
78+
There are ways to interact with camera/microphone and other devices, but they require a user's explicit permission. So a JavaScript-enabled page may not sneakily enable a web-camera, observe the surroundings and send the information to the [NSA](https://en.wikipedia.org/wiki/National_Security_Agency).
79+
- Different tabs/windows generally do not know about each other. Sometimes they do; for example when one window uses JavaScript to open the other one. But even in this case, JavaScript from one page may not access the other if they come from different sites (from a different domain, protocol or port).
80+
>>>>>>> 0599d07b3c13ee25f583fc091cead3c17a7e7779
7281
7382
Isso é chamado de "Política de mesma origem ". Para contornar isso, *ambas as páginas* devem conter um código JavaScript especial que lida com a troca de dados.
7483

@@ -116,6 +125,12 @@ Há mais. Claro que, mesmo que usemos uma dessas linguagens transpiladas, també
116125

117126
## Resumo
118127

128+
<<<<<<< HEAD
119129
- O JavaScript foi inicialmente criado como uma linguagem somente de navegador, mas agora é usado em muitos outros ambientes também.
120130
- Hoje, o JavaScript tem uma posição única como a linguagem de navegador mais amplamente adotada, com integração total com HTML/CSS.
121131
- Existem muitas linguagens que são "transpiladas" para JavaScript e que oferecem certas funcionalidades. Recomenda-se dar uma olhada nelas, pelo menos brevemente, depois de dominar o JavaScript.
132+
=======
133+
- JavaScript was initially created as a browser-only language, but it is now used in many other environments as well.
134+
- Today, JavaScript has a unique position as the most widely-adopted browser language with full integration in HTML/CSS.
135+
- There are many languages that get "transpiled" to JavaScript and provide certain features. It is recommended to take a look at them, at least briefly, after mastering JavaScript.
136+
>>>>>>> 0599d07b3c13ee25f583fc091cead3c17a7e7779

1-js/02-first-steps/18-javascript-specials/article.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -144,7 +144,7 @@ Assignments
144144
: There is a simple assignment: `a = b` and combined ones like `a *= 2`.
145145

146146
Bitwise
147-
: Bitwise operators work with 32-bit integers at the lowest, bit-level: see the [docs](mdn:/JavaScript/Reference/Operators/Bitwise_Operators) when they are needed.
147+
: Bitwise operators work with 32-bit integers at the lowest, bit-level: see the [docs](mdn:/JavaScript/Guide/Expressions_and_Operators#Bitwise) when they are needed.
148148

149149
Conditional
150150
: The only operator with three parameters: `cond ? resultA : resultB`. If `cond` is truthy, returns `resultA`, otherwise `resultB`.

1-js/04-object-basics/01-object/8-multiply-numeric/task.md

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -2,9 +2,15 @@ importância: 3
22

33
---
44

5+
<<<<<<< HEAD
56
# Multiplica as propriedades numéricas por 2
67

78
Crie uma função `multiplyNumeric(obj)` que multiplique todas as propriedades numéricas de `obj` por `2`.
9+
=======
10+
# Multiply numeric property values by 2
11+
12+
Create a function `multiplyNumeric(obj)` that multiplies all numeric property values of `obj` by `2`.
13+
>>>>>>> 0599d07b3c13ee25f583fc091cead3c17a7e7779
814
915
Por exemplo:
1016

1-js/04-object-basics/02-object-copy/article.md

Lines changed: 27 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,12 @@
1-
# Object copying, references
1+
# Object references and copying
22

3-
One of the fundamental differences of objects vs primitives is that they are stored and copied "by reference".
3+
One of the fundamental differences of objects versus primitives is that objects are stored and copied "by reference", as opposed to primitive values: strings, numbers, booleans, etc -- that are always copied "as a whole value".
44

5-
Primitive values: strings, numbers, booleans -- are assigned/copied "as a whole value".
5+
That's easy to understand if we look a bit "under a cover" of what happens when we copy a value.
66

7-
For instance:
7+
Let's start with a primitive, such as a string.
8+
9+
Here we put a copy of `message` into `phrase`:
810

911
```js
1012
let message = "Hello!";
@@ -15,21 +17,31 @@ As a result we have two independent variables, each one is storing the string `"
1517

1618
![](variable-copy-value.svg)
1719

20+
Quite an obvious result, right?
21+
1822
Objects are not like that.
1923

20-
**A variable stores not the object itself, but its "address in memory", in other words "a reference" to it.**
24+
**A variable assigned to an object stores not the object itself, but its "address in memory", in other words "a reference" to it.**
2125

22-
Here's the picture for the object:
26+
Let's look at an example of such variable:
2327

2428
```js
2529
let user = {
2630
name: "John"
2731
};
2832
```
2933

34+
And here's how it's actually stored in memory:
35+
3036
![](variable-contains-reference.svg)
3137

32-
Here, the object is stored somewhere in memory. And the variable `user` has a "reference" to it.
38+
The object is stored somewhere in memory (at the right of the picture), while the `user` variable (at the left) has a "reference" to it.
39+
40+
We may think of an object variable, such as `user`, as of a sheet of paper with the address.
41+
42+
When we perform actions with the object, e.g. take a property `user.name`, JavaScript engine looks into that address and performs the operation on the actual object.
43+
44+
Now here's why it's important.
3345

3446
**When an object variable is copied -- the reference is copied, the object is not duplicated.**
3547

@@ -45,6 +57,8 @@ Now we have two variables, each one with the reference to the same object:
4557

4658
![](variable-copy-reference.svg)
4759

60+
As you can see, there's still one object, now with two variables that reference it.
61+
4862
We can use any variable to access the object and modify its contents:
4963

5064
```js run
@@ -59,15 +73,14 @@ admin.name = 'Pete'; // changed by the "admin" reference
5973
alert(*!*user.name*/!*); // 'Pete', changes are seen from the "user" reference
6074
```
6175
62-
The example above demonstrates that there is only one object. As if we had a cabinet with two keys and used one of them (`admin`) to get into it. Then, if we later use another key (`user`) we can see changes.
6376
64-
## Comparison by reference
77+
It's just as if we had a cabinet with two keys and used one of them (`admin`) to get into it. Then, if we later use another key (`user`) we can see changes.
6578
66-
The equality `==` and strict equality `===` operators for objects work exactly the same.
79+
## Comparison by reference
6780
68-
**Two objects are equal only if they are the same object.**
81+
Two objects are equal only if they are the same object.
6982
70-
Here two variables reference the same object, thus they are equal:
83+
For instance, here `a` and `b` reference the same object, thus they are equal:
7184
7285
```js run
7386
let a = {};
@@ -77,7 +90,7 @@ alert( a == b ); // true, both variables reference the same object
7790
alert( a === b ); // true
7891
```
7992
80-
And here two independent objects are not equal, even though both are empty:
93+
And here two independent objects are not equal, even though they look alike (both are empty):
8194
8295
```js run
8396
let a = {};
@@ -86,7 +99,7 @@ let b = {}; // two independent objects
8699
alert( a == b ); // false
87100
```
88101
89-
For comparisons like `obj1 > obj2` or for a comparison against a primitive `obj == 5`, objects are converted to primitives. We'll study how object conversions work very soon, but to tell the truth, such comparisons occur very rarely, usually as a result of a coding mistake.
102+
For comparisons like `obj1 > obj2` or for a comparison against a primitive `obj == 5`, objects are converted to primitives. We'll study how object conversions work very soon, but to tell the truth, such comparisons are needed very rarely, usually they appear as a result of a programming mistake.
90103
91104
## Cloning and merging, Object.assign
92105

1-js/04-object-basics/04-object-methods/article.md

Lines changed: 10 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -32,11 +32,11 @@ user.sayHi = function() {
3232
user.sayHi(); // Hello!
3333
```
3434

35-
Here we've just used a Function Expression to create the function and assign it to the property `user.sayHi` of the object.
35+
Here we've just used a Function Expression to create a function and assign it to the property `user.sayHi` of the object.
3636

37-
Then we can call it. The user can now speak!
37+
Then we can call it as `user.sayHi()`. The user can now speak!
3838

39-
A function that is the property of an object is called its *method*.
39+
A function that is a property of an object is called its *method*.
4040

4141
So, here we've got a method `sayHi` of the object `user`.
4242

@@ -163,18 +163,24 @@ let user = {
163163
let admin = user;
164164
user = null; // overwrite to make things obvious
165165

166-
admin.sayHi(); // Whoops! inside sayHi(), the old name is used! error!
166+
*!*
167+
admin.sayHi(); // TypeError: Cannot read property 'name' of null
168+
*/!*
167169
```
168170

169171
If we used `this.name` instead of `user.name` inside the `alert`, then the code would work.
170172

171173
## "this" is not bound
172174

175+
<<<<<<< HEAD
173176
<<<<<<< HEAD
174177
In JavaScript, "this" keyword behaves unlike most other programming languages. First, it can be used in any function.
175178
=======
176179
In JavaScript, keyword `this` behaves unlike most other programming languages. It can be used in any function.
177180
>>>>>>> e074a5f825a3d10b0c1e5e82561162f75516d7e3
181+
=======
182+
In JavaScript, keyword `this` behaves unlike most other programming languages. It can be used in any function, even if it's not a method of an object.
183+
>>>>>>> 0599d07b3c13ee25f583fc091cead3c17a7e7779
178184
179185
There's no syntax error in the following example:
180186

1-js/04-object-basics/07-optional-chaining/article.md

Lines changed: 35 additions & 19 deletions
Original file line numberDiff line numberDiff line change
@@ -3,21 +3,25 @@
33

44
[recent browser="new"]
55

6-
The optional chaining `?.` is an error-proof way to access nested object properties, even if an intermediate property doesn't exist.
6+
The optional chaining `?.` is a safe way to access nested object properties, even if an intermediate property doesn't exist.
77

8-
## The problem
8+
## The "non-existing property" problem
99

1010
If you've just started to read the tutorial and learn JavaScript, maybe the problem hasn't touched you yet, but it's quite common.
1111

12-
For example, some of our users have addresses, but few did not provide them. Then we can't safely read `user.address.street`:
12+
As an example, let's consider objects for user data. Most of our users have addresses in `user.address` property, with the street `user.address.street`, but some did not provide them.
13+
14+
In such case, when we attempt to get `user.address.street`, we'll get an error:
1315

1416
```js run
15-
let user = {}; // the user happens to be without address
17+
let user = {}; // the user without "address" property
1618

1719
alert(user.address.street); // Error!
1820
```
1921

20-
Or, in the web development, we'd like to get an information about an element on the page, but it may not exist:
22+
That's the expected result, JavaScript works like this, but many practical cases we'd prefer to get `undefined` instead of an error (meaning "no street").
23+
24+
...And another example. In the web development, we may need to get an information about an element on the page, that sometimes doesn't exist:
2125

2226
```js run
2327
// Error if the result of querySelector(...) is null
@@ -34,7 +38,7 @@ let user = {}; // user has no address
3438
alert( user && user.address && user.address.street ); // undefined (no error)
3539
```
3640

37-
AND'ing the whole path to the property ensures that all components exist, but is cumbersome to write.
41+
AND'ing the whole path to the property ensures that all components exist (if not, the evaluation stops), but is cumbersome to write.
3842

3943
## Optional chaining
4044

@@ -86,7 +90,7 @@ We should use `?.` only where it's ok that something doesn't exist.
8690
8791
For example, if according to our coding logic `user` object must be there, but `address` is optional, then `user.address?.street` would be better.
8892
89-
So, if `user` happens to be undefined due to a mistake, we'll know about it and fix it. Otherwise, coding errors can be silenced where not appropriate, and become more difficult to debug.
93+
So, if `user` happens to be undefined due to a mistake, we'll see a programming error about it and fix it. Otherwise, coding errors can be silenced where not appropriate, and become more difficult to debug.
9094
```
9195

9296
<<<<<<< HEAD
@@ -102,28 +106,34 @@ If there's no variable `user` at all, then `user?.anything` triggers an error:
102106
user?.address;
103107
```
104108
<<<<<<< HEAD
109+
<<<<<<< HEAD
105110
The optional chaining only tests for `null/undefined`, doesn't interfere with any other language mechanics.
106111
=======
107112
There must be `let/const/var user`. The optional chaining works only for declared variables.
108113
>>>>>>> e074a5f825a3d10b0c1e5e82561162f75516d7e3
114+
=======
115+
There must be a declaration (e.g. `let/const/var user`). The optional chaining works only for declared variables.
116+
>>>>>>> 0599d07b3c13ee25f583fc091cead3c17a7e7779
109117
````
110118
111119
## Short-circuiting
112120
113121
As it was said before, the `?.` immediately stops ("short-circuits") the evaluation if the left part doesn't exist.
114122

115-
So, if there are any further function calls or side effects, they don't occur:
123+
So, if there are any further function calls or side effects, they don't occur.
124+
125+
For instance:
116126

117127
```js run
118128
let user = null;
119129
let x = 0;
120130

121-
user?.sayHi(x++); // nothing happens
131+
user?.sayHi(x++); // no "sayHi", so the execution doesn't reach x++
122132

123133
alert(x); // 0, value not incremented
124134
```
125135

126-
## Other cases: ?.(), ?.[]
136+
## Other variants: ?.(), ?.[]
127137

128138
The optional chaining `?.` is not an operator, but a special syntax construct, that also works with functions and square brackets.
129139

@@ -146,13 +156,17 @@ user2.admin?.();
146156
*/!*
147157
```
148158
149-
Here, in both lines we first use the dot `.` to get `admin` property, because the user object must exist, so it's safe read from it.
159+
Here, in both lines we first use the dot (`user1.admin`) to get `admin` property, because the user object must exist, so it's safe read from it.
150160
161+
<<<<<<< HEAD
151162
<<<<<<< HEAD
152163
Then `?.()` checks the left part: if the user exists, then it runs (for `user1`). Otherwise (for `user2`) the evaluation stops without errors.
153164
=======
154165
Then `?.()` checks the left part: if the admin function exists, then it runs (for `user1`). Otherwise (for `user2`) the evaluation stops without errors.
155166
>>>>>>> e074a5f825a3d10b0c1e5e82561162f75516d7e3
167+
=======
168+
Then `?.()` checks the left part: if the admin function exists, then it runs (that's so for `user1`). Otherwise (for `user2`) the evaluation stops without errors.
169+
>>>>>>> 0599d07b3c13ee25f583fc091cead3c17a7e7779
156170
157171
The `?.[]` syntax also works, if we'd like to use brackets `[]` to access properties instead of dot `.`. Similar to previous cases, it allows to safely read a property from an object that may not exist.
158172
@@ -177,28 +191,30 @@ Also we can use `?.` with `delete`:
177191
delete user?.name; // delete user.name if user exists
178192
```
179193
180-
```warn header="We can use `?.` for safe reading and deleting, but not writing"
181-
The optional chaining `?.` has no use at the left side of an assignment:
194+
````warn header="We can use `?.` for safe reading and deleting, but not writing"
195+
The optional chaining `?.` has no use at the left side of an assignment.
182196
197+
For example:
183198
```js run
184-
// the idea of the code below is to write user.name, if user exists
199+
let user = null;
185200

186201
user?.name = "John"; // Error, doesn't work
187202
// because it evaluates to undefined = "John"
188203
```
189204
205+
It's just not that smart.
206+
````
207+
190208
## Summary
191209
192-
The `?.` syntax has three forms:
210+
The optional chaining `?.` syntax has three forms:
193211
194212
1. `obj?.prop` -- returns `obj.prop` if `obj` exists, otherwise `undefined`.
195213
2. `obj?.[prop]` -- returns `obj[prop]` if `obj` exists, otherwise `undefined`.
196-
3. `obj?.method()` -- calls `obj.method()` if `obj` exists, otherwise returns `undefined`.
214+
3. `obj.method?.()` -- calls `obj.method()` if `obj.method` exists, otherwise returns `undefined`.
197215
198216
As we can see, all of them are straightforward and simple to use. The `?.` checks the left part for `null/undefined` and allows the evaluation to proceed if it's not so.
199217
200218
A chain of `?.` allows to safely access nested properties.
201219
202-
Still, we should apply `?.` carefully, only where it's ok that the left part doesn't to exist.
203-
204-
So that it won't hide programming errors from us, if they occur.
220+
Still, we should apply `?.` carefully, only where it's acceptable that the left part doesn't to exist. So that it won't hide programming errors from us, if they occur.

1-js/05-data-types/03-string/article.md

Lines changed: 17 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -102,7 +102,11 @@ alert( 'I*!*\'*/!*m the Walrus!' ); // *!*I'm*/!* the Walrus!
102102

103103
As you can see, we have to prepend the inner quote by the backslash `\'`, because otherwise it would indicate the string end.
104104

105+
<<<<<<< HEAD
105106
Of course, that refers only to the quotes that are same as the enclosing ones. So, as a more elegant solution, we could switch to double quotes or backticks instead:
107+
=======
108+
Of course, only the quotes that are the same as the enclosing ones need to be escaped. So, as a more elegant solution, we could switch to double quotes or backticks instead:
109+
>>>>>>> 0599d07b3c13ee25f583fc091cead3c17a7e7779
106110
107111
```js run
108112
alert( `I'm the Walrus!` ); // I'm the Walrus!
@@ -305,8 +309,14 @@ if (str.indexOf("Widget") != -1) {
305309
}
306310
```
307311

312+
<<<<<<< HEAD
308313
````smart header="The bitwise NOT trick"
309314
One of the old tricks used here is the [bitwise NOT](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Bitwise_Operators#Bitwise_NOT) `~` operator. It converts the number to a 32-bit integer (removes the decimal part if exists) and then reverses all bits in its binary representation.
315+
=======
316+
#### The bitwise NOT trick
317+
318+
One of the old tricks used here is the [bitwise NOT](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Bitwise_NOT) `~` operator. It converts the number to a 32-bit integer (removes the decimal part if exists) and then reverses all bits in its binary representation.
319+
>>>>>>> 0599d07b3c13ee25f583fc091cead3c17a7e7779
310320
311321
For 32-bit integers the call `~n` means exactly the same as `-(n+1)` (due to IEEE-754 format).
312322
@@ -338,7 +348,14 @@ if (~str.indexOf("Widget")) {
338348
It is usually not recommended to use language features in a non-obvious way, but this particular trick is widely used in old code, so we should understand it.
339349
340350
Just remember: `if (~str.indexOf(...))` reads as "if found".
351+
<<<<<<< HEAD
341352
````
353+
=======
354+
355+
To be precise though, as big numbers are truncated to 32 bits by `~` operator, there exist other numbers that give `0`, the smallest is `~4294967295=0`. That makes such check correct only if a string is not that long.
356+
357+
Right now we can see this trick only in the old code, as modern JavaScript provides `.includes` method (see below).
358+
>>>>>>> 0599d07b3c13ee25f583fc091cead3c17a7e7779
342359
343360
### includes, startsWith, endsWith
344361

1-js/05-data-types/05-array-methods/7-map-objects/solution.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -25,7 +25,7 @@ alert( usersMapped[0].id ); // 1
2525
alert( usersMapped[0].fullName ); // John Smith
2626
```
2727

28-
Please note that in for the arrow functions we need to use additional brackets.
28+
Please note that in the arrow functions we need to use additional brackets.
2929

3030
We can't write like this:
3131
```js

0 commit comments

Comments
 (0)