Question

我在网上找到了这个小部件，我正在尝试学习如何使用最新的ES6风格。 javascript已缩小，但我想它最初是用ES6编写的。

所以它的基本结构如下：

Some_config = {};

(function() {
    var t, e = function(t, e) {
            return function() {
                return t.apply(e, arguments)
            }
        },
        i = [].slice;
    t = function() {
        function t() {
            this.log = e(this.log, this);
            var t;
            t = "undefined" != typeof Some_config && null !== Some_config ? Some_config : {},
            "undefined" != typeof Some_config && null !== Some_config && this.init(t)
        }
        return t.prototype.pushMessage = function(t, e) {
            return null == e && (e = {}), this.elements.frame.contentWindow.postMessage([t, e], "*")
        },
        t.prototype.log = function() {
            if (this.localOptions.debug)
                return console.log("[Debug]", arguments)
        },
        t.prototype.warn = function(t) {
            return console.warn("[Error]", t)
        },
        t.prototype.init = function(t) {
            var e;
            try {
                this.nextInit(t)
            } catch (t) {
                e = t, this.warn(e)
            }
            return this
        },
        t.prototype.nextInit = function(t) {
            console.log('calling nextInit');
        },
        t
    }(), window.SomeApi = new t
}).call(this);

因此，此javascript在浏览器中运行，因此看起来像是立即调用的，但是随后调用了call(this)。最后两行到底发生了什么？

   }(), window.SomeApi = new t
}).call(this);

这种样式对我来说看起来很陌生，这是因为它是从原始ES6样式中缩小的吗？

如果这是作为ES6类编写的，那么它在结构上看起来会是什么样子？我希望它看起来更整洁，并且对我来说更容易学习/构建。 >

class SomeApi {
    constructor() {

    }

    log() {
        if (this.localOptions.debug)
            return console.log("[Debug]", arguments)
    }

    init(t) {
        var e;
        try {
            this.nextInit(t)
        } catch (t) {
            e = t, this.warn(e)
        }
        return this
    }
}

Answer 1

我认为尝试从最小化代码中推断出含义不是解决原始代码的非常有效的方法。

但是，本文可以为您提供帮助

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Comma_Operator

这里真正发生的是，为外部变量t分配了IIFE返回值，该值再次标记为t。然后解析器继续前进，只需将全局变量someApi分配给新的t。先前的外部t称为构造函数。

以下内容也可能有助于澄清问题：

What is the (function() { } )() construct in JavaScript?

https://www.w3schools.com/js/js_function_call.asp

了解简单的javascript小部件结构，并将其编写为ES6类

1 个答案: