如何在Javascript中使用MVC实现模型

-1

这可能是一个简单而愚蠢的问题，但我在此处不知所措。我们的教授要求我们创建一个使用MVC的游戏（在我的例子中是Sudoku）。视图和控制器可以作为一个js文件使用（因为我们正在弄湿我们的脚），并且模型必须位于单独的js文件中。我能够使视图工作得很好，但是当我尝试在模型中使用某些东西时......我不知道如何调用模型文件（数组或包含要输入的值的81个元素数独网格）。任何帮助，阅读或视频将不胜感激。谢谢。如何在Javascript中使用MVC实现模型

来源

2015-10-05 ManiacalTeddy

使用angularJs为MVC –

在角的应用中，视图是文档对象模型（DOM），控制器是JavaScript类，和模型数据被存储在对象属性。

AngularJs Learning

来源

2015-10-05 05:58:32

https://xkcd.com/1343/双向绑定 – Nils

这是我MVC在Javascript中了解下。这可能是错误的。

function Model() { 
 
    this.state=0; 
 
    this.observers=[] 
 
    this.addObserver = function(observer) { 
 
     
 
     // i, the model, have no idea what this observer is. 
 
     this.observers.push(observer); 
 
    } 
 
    this.notifyObservers = function() { 
 
     for (i = 0; i < this.observers.length; i++) { 
 
      
 
      // i, the model, have no idea what this does in the observer. 
 
      this.observers[i].modelChanged(); 
 
     } 
 
    } 
 
    this.doSomethingWithInternalState = function(observer){ 
 
     this.state+=1 
 
     
 
     // i, the model will notify observers when my state changes. 
 
     // They can decide on their own what to do then. 
 
     this.notifyObservers(); 
 
    } 
 
} 
 

 
// That would be views (or mini-models or read-only controllers, whatever). 
 
function Observer() { 
 
    this.init = function(model) { 
 
     this.model=model; 
 
    }; 
 
    this.modelChanged = function(){ 
 
     alert('bazinga'); 
 
    }; 
 
} 
 

 
function SudokuBoard(){ 
 
    this.boardsize=0; 
 
    this.modelChanged = function() { 
 
     if (this.model.state < 10) { 
 
      this.boardsize=this.model.state*20; 
 
      alert(this.boardsize); 
 
     } 
 
    }; 
 
} 
 
SudokuBoard.prototype=new Observer; 
 

 
function MessageWindow(){ 
 
    this.modelChanged = function(){ 
 
     alert('Sudoku is cool'); 
 
    }; 
 
} 
 
MessageWindow.prototype=new Observer; 
 

 
function AnotherGuiElem(){ 
 
    this.bazinga=true; 
 
} 
 
AnotherGuiElem.prototype=new Observer; 
 

 
// that would be a controller. 
 
document.onclick=function(){ 
 
    m.doSomethingWithInternalState(); 
 
    a.bazinga=true; 
 
}; 
 

 
// we have a model, views and one controller, now lets connect everything. 
 
var m = new Model; 
 
var b = new SudokuBoard();b.init(m); 
 
var w = new MessageWindow();w.init(m); 
 
var a = new AnotherGuiElem();a.init(m); 
 
m.addObserver(b); 
 
m.addObserver(w); 
 
m.addObserver(a);

<!DOCTYPE html> 
 
<html> 
 
    <head> 
 
     <title>Test</title> 
 
     <meta charset="utf-8" /> 
 
    </head> 
 
    <body> 
 
     <script src="test.js"></script> 
 
    </body> 
 
</html>

来源

2015-10-05 08:02:46 Nils

如何在Javascript中使用MVC实现模型

回答

相关问题