Question

在ES5中我们都可以这样做：

myClass.prototype.myMethod = (function () {return function() {}})();

我能用ES6类文字做同样的技巧吗？

Answer 1

不，至少还没有。 ES6类仅支持声明方法，因此任何不直接作为方法的东西（包括间接评估方法的东西，如IIFE）仍必须使用原型声明。

但是，ES6类的工作方式与ES5构造函数的工作原理相同，只是语法更清晰，所以你仍然可以这样做：

class MyClass {
  constructor() {
    /* initialize */
  }

  regularMethod() {
    /* some stuff */
  }
}

MyClass.prototype.myMethod = (function() { return function() })()

这相当于：

function MyClass() {
  /* initialize */
}

MyClass.prototype.regularMethod = function() {
  /* some stuff */
}

MyClass.prototype.myMethod = (function() { return function() })()

Answer 2

可以装饰一个装饰者：

function iife(target, key, { value: fn, configurable, enumerable }) {
  return {
    configurable,
    enumerable,
    value: fn(),
  };
}

并使用它：

class MyClass {
  @iife
  methodName() {
    /* some stuff */
    return function() {
      /* real method content */
    }
  }
}

如果我需要一些重载的临时变量，比如我不想为每个方法调用创建一个向量矩阵，我会使用它。

Answer 3

2019更新

是，您可以做到。

您只需要像“函数表达式”一样创建IIFE（将其分配给变量）

class MyClass {

  IIFE = (() => {

    let textArrayCreatedJustOnce = ['text A', 'text B', 'text C'];
    console.log('Only called in object creation');


    return () => {
      console.log(textArrayCreatedJustOnce[1]);
    }

  })()

}


let myClassInstance = new MyClass(); //log: 'Only called in object creation' 


myClassInstance.IIFE(); //log: 'text B'
myClassInstance.IIFE(); //log: 'text B'
myClassInstance.IIFE(); //log: 'text B'

Answer 4

不，类文字不能包含IIFE，它们需要包含方法声明。

虽然在使用myClass关键字声明class之后，您可以在ES6中使用相同的作业。但是，根本没有任何理由在ES6中使用IIFE，因为它们通常可以被块作用域或模块替换。

Answer 5

@ juanma-menendez的2019年答案很有趣，尽管我有一些疑问和未解决的问题。

第一个问题是它使用箭头功能。箭头函数处理调用上下文的方式与普通函数表达式不同。另外，据我所知，他们不支持递归。

第二个问题是它从不尝试使用this关键字。

目前尚不清楚此语法糖浆中的调用上下文是什么。

尝试不成功后，我在Google Chrome中成功进行了以下设置。此示例说明可以从返回的方法访问私有属性和对象属性，并且可以在多个实例中使用它。

class C {
    constructor(attr) {
        this.attr = attr;
    }
    IIFE = function() {
        const privateArray = ["A", "B", "C"];
        console.log("Created private array during object creation.");

        return function() {
            console.log("privateArray[1] = %s", privateArray[1]);
            console.log("this.attr = ", this.attr);
        }//.bind(this);
    }.call(this);
}

var obj1 = new C("asdf");
console.log(obj1.IIFE());
console.log(obj1.IIFE());
var obj2 = new C("ghjk");
console.log(obj2.IIFE());

输出（未定义为返回值）：

Created private array during object creation.
privateArray[1] = B
this.attr =  asdf
undefined
privateArray[1] = B
this.attr =  asdf
undefined
Created private array during object creation.
privateArray[1] = B
this.attr =  ghjk
undefined

我必须承认我不明白为什么.bind(this)是错的。我还为私有数组是为每个实例创建的，而不是仅存在于原型中而感到困惑。我不是100％确定这等同于使用IIFE制作的原型方法。

无论如何，这可能对于部署来说可能有点太高科技了，因为许多最终用户将拥有2019年前的浏览器。另外，我还没有测试性能。使用风险自负！：-）

ES6类文字中的IIFE

5 个答案: