如何在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實現模型

回答

相關問題