如何在 ES6 中实现 MVC javascript？

Question

在 ES5 中，我使用 IIFE 创建了一个模型-视图-控制器结构，并揭示了模块模式。

var model = function () { ... }()
var view = function () { ... }()
var controller = function (model, view) { 
    view.functionname(var one);
    ......
}(model, view)

ES6中新的block scope {}可以替代IIFEs，但是我们如何从controller中调用model/view的functions/methods呢？

为了在 ES5 中组合多个 javascript 并避免命名冲突，我使用了一个表达式：
```
;( code ...)
```

如何在 ES6 中完成此操作？

Answer 1

也许是这样的？

class View {
    exampleMethod() {
        console.log("view's example method called")
    }
}

class Model {
    exampleMethod() {
        console.log("model's example method called")
    }
}

class Controller {
    constructor(view,model) {
        this.view = view
        this.model = model
        console.log("Test")
    }
    exampleMethod() {
        this.view.exampleMethod()
        this.model.exampleMethod()
    }
}

const myView = new View()
const myModel = new Model()

const myController = new Controller(myView,myModel)
myController.exampleMethod()

为了避免 ES6 中的名称冲突，您可以将所有内容包装到

(()=>{
    // Code...
})()

Answer 2

The new block scope in ES6 can replace IIFEs

不是真的。它可以替代仅引入作用域的 IIFE，但不能替代模块模式——块没有 return 值。它也不需要任何参数。您可以只使用全局变量：

var model, view, controller;
{
    model = {…};
}
{
    view = {…};
}
{
    let one = …;
    view.functionname(one);
    controller = {…};
}

但老实说这很奇怪¹。没有理由不使用我们自 ES3 以来就知道的完全相同的揭示模块模式。

_{1: 一个可行的替代方案是 ES6 模块，它允许循环依赖并且有更好的语法}

如何在 ES6 中实现 MVC javascript？

How to do MVC in ES6 javascript?

javascript

ecmascript-6

es6-class

es6-modules