fixes
This commit is contained in:
parent
99e59ba611
commit
2f0c37db83
3 changed files with 28 additions and 27 deletions
|
@ -92,30 +92,6 @@ let user = {
|
||||||
```
|
```
|
||||||
That is called a "trailing" or "hanging" comma. Makes it easier to add/remove/move around properties, because all lines become alike.
|
That is called a "trailing" or "hanging" comma. Makes it easier to add/remove/move around properties, because all lines become alike.
|
||||||
|
|
||||||
````smart header="Object with const can be changed"
|
|
||||||
Please note: an object declared as `const` *can* be modified.
|
|
||||||
|
|
||||||
For instance:
|
|
||||||
|
|
||||||
```js run
|
|
||||||
const user = {
|
|
||||||
name: "John"
|
|
||||||
};
|
|
||||||
|
|
||||||
*!*
|
|
||||||
user.name = "Pete"; // (*)
|
|
||||||
*/!*
|
|
||||||
|
|
||||||
alert(user.name); // Pete
|
|
||||||
```
|
|
||||||
|
|
||||||
It might seem that the line `(*)` would cause an error, but no. The `const` fixes the value of `user`, but not its contents.
|
|
||||||
|
|
||||||
The `const` would give an error only if we try to set `user=...` as a whole.
|
|
||||||
|
|
||||||
There's another way to make constant object properties, we'll cover it later in the chapter <info:property-descriptors>.
|
|
||||||
````
|
|
||||||
|
|
||||||
## Square brackets
|
## Square brackets
|
||||||
|
|
||||||
For multiword properties, the dot access doesn't work:
|
For multiword properties, the dot access doesn't work:
|
||||||
|
|
|
@ -73,7 +73,6 @@ admin.name = 'Pete'; // changed by the "admin" reference
|
||||||
alert(*!*user.name*/!*); // 'Pete', changes are seen from the "user" reference
|
alert(*!*user.name*/!*); // 'Pete', changes are seen from the "user" reference
|
||||||
```
|
```
|
||||||
|
|
||||||
|
|
||||||
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.
|
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.
|
||||||
|
|
||||||
## Comparison by reference
|
## Comparison by reference
|
||||||
|
@ -230,6 +229,30 @@ To fix that, we should use the cloning loop that examines each value of `user[ke
|
||||||
|
|
||||||
We can use recursion to implement it. Or, not to reinvent the wheel, take an existing implementation, for instance [_.cloneDeep(obj)](https://lodash.com/docs#cloneDeep) from the JavaScript library [lodash](https://lodash.com).
|
We can use recursion to implement it. Or, not to reinvent the wheel, take an existing implementation, for instance [_.cloneDeep(obj)](https://lodash.com/docs#cloneDeep) from the JavaScript library [lodash](https://lodash.com).
|
||||||
|
|
||||||
|
```smart header="Const objects can be modified"
|
||||||
|
An important "side effect" of storing objects as references is that an object declared as `const` *can* be modified.
|
||||||
|
|
||||||
|
For instance:
|
||||||
|
|
||||||
|
```js run
|
||||||
|
const user = {
|
||||||
|
name: "John"
|
||||||
|
};
|
||||||
|
|
||||||
|
*!*
|
||||||
|
user.name = "Pete"; // (*)
|
||||||
|
*/!*
|
||||||
|
|
||||||
|
alert(user.name); // Pete
|
||||||
|
```
|
||||||
|
|
||||||
|
It might seem that the line `(*)` would cause an error, but no. The value of `user` is constant, it must always reference the same object. But properties of that object are free to change.
|
||||||
|
|
||||||
|
In other words, the `const user` gives an error only if we try to set `user=...` as a whole, and that's all.
|
||||||
|
|
||||||
|
That said, if we really need to make constant object properties, it's also possible, but using totally different methods, we'll mention that in the chapter <info:property-descriptors>.
|
||||||
|
```
|
||||||
|
|
||||||
## Summary
|
## Summary
|
||||||
|
|
||||||
Objects are assigned and copied by reference. In other words, a variable stores not the "object value", but a "reference" (address in memory) for the value. So copying such a variable or passing it as a function argument copies that reference, not the object.
|
Objects are assigned and copied by reference. In other words, a variable stores not the "object value", but a "reference" (address in memory) for the value. So copying such a variable or passing it as a function argument copies that reference, not the object.
|
||||||
|
|
|
@ -76,11 +76,13 @@ For instance, the code below prevents all such events and shows what we are tryi
|
||||||
|
|
||||||
Please note, that it's possible to copy/paste not just text, but everything. For instance, we can copy a file in the OS file manager, and paste it.
|
Please note, that it's possible to copy/paste not just text, but everything. For instance, we can copy a file in the OS file manager, and paste it.
|
||||||
|
|
||||||
There's a list of methods [in the specification](https://www.w3.org/TR/clipboard-apis/#dfn-datatransfer) that can work with different data types including files, read/write to the clipboard.
|
That's because `clipboardData` implements `DataTransfer` interface, commonly used for drag'n'drop and copy/pasting. It's bit beyound our scope now, but you can find its methods [in the specification](https://html.spec.whatwg.org/multipage/dnd.html#the-datatransfer-interface).
|
||||||
|
|
||||||
But please note that clipboard is a "global" OS-level thing. Most browsers allow read/write access to the clipboard only in the scope of certain user actions for the safety, e.g. in `onclick` event handlers.
|
```warn header="ClipboardAPI: user safety restrictions"
|
||||||
|
The clipboard is a "global" OS-level thing. So most browsers allow read/write access to the clipboard only in the scope of certain user actions for the safety, e.g. in `onclick` event handlers.
|
||||||
|
|
||||||
Also it's forbidden to generate "custom" clipboard events with `dispatchEvent` in all browsers except Firefox.
|
Also it's forbidden to generate "custom" clipboard events with `dispatchEvent` in all browsers except Firefox.
|
||||||
|
```
|
||||||
|
|
||||||
## Summary
|
## Summary
|
||||||
|
|
||||||
|
|
Loading…
Add table
Add a link
Reference in a new issue