ES6类文字中的IIFE
Posted
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了ES6类文字中的IIFE相关的知识，希望对你有一定的参考价值。
在ES5中我们都可以这样做：
myClass.prototype.myMethod = (function () {return function() {}})();
我能用ES6类文字做同样的技巧吗？
不，至少还没有。 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() })()
可以装饰一个装饰者：
function iife(target, key, { value: fn, configurable, enumerable }) {
return {
configurable,
enumerable,
value: fn(),
};
}
并使用它像：
class MyClass {
@iife
methodName() {
/* some stuff */
return function() {
/* real method content */
}
}
}
我使用它，如果我需要一些重的临时变量，如矢量矩阵，我不想为每个方法调用crate。
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'不，类文字不能包含IIFE，它们需要包含方法声明。
虽然在使用myClass关键字声明class后，您可以在ES6中使用相同的赋值。但是，根本没有任何理由在ES6中使用IIFE，因为它们通常可以被块作用域或模块替换。
来自@ juanma-menendez的2019年答案很有意思，虽然我留下了一些疑问和未解答的问题。
第一个问题是它使用箭头功能。 Arrow函数以不同于普通函数表达式的方式处理调用此外，他们不支持递归（据我所知）。
第二个问题是它从不尝试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());
输出（undefined是返回值）：
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的主要内容，如果未能解决你的问题，请参考以下文章