BabelJS - Transpile ES8 fonctionnalités vers ES5

Le remplissage de chaînes est la nouvelle fonctionnalité ES8 ajoutée à javascript. Nous allons travailler sur un exemple simple, qui transpilera le remplissage de chaînes vers ES5 en utilisant babel.

Rembourrage de cordes

Le remplissage de chaîne ajoute une autre chaîne du côté gauche selon la longueur spécifiée. La syntaxe du remplissage de chaîne est la suivante:

Syntaxe

str.padStart(length, string);
str.padEnd(length, string);

Exemple

const str = 'abc';

console.log(str.padStart(8, '_'));
console.log(str.padEnd(8, '_'));

Production

_____abc
abc_____

ES8 - Rembourrage de cordes

const str = 'abc';

console.log(str.padStart(8, '_'));
console.log(str.padEnd(8, '_'));

commander

npx babel strpad.js --out-file strpad_es5.js

Babel - ES5

'use strict';

var str = 'abc';

console.log(str.padStart(8, '_'));
console.log(str.padEnd(8, '_'));

Le js doit être utilisé avec babel-polyfill comme indiqué ci-dessous -

test.html

<!DOCTYPE html>
<html>
   <head>
      <title>BabelJs Testing</title>
   </head>
   <body>
      <script src="node_modules\babel-polyfill\dist\polyfill.min.js" type="text/javascript"></script>
      <script type="text/javascript" src="strpad_es5.js"></script>
   </body>
</html>