BabelJS - คุณสมบัติ Transpile ES8 เป็น ES5
String padding เป็นคุณลักษณะ ES8 ใหม่ที่เพิ่มเข้ามาในจาวาสคริปต์ เราจะดำเนินการตามตัวอย่างง่ายๆซึ่งจะทำให้การขยายสตริงไปยัง ES5 โดยใช้ Babel
ช่องว่างสตริง
ช่องว่างของสตริงจะเพิ่มสตริงอื่นจากด้านซ้ายตามความยาวที่ระบุ ไวยากรณ์สำหรับการขยายสตริงมีดังที่แสดงด้านล่าง -
ไวยากรณ์
str.padStart(length, string);
str.padEnd(length, string);
ตัวอย่าง
const str = 'abc';
console.log(str.padStart(8, '_'));
console.log(str.padEnd(8, '_'));
เอาต์พุต
_____abc
abc_____
ES8 - ช่องว่างภายในสตริง
const str = 'abc';
console.log(str.padStart(8, '_'));
console.log(str.padEnd(8, '_'));
คำสั่ง
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 ดังที่แสดงด้านล่าง -
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>