Vai al contenuto principale

Sintassi di Function Bind

· Lettura di 3 min
Traduzione Beta Non Ufficiale

Questa pagina è stata tradotta da PageTurner AI (beta). Non ufficialmente approvata dal progetto. Hai trovato un errore? Segnala problema →

Babel 5.4 è appena stato rilasciato e introduce il supporto per una nuova sintassi ES7 sperimentale proposta da Kevin Smith (@zenparsing) e implementata in Babel da Ingvar Stepanyan (@RReverser).

Attenzione: Questa sintassi è altamente sperimentale e non dovrebbe essere utilizzata per progetti critici (al momento). Se decidi di usarla, per favore fornisci feedback su GitHub.

La sintassi function bind introduce un nuovo operatore :: che esegue il binding di funzioni e l'estrazione di metodi.

Metodi Virtuali

Utilizzando una libreria iteratore implementata come modulo di "metodi virtuali":

JavaScript
/* ES7 */
import { map, takeWhile, forEach } from "iterlib";

getPlayers()
::map(x => x.character())
::takeWhile(x => x.strength > 100)
::forEach(x => console.log(x));
JavaScript
/* ES6 */
import { map, takeWhile, forEach } from "iterlib";

let _val;
_val = getPlayers();
_val = map.call(_val, x => x.character());
_val = takeWhile.call(_val, x => x.strength > 100);
_val = forEach.call(_val, x => console.log(x));

Nota: L'output di Babel appare diverso per essere più conciso.

Utilizzando una libreria di metodi virtuali simile a jQuery:

JavaScript
/* ES7 */
// Create bindings for just the methods that we need
let { find, html } = jake;

// Find all the divs with class="myClass", then get all of the
// "p"s and replace their content.
document.querySelectorAll("div.myClass")::find("p")::html("hahaha");
JavaScript
/* ES6 */
let _val;
_val = document.querySelectorAll("div.myClass");
_val = find.call(_val, "p");
_val = html.call(_val, "hahaha");

Estrazione di Metodi

Utilizzando l'estrazione di metodi per stampare il valore finale di una promise sulla console:

JavaScript
/* ES7 */
Promise.resolve(123).then(::console.log);
JavaScript
/* ES6 */
// Which could be written in ES6 as:
Promise.resolve(123).then(console.log.bind(console));

Utilizzando l'estrazione di metodi per chiamare un metodo di oggetto quando si verifica un evento DOM:

JavaScript
/* ES7 */
$(".some-link").on("click", ::view.reset);
JavaScript
/* ES6 */
$(".some-link").on("click", view.reset.bind(view));

Nota: Puoi approfondire questa sintassi nella proposta Function Bind Syntax.

Utilizzo

Abilitazione per stage:

Shell
$ babel --stage 0

Abilitazione tramite transformer:

Shell
$ babel --optional es7.functionBind

La sintassi function bind entrerà in ES7 solo se ci sarà sufficiente interesse. Se desideri che questa sintassi venga inclusa, per favore aggiungi una stella su GitHub e fornisci qualsiasi feedback tramite le issue GitHub.

Un ringraziamento speciale a Ingvar Stepanyan (@RReverser) per l'implementazione in Babel.

— The Babel team