Skip to content

Commit 067ceb6

Browse files
committed
translated another part
1 parent 42b241f commit 067ceb6

File tree

1 file changed

+71
-71
lines changed

1 file changed

+71
-71
lines changed

1-js/99-js-misc/01-proxy/article.md

Lines changed: 71 additions & 71 deletions
Original file line numberDiff line numberDiff line change
@@ -436,27 +436,27 @@ user = {
436436
```
437437

438438

439-
A call to `user.checkPassword()` gets proxied `user` as `this` (the object before dot becomes `this`), so when it tries to access `this._password`, the `get` trap activates (it triggers on any property read) and throws an error.
439+
Un'invocazione di `user.checkPassword()` passerà al proxy `user` come `this` (l'oggetto prima del punto diventa `this`), quindi quando proverà ad accedere a `this._password`, la trappola `get` si attiverà (vieni innescata alla lettura di qualsiasi proprietà) e genererà un errore.
440440

441-
So we bind the context of object methods to the original object, `target`, in the line `(*)`. Then their future calls will use `target` as `this`, without any traps.
441+
Quindi leghiamo il contesto dei metodi dell'oggetto all'oggetto originale, `target`, alla riga `(*)`. Le future invocazioni utilizzeranno `target` come `this`, senza alcuna trappola.
442442

443-
That solution usually works, but isn't ideal, as a method may pass the unproxied object somewhere else, and then we'll get messed up: where's the original object, and where's the proxied one?
443+
Questa soluzione solitamenete funziona, ma non è ideale, poiché un metodo potrebbe passare l'oggetto senza proxy ovunque, e a quel punto faremmo un errore: dov'è l'oggetto originale, e dov'è quello con il proxy?
444444

445-
Besides, an object may be proxied multiple times (multiple proxies may add different "tweaks" to the object), and if we pass an unwrapped object to a method, there may be unexpected consequences.
445+
Oltretutto, un oggetto potrebbe essere racchiuso in più proxy (più proxy potrebbero aggiungere diverse funzionalità all'oggetto), e nel caso in cui passassimo un oggettto senza proxy ad un metodo, potremmo ottenere conseguenze inaspettate.
446446

447-
So, such a proxy shouldn't be used everywhere.
447+
Quindi, un proxy del genere non dovrebbe essere utilizzato ovunque.
448448

449-
```smart header="Private properties of a class"
450-
Modern JavaScript engines natively support private properties in classes, prefixed with `#`. They are described in the article <info:private-protected-properties-methods>. No proxies required.
449+
```smart header="Proprietà private di una classe"
450+
I motori JavaScript moderni, offrono un supporto nativo per le proprietà private nelle classi, aggiungendo il prefisso `#`. Questi sono descritti nell'articolo <info:private-protected-properties-methods>. Non è richiesto alcun proxy.
451451
452-
Such properties have their own issues though. In particular, they are not inherited.
452+
Anche se questo genere di proprietà hanno i loro problemi. In particolare, questi non vengono ereditati.
453453
```
454454

455-
## "In range" with "has" trap
455+
## "In range" con la trappola "has"
456456

457-
Let's see more examples.
457+
Vediamo altri esempi.
458458

459-
We have a range object:
459+
Abbiamo un oggetto `range`:
460460

461461
```js
462462
let range = {
@@ -465,16 +465,16 @@ let range = {
465465
};
466466
```
467467

468-
We'd like to use the `in` operator to check that a number is in `range`.
468+
Vorremmo usare l'operatore `in` per verificare che un numero appartenga al`range`.
469469

470-
The `has` trap intercepts `in` calls.
470+
La trappola `has` intercetta le invocazioni di `in`.
471471

472472
`has(target, property)`
473473

474-
- `target` -- is the target object, passed as the first argument to `new Proxy`,
475-
- `property` -- property name
474+
- `target` -- è l'oggetto target, passanto come primo argomento in `new Proxy`,
475+
- `property` -- nome della proprietà
476476

477-
Here's the demo:
477+
Qui vediamo la demo:
478478

479479
```js run
480480
let range = {
@@ -496,27 +496,27 @@ alert(50 in range); // false
496496
*/!*
497497
```
498498

499-
Nice syntactic sugar, isn't it? And very simple to implement.
499+
Semplice zucchero sintattico, vero? Molto semplice da implementare.
500500

501-
## Wrapping functions: "apply" [#proxy-apply]
501+
## Wrapping con funzioni: "apply" [#proxy-apply]
502502

503-
We can wrap a proxy around a function as well.
503+
Possiamo costruire un proxy anche per funzioni.
504504

505-
The `apply(target, thisArg, args)` trap handles calling a proxy as function:
505+
La trappola `apply(target, thisArg, args)` gestisce l'invocazinone di un proxy come funzione:
506506

507-
- `target` is the target object (function is an object in JavaScript),
508-
- `thisArg` is the value of `this`.
509-
- `args` is a list of arguments.
507+
- `target` è l'oggetto target (le funzioni sono oggetti in JavaScript),
508+
- `thisArg` è il valore di `this`.
509+
- `args` è la lista degli argomenti.
510510

511-
For example, let's recall `delay(f, ms)` decorator, that we did in the article <info:call-apply-decorators>.
511+
Ad esempio, il decorator `delay(f, ms)`, che abbiamo sviluppato nell'articolo <info:call-apply-decorators>.
512512

513-
In that article we did it without proxies. A call to `delay(f, ms)` returned a function that forwards all calls to `f` after `ms` milliseconds.
513+
In quell'articolo lo abbiamo fatto senza proxy. Un'invocazione di `delay(f, ms)` ritornava una funzione che inoltra le chiamate di `f` dopo `ms` millisecondi.
514514

515-
Here's the previous, function-based implementation:
515+
Qui vediamo la precendente implementazione, basata sulla funzione:
516516

517517
```js run
518518
function delay(f, ms) {
519-
// return a wrapper that passes the call to f after the timeout
519+
// ritorna un wrapper che invoca f dopo il timeout
520520
return function() { // (*)
521521
setTimeout(() => f.apply(this, arguments), ms);
522522
};
@@ -526,15 +526,15 @@ function sayHi(user) {
526526
alert(`Hello, ${user}!`);
527527
}
528528

529-
// after this wrapping, calls to sayHi will be delayed for 3 seconds
529+
// dopo il wrapping, le invocazion di sayHi verranno ritardate di 3 secondi
530530
sayHi = delay(sayHi, 3000);
531531

532-
sayHi("John"); // Hello, John! (after 3 seconds)
532+
sayHi("John"); // Hello, John! (dopo 3 secondi)
533533
```
534534

535-
As we've seen already, that mostly works. The wrapper function `(*)` performs the call after the timeout.
535+
Come abbiamo già visto, questo approccio funziona. La funzione wrapper `(*)` esegue l'invocazione dopo il timeout.
536536

537-
But a wrapper function does not forward property read/write operations or anything else. After the wrapping, the access is lost to properties of the original functions, such as `name`, `length` and others:
537+
Ma una funzione wrapepr non esegue l'inoltro delle operazioni di lettura/scrittura o altro di simile. Dopo il wrapping, l'accesso alle proprietà della funzione originale è perso, come `name`, `length` e altri:
538538

539539
```js run
540540
function delay(f, ms) {
@@ -548,19 +548,19 @@ function sayHi(user) {
548548
}
549549

550550
*!*
551-
alert(sayHi.length); // 1 (function length is the arguments count in its declaration)
551+
alert(sayHi.length); // 1 (la lunghezza della funzione è il numero degli argomenti nella sua dichiarazione)
552552
*/!*
553553

554554
sayHi = delay(sayHi, 3000);
555555

556556
*!*
557-
alert(sayHi.length); // 0 (in the wrapper declaration, there are zero arguments)
557+
alert(sayHi.length); // 0 (nella dichiarazione del wrapper, ci sono zero argomenti)
558558
*/!*
559559
```
560560

561-
`Proxy` is much more powerful, as it forwards everything to the target object.
561+
Il `proxy` è molto più potente, poiché inoltra tutto all'oggeto target.
562562

563-
Let's use `Proxy` instead of a wrapping function:
563+
Utiizziamo il `Proxy` piuttosto della funzione di wrapping:
564564

565565
```js run
566566
function delay(f, ms) {
@@ -578,37 +578,37 @@ function sayHi(user) {
578578
sayHi = delay(sayHi, 3000);
579579

580580
*!*
581-
alert(sayHi.length); // 1 (*) proxy forwards "get length" operation to the target
581+
alert(sayHi.length); // 1 (*) il proxy inoltra l'operazione "get length" all'oggetto target
582582
*/!*
583583

584584
sayHi("John"); // Hello, John! (after 3 seconds)
585585
```
586586

587-
The result is the same, but now not only calls, but all operations on the proxy are forwarded to the original function. So `sayHi.length` is returned correctly after the wrapping in the line `(*)`.
587+
Il risultato è lo stesso, ma ora non viene inoltrata solamente l'invocazione, anche tutte le altre operazioni sul proxy vengono inoltrate alla funzione originale. Quindi `sayHi.length` viene ritornato correttamente dopo il wrapping alla riga `(*)`.
588588

589-
We've got a "richer" wrapper.
589+
Abbiamo ottenuto un wrapper più "ricco".
590590

591-
Other traps exist: the full list is in the beginning of this article. Their usage pattern is similar to the above.
591+
Esistono altre trappole: la lista completa la puoi trovare all'inizio di questo articolo. Il loro utilizzo è molto simile a quanto scritto sopra.
592592

593593
## Reflect
594594

595-
`Reflect` is a built-in object that simplifies creation of `Proxy`.
595+
`Reflect` è un oggetto integrato che semplifica la creazione di `Proxy`.
596596

597-
It was said previously that internal methods, such as `[[Get]]`, `[[Set]]` and others are specification-only, they can't be called directly.
597+
Come detto in precedenza, i metodi interni, come `[[Get]]`, `[[Set]]` e altri, esistono solamente nelle specifiche, non possono essere invocati direttamente.
598598

599-
The `Reflect` object makes that somewhat possible. Its methods are minimal wrappers around the internal methods.
599+
L'oggetto `Reflect` lo rende in qualche modo possibile. I suoi metodi sono dei wrapper dei metodi interni.
600600

601-
Here are examples of operations and `Reflect` calls that do the same:
601+
Qui vediamo degli esempi di operazioni e invocazioni di `Reflect` che fanno questo:
602602

603-
| Operation | `Reflect` call | Internal method |
603+
| Operazione | invocazione `Reflect` | Metodo interno |
604604
|-----------------|----------------|-------------|
605605
| `obj[prop]` | `Reflect.get(obj, prop)` | `[[Get]]` |
606606
| `obj[prop] = value` | `Reflect.set(obj, prop, value)` | `[[Set]]` |
607607
| `delete obj[prop]` | `Reflect.deleteProperty(obj, prop)` | `[[Delete]]` |
608608
| `new F(value)` | `Reflect.construct(F, value)` | `[[Construct]]` |
609609
| ... | ... | ... |
610610

611-
For example:
611+
Ad esempio:
612612

613613
```js run
614614
let user = {};
@@ -618,13 +618,13 @@ Reflect.set(user, 'name', 'John');
618618
alert(user.name); // John
619619
```
620620

621-
In particular, `Reflect` allows us to call operators (`new`, `delete`...) as functions (`Reflect.construct`, `Reflect.deleteProperty`, ...). That's an interesting capability, but here another thing is important.
621+
In particolare, `Reflect` ci consente di invocare operatori (`new`, `delete`...) come funzioni (`Reflect.construct`, `Reflect.deleteProperty`, ...). Questa è una caratteristica interessante, ma qui vediamo un'altra cosa molto importante.
622622

623-
**For every internal method, trappable by `Proxy`, there's a corresponding method in `Reflect`, with the same name and arguments as the `Proxy` trap.**
623+
**Per ogni metodo interno, a cui possiamo aggiungere una trappola con il `Proxy`, abbiamo un metodo corrispondente in `Reflect`, con lo stesso nome e gli stessi argomenti della trappola `Proxy`.**
624624

625-
So we can use `Reflect` to forward an operation to the original object.
625+
Quindi possiamo utilizzare `Reflect` per inoltrare un operazione all'oggetto originale.
626626

627-
In this example, both traps `get` and `set` transparently (as if they didn't exist) forward reading/writing operations to the object, showing a message:
627+
In questo esempio, entrambe le trappole `get` e `set` inoltrano in maniera trasparente (come se non esistessero) le operazioni di lettura/scrittura all'oggetto, mostrando il messaggio:
628628

629629
```js run
630630
let user = {
@@ -646,26 +646,26 @@ user = new Proxy(user, {
646646
}
647647
});
648648

649-
let name = user.name; // shows "GET name"
650-
user.name = "Pete"; // shows "SET name=Pete"
649+
let name = user.name; // mostra "GET name"
650+
user.name = "Pete"; // mostra "SET name=Pete"
651651
```
652652

653-
Here:
653+
Qui:
654654

655-
- `Reflect.get` reads an object property.
656-
- `Reflect.set` writes an object property and returns `true` if successful, `false` otherwise.
655+
- `Reflect.get` legge una proprietà di un oggetto.
656+
- `Reflect.set` scrive una proprietà di un oggetto e ritorna `true` se quest avviene con succesos, `false` altrimenti.
657657

658-
That is, everything's simple: if a trap wants to forward the call to the object, it's enough to call `Reflect.<method>` with the same arguments.
658+
Questo è tutto, piuttosto semplice: se una trappola vuole inoltrare l'invocazione all'oggetto, è sufficiente invocare `Reflect.<method>` con gli stessi argomenti.
659659

660-
In most cases we can do the same without `Reflect`, for instance, reading a property `Reflect.get(target, prop, receiver)` can be replaced by `target[prop]`. There are important nuances though.
660+
In molti casi, possiamo ottenere lo stesso risultato senza `Reflect`, ad esempio, la lettura di una proprietà `Reflect.get(target, prop, receiver)` può essere sostituita da `target[prop]`. Ci sono però delle sfumature importanti.
661661

662-
### Proxying a getter
662+
### Creare un proxy per un getter
663663

664-
Let's see an example that demonstrates why `Reflect.get` is better. And we'll also see why `get/set` have the third argument `receiver`, that we didn't use before.
664+
Vediamo un esempio che dimostra perché `Reflect.get` è migliore. E vedremo anche perché `get/set` possiede il terzo argomento `receiver`, che non abbiamo utilizzato finora.
665665

666-
We have an object `user` with `_name` property and a getter for it.
666+
Abbiamo un oggetto `user` con la proprietà `_name` ed il relativo getter.
667667

668-
Here's a proxy around it:
668+
Costruiamo un proxy:
669669

670670
```js run
671671
let user = {
@@ -686,11 +686,11 @@ let userProxy = new Proxy(user, {
686686
alert(userProxy.name); // Guest
687687
```
688688

689-
The `get` trap is "transparent" here, it returns the original property, and doesn't do anything else. That's enough for our example.
689+
La trappola `get` è "trasparente" in questo caso, ritorna la proprietà originale, e non fa nient'altro. Questo è sufficiente per il nostro esempio.
690690

691-
Everything seems to be all right. But let's make the example a little bit more complex.
691+
Tutto sembra funzionare correttamente. Ma rendiamo l'esempio leggermente più complesso.
692692

693-
After inheriting another object `admin` from `user`, we can observe the incorrect behavior:
693+
Dopo aver ereditato con un oggetto `admin` da `user`, possiamo osservare un comportamento non corretto:
694694

695695
```js run
696696
let user = {
@@ -712,22 +712,22 @@ let admin = {
712712
_name: "Admin"
713713
};
714714

715-
// Expected: Admin
715+
// Risultato atteso: Admin
716716
alert(admin.name); // outputs: Guest (?!?)
717717
*/!*
718718
```
719719

720-
Reading `admin.name` should return `"Admin"`, not `"Guest"`!
720+
La lettura di `admin.name` dovrebbe ritornare `"Admin"`, non `"Guest"`!
721721

722-
What's the matter? Maybe we did something wrong with the inheritance?
722+
Qual'è il problema? Magari abbiamo sbagliato qualcosa con l'ereditarietà?
723723

724-
But if we remove the proxy, then everything will work as expected.
724+
Ma se rimuoviamo il proxy, tutto funziona correttamente.
725725

726-
The problem is actually in the proxy, in the line `(*)`.
726+
Il problema sta quindi nel proxy, alla riga `(*)`.
727727

728-
1. When we read `admin.name`, as `admin` object doesn't have such own property, the search goes to its prototype.
729-
2. The prototype is `userProxy`.
730-
3. When reading `name` property from the proxy, its `get` trap triggers and returns it from the original object as `target[prop]` in the line `(*)`.
728+
1. Quando leggiamo `admin.name`, poiché l'oggetto `admin` non possiede questa proprietà, la ricerca prosegue nel suo prototype.
729+
2. Il prototype è `userProxy`.
730+
3. Durante la lettura della proprietà `name` dal proxy, la trappola `get` viene innescata e ritorna la proprietà dell'oggetto originale `target[prop]` alla riga `(*)`.
731731

732732
A call to `target[prop]`, when `prop` is a getter, runs its code in the context `this=target`. So the result is `this._name` from the original object `target`, that is: from `user`.
733733

0 commit comments

Comments
 (0)