Skip to main content

Polyfills & Transpilers

Code Quality: Polyfills & Transpilers

Describe what a JavaScript Trans-piler does?

View Answer:
Interview Response: A transpiler is a unique piece of software that can parse ("read and understand") modern code and rewrite it using older syntax constructs so that the result would be the same.

Code Example:

// before running the transpiler
height = height ?? 100;

// after running the transpiler
height = height !== undefined && height !== null ? height : 100;
note

Before 2020, JavaScript did not have a nullish coalescing operator (??). We needed a piece of software to convert it into workable code for older browsers to do work.


What is a Polyfill in JavaScript?

View Answer:
Interview Response: A polyfill fills the gaps where newer JavaScript features may not be compatible with older browsers.

Code Example: Polyfill if Math.trunc function does not exist in an older engine.

if (!Math.trunc) {
// if no such function
// implement it
Math.trunc = function (number) {
// Math.ceil and Math.floor exist even in ancient JavaScript engines
// they are covered later in the tutorial
return number < 0 ? Math.ceil(number) : Math.floor(number);
};
}