Mi chiedevo se potevo rilevare se il browser client sono compatibili con ES2015. E se no, includerei semplicemente la mia vecchia libreria JS .
Non puoi farlo, semplicemente perché per quanto ne so non c'è browser che supporti pienamente ES2015. Inoltre, non vuoi veramente mantenere due diverse versioni del tuo codice, perché è doloroso e potrebbe diventare molto veloce.
L'approccio al giorno d'oggi è quello di utilizzare un transpiler, che è una specie di un compilatore che compila il codice ES2015 per ES5 (il JavaScript che tutti i browser lo sa). È ancora un po 'disordinato, ma almeno puoi scrivere solo una versione del tuo codice, ed è ES2015.
Penso che Babel (in precedenza 6to5) è il traspiatore più popolare. Puoi controllare il loro sito Web per iniziare.
Come per rispondere alla tua domanda attuale,
Come rilevare se il browser è compatibile con ES2015
Si può fare in molti modi. Non sono sicuro di quello che potrebbe essere il più affidabile, ma per esempio si può semplicemente provare console del browser:
'Promise' in window
Se questa affermazione ritorna true, quindi il browser corrente supporta promesse, che è una nuova funzione di ES2015, quindi si può supporre che supporti la maggior parte delle funzionalità di ES2015.
questo non è sufficiente per la maggior parte dei casi, però; potresti voler essere sicuro al 100% che quello che stai usando non getterà uno SyntaxError in un browser precedente.
Una soluzione potrebbe essere quella di controllare manualmente ciascuna funzionalità che si desidera utilizzare. Ad esempio, se è necessario l'API Fetch, è possibile creare una funzione che ti dice se il browser corrente supporta:
function isFetchAPIsupported() {
return 'fetch' in window;
}
Si può fare questo per qualsiasi nuova API è necessario.Tuttavia, se avete bisogno di qualcosa sintatticamente diverso, credo che la tua unica scommessa è eval() (come suggerito Katana314). Ad esempio, al fine di verificare il supporto per i parametri di riposo si potrebbe fare:
function isRestSupported() {
try {
eval('function foo(bar, ...rest) { return 1; };');
} catch (error) {
return false;
}
return true;
}
Questa grande opera in Firefox, perché i parametri di riposo sono supportati. Funziona come bene su Safari, tornando false perché i parametri di riposo sono non supportato c'è ancora.
Per ora semplicemente non c'è alcun browser compatibile con l'intera * * ES2015. Vedi https://kangax.github.io/compat-table/es6/ –
Buona domanda. Per i principianti, penso che sarebbe meglio applicarlo come configurazione del gestore delle dipendenze in modo che questo caricasse una versione alternativa di uno script. Per quanto riguarda il rilevamento, mi chiedo se il metodo più semplice sarebbe qualcosa come 'eval (" function (a, b, ... args) {} ");', e controllando un errore di sintassi. Un promemoria, naturalmente, che "la valutazione è cattiva", ma se tenga presente di usarla solo per una stringa inline esatta, potrebbe essere un po 'più sicura. – Katana314
Molte funzionalità di ES6 non possono essere semplicemente polifivate perché è una nuova sintassi, quindi è necessario disporre di due versioni di tutto il codice; una versione ES6 e una versione Legacy (forse compilata dalla versione ES6 usando Babel?). Il rilevamento delle funzioni dovrebbe essere eseguito in 'try..catch' perché se non è supportato ** causerà ** errori di lancio. Potresti invece portare il codice su ES5 con gli shim, tuttavia, il che significherebbe che hai una sola base di codice. –