Skip to content Skip to sidebar Skip to footer

Is There A Polyfill For Es6 Arrow Function?

Is there a polyfill for es6 arrow function? the following code throws syntax error exception in IE, is there a polyfill to make IE support arrow functions? var myFunc = ()=>{

Solution 1:

A polyfill can add or fix missing built-in classes, functions, objects... but it cannot modify a compiler's accepted syntax.

Solution 2:

There is no polyfill for arrow functions. It is a syntax error to write the code you have unless you use a transpiler.

Solution 3:

Features that add new syntax can not be polyfilled.

I can only think of babel-standalone, which you can think of as a JIT compiler/transpiler (if that is OK with you).

Solution 4:

I'm pretty green with JS so I have a feeling that this may not qualify as a polyfill... but it does seem to be a 'duct tape' stopgap though. I found a fiddle made by Luis Perez that gives this functionality. I'm still working to better understand arrow functions but it at least does work with one of the MDN arrow function examples. Here's the snippet that after playing with I managed to understand (better at least) lol. I hope it is useful to someone.

var str = [
  'Hydrogen',
  'Helium',
  'Lithium',
  'Beryllium'
];

var g_arrowCache = Object.create(null);
functionarrow(expression) {
  functioncache(cache, key, getValueFunc) {
    var value = cache[key];
    
    if(value === undefined) {
        value = getValueFunc(key);
        cache[key] = value;
    }
    return value;
  }
  
  functionarrowImpl(expression) {
    // This function is a polyfill for proposed "arrow functions" in JavaScript.// Example:  str.map(_$("str => str.length"))if (expression.search(/\bthis\b/) != -1) throw"'this' not supported";
    
    var indexOfArrow = expression.indexOf("=>");
    if(indexOfArrow == -1) throw"Expressio is missing the arrow operator =>";
    var parametersString = expression.substring(0, indexOfArrow);
    
    parametersString = parametersString.replace("(", "").replace(")", "");
    
    var parameters = parametersString.split(",");
    parameters.map(function(o) { return o.trim(); });
    
    var functionBody = expression.substring(indexOfArrow + 2);
    
    if(expression.indexOf("{") != -1) throw"Use of curly brackets for multiple statements not supported or recommended.";
    if(expression.indexOf("}") != -1) throw"Use of curly brackets for multiple statements not supported or recommended.";
    
    functionBody = "return " + functionBody.trim() + ";";
    var args = parameters.slice(0);
    args.push(functionBody);
    var func = Function.constructor.apply(null, args);
    return func;
  }
  returncache(g_arrowCache, expression, arrowImpl);
}
var _$ = arrow;
console.log(str.map(_$("str => str.length")));

Post a Comment for "Is There A Polyfill For Es6 Arrow Function?"