பாலிஃபில்கள் மற்றும் டிரான்ஸ்பைலர்கள் (Polyfills and Transpilers)

ஜாவாஸ்கிரிப்ட் அவ்வப்போது உருவாகிறது. தொடர்ந்து, புதிய மொழி முன்மொழிவுகள் (proposals) சமர்ப்பிக்கப்பட்டு, பகுப்பாய்வு செய்யப்பட்டு, https://tc39.github.io/ecma262/ இல் சேர்க்கப்பட்டு பின்னர் விவரக்குறிப்பில் (specification) இணைக்கப்படுகின்றன. உலாவியைப் (browser) பொறுத்து ஜாவாஸ்கிரிப்ட் இயந்திரங்களில் (engines) அது எவ்வாறு செயல்படுத்தப்படுகிறது என்பதில் வேறுபாடுகள் இருக்கலாம். சிலர் வரைவு முன்மொழிவுகளைச் (draft proposals) செயல்படுத்தலாம், மற்றவர்கள் முழு விவரக்குறிப்பு வெளியாகும் வரை காத்திருக்கலாம். புதிய விஷயங்கள் அறிமுகப்படுத்தப்படும்போது பின்தங்கிய இணக்கத்தன்மை (Backward compatibility) சிக்கல்கள் எழுகின்றன.

பழைய உலாவிகளில் நவீன குறியீட்டை ஆதரிக்க நாம் இரண்டு கருவிகளைப் பயன்படுத்துகிறோம்: transpilers மற்றும் polyfills.

டிரான்ஸ்பைலர்கள் (Transpilers)

இது நவீன குறியீட்டை மொழிபெயர்க்கும் ஒரு நிரலாகும் (program) மற்றும் பழைய தொடரியல் கட்டமைப்புகளைப் (syntax constructs) பயன்படுத்தி அதை மீண்டும் எழுதுகிறது, இதனால் பழைய இயந்திரம் அதைப் புரிந்து கொள்ள முடியும். உதாரணமாக, "nullish coalescing operator" ?? 2020 இல் அறிமுகப்படுத்தப்பட்டது, மேலும் காலாவதியான உலாவிகளால் (outdated browsers) அதைப் புரிந்து கொள்ள முடியாது.

இப்போது, nullish coalescing operator" ?? ஐப் பழைய உலாவிகளுக்குப் புரியும் வகையில் செய்வது டிரான்ஸ்பைலரின் வேலையாகும்.

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

// after running the transpiler
height = (height !== undefined && height !== null) ? height: 200;

பாலிஃபில்கள் (Polyfills)

காலாவதியான உலாவி இயந்திரங்களில் புதிய செயல்பாடுகள் கிடைக்காத நேரங்களும் உள்ளன. இந்த நிலையில், புதிய செயல்பாட்டைப் பயன்படுத்தும் குறியீடு இயங்காது. இடைவெளிகளை நிரப்ப, காணாமல் போன செயல்பாட்டைச் சேர்க்கிறோம், இது polyfill என்று அழைக்கப்படுகிறது. எடுத்துக்காட்டாக, filter() முறை ES5 இல் அறிமுகப்படுத்தப்பட்டது மற்றும் சில பழைய உலாவிகளில் ஆதரிக்கப்படவில்லை. இந்த முறை ஒரு செயல்பாட்டை (function) ஏற்றுக்கொள்கிறது மற்றும் செயல்பாடு true என்று திருப்பித் தரும் அசல் வரிசையின் (original array) மதிப்புகளை மட்டுமே கொண்ட வரிசையைத் திருப்பித் தருகிறது.

const arr = [1, 2, 3, 4, 5, 6];
const filtered = arr.filter((e) => e % 2 === 0); // filter outs the even number
console.log(filtered);

// [2, 4, 6]

வடிகட்டிக்கான (filter) பாலிஃபில் கீழே கொடுக்கப்பட்டுள்ளது.

Array.prototype.filter = function (callback) {
  // Store the new array
  const result = [];
  for (let i = 0; i < this.length; i++) {
    // call the callback with the current element, index, and context.
    //if it passes the test then add the element in the new array.
    if (callback(this[i], i, this)) {
      result.push(this[i]);
    }
  }
  //return the array
  return result
}