BabelJS - ES5'e Transpile ES8 özellikleri

Dize doldurma, javascript'e eklenen yeni ES8 özelliğidir. Babel kullanarak ES5'e dize dolgusu aktaracak basit bir örnek üzerinde çalışacağız.

Dize Dolgu

Dize dolgusu, belirtilen uzunluğa göre sol taraftan başka bir dize ekler. Dize doldurma sözdizimi aşağıda gösterildiği gibidir -

Sözdizimi

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

Misal

const str = 'abc';

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

Çıktı

_____abc
abc_____

ES8 - Dize Dolgu

const str = 'abc';

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

komut

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, '_'));

Js, babel-polyfill ile birlikte aşağıda gösterildiği gibi kullanılmalıdır -

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>