【问题标题】:Is there a polyfill for es6 arrow function?es6 箭头函数有 polyfill 吗?
【发布时间】:2018-03-03 23:56:34
【问题描述】:

es6 箭头函数有polyfill 吗?

以下代码在IE中抛出语法错误异常,有没有polyfill让IE支持箭头函数?

var myFunc = ()=>{
    alert('es6');
}
myFunc();

注意:我不想使用任何transpiler

提前致谢

【问题讨论】:

  • 这种特性不能被polifill。
  • transpiler 存在的原因是为了解决 polyfills 无法解决的问题。避免它们的动机是什么?
  • 我有一个现有的代码(遍布企业应用程序)正在创建/更改我这么多的开发人员。所以我希望无缝地允许开发人员使用 es6 功能。

标签: javascript jquery node.js ecmascript-6 ecmascript-5


【解决方案1】:

polyfill 可以添加或修复缺失的内置类、函数、对象……但它不能修改编译器接受的语法。

【讨论】:

  • 类也是新语法 ;)
  • 我不同意,创建新变量不是添加新语法
  • class Foo {} 不能被不支持类的浏览器解析。但是现在我重读了这篇文章,我猜你的意思是添加内置类的功能(虽然我不确定是否有)?总的来说,我认为简单地说 polyfills 可以添加/修复 APIs 就不那么令人困惑了。
  • 对于类,我不是指类糖语法,而是添加新的类,例如 Promise,例如
【解决方案2】:

箭头函数没有 polyfill。除非您使用转译器,否则编写您拥有的代码是语法错误。

【讨论】:

    【解决方案3】:

    添加新语法的功能不能被 polyfill。

    我只能想到 babel-standalone,您可以将其视为 JIT 编译器/转译器(如果您同意的话)。

    【讨论】:

      【解决方案4】:

      我对 JS 很熟悉,所以我觉得这可能不符合 polyfill 的要求……但它似乎确实是一个“胶带”的权宜之计。我发现由Luis Perez 制作的a fiddle 提供了此功能。我仍在努力更好地理解箭头功能,但它至少可以与MDN arrow function examples 之一一起使用。这是在玩过之后我设法理解(至少更好)lol的sn-p。我希望它对某人有用。

      var str = [
        'Hydrogen',
        'Helium',
        'Lithium',
        'Beryllium'
      ];
      
      var g_arrowCache = Object.create(null);
      function arrow(expression) {
        function cache(cache, key, getValueFunc) {
          var value = cache[key];
          
          if(value === undefined) {
              value = getValueFunc(key);
              cache[key] = value;
          }
          return value;
        }
        
        function arrowImpl(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;
        }
        return cache(g_arrowCache, expression, arrowImpl);
      }
      var _$ = arrow;
      console.log(str.map(_$("str => str.length")));

      【讨论】:

        猜你喜欢
        • 2019-01-06
        • 1970-01-01
        • 2019-12-17
        • 2016-09-07
        • 2022-01-21
        • 2016-03-25
        • 2016-08-06
        相关资源
        最近更新 更多