在 Nashron 中使用 Backbone.js
譯者:飛龍
協(xié)議:CC BY-NC-SA 4.0
這個例子展示了如何在Java8的Nashron JavaScript引擎中使用Backbone.js模型。Nashron在2014年三月首次作為Java SE 8 的一部分發(fā)布,并通過以原生方式在JVM上運(yùn)行腳本擴(kuò)展了Java的功能。對于Java Web開發(fā)者,Nashron尤其實用,因為它可以在Java服務(wù)器上復(fù)用現(xiàn)有的客戶端代碼。傳統(tǒng)的Node.js具有明顯優(yōu)勢,但是Nashorn也能夠縮短JVM的差距。
當(dāng)你在HTML5前端使用現(xiàn)代的JavaScript MVC框架,例如Backbone.js時,越來越多的代碼從服務(wù)器后端移動到Web前端。這個方法可以極大提升用戶體驗,因為在使用視圖的業(yè)務(wù)邏輯時節(jié)省了服務(wù)器的很多往返通信。
Backbone允許你定義模型類,它們可以用于綁定視圖(例如HTML表單)。當(dāng)用戶和UI交互時Backbone會跟蹤模型的升級,反之亦然。它也能通過和服務(wù)器同步模型來幫助你,例如調(diào)用服務(wù)端REST處理器的適當(dāng)方法。所以你最終會在前端實現(xiàn)業(yè)務(wù)邏輯,將你的服務(wù)器模型用于處理持久化數(shù)據(jù)。
在服務(wù)端復(fù)用Backbone模型十分容易用Nashron完成,就像下面的例子所展示的那樣。在我們開始之前,確保你通過閱讀我的Nashorn教程熟悉了在Nashron引擎中編程JavaScript。
Java 模型
首先,我們在Java中定義實體類Product。這個類可用于數(shù)據(jù)庫的CURD操作(增刪改查)。要記住這個類是個純粹的Java Bean,不實現(xiàn)任何業(yè)務(wù)邏輯,因為我們想讓前端正確執(zhí)行UI的業(yè)務(wù)邏輯。
class Product {
String name;
double price;
int stock;
double valueOfGoods;
}
Backbone 模型
現(xiàn)在我們定義Backbone模型,作為Java Bean的對應(yīng)。Backbone模型Product使用和Java Bean相同的數(shù)據(jù)結(jié)構(gòu),因為它是我們希望在Java服務(wù)器上持久存儲的數(shù)據(jù)。
Backbone模型也實現(xiàn)了業(yè)務(wù)邏輯:getValueOfGoods方法通過將stock于price相乘計算所有產(chǎn)品的總值。每次stock或price的變動都會使valueOfGoods重新計算。
var Product = Backbone.Model.extend({
defaults: {
name: '',
stock: 0,
price: 0.0,
valueOfGoods: 0.0
},
initialize: function() {
this.on('change:stock change:price', function() {
var stock = this.get('stock');
var price = this.get('price');
var valueOfGoods = this.getValueOfGoods(stock, price);
this.set('valueOfGoods', valueOfGoods);
});
},
getValueOfGoods: function(stock, price) {
return stock * price;
}
});
由于Backbone模型不使用任何Nashron語言擴(kuò)展,我們可以在客戶端(瀏覽器)和服務(wù)端(Java)安全地使用同一份代碼。
要記住我特意選擇了十分簡單的函數(shù)來演示我的意圖。真實的業(yè)務(wù)邏輯應(yīng)該會更復(fù)雜。
將二者放在一起
下一個目標(biāo)是在Nashron中,例如在Java服務(wù)器上復(fù)用Backbone模型。我們希望完成下面的行為:把所有屬性從Java Bean上綁定到Backbone模型上,計算valueOfGoods屬性,最后將結(jié)果傳回Java。
首先,我們創(chuàng)建一個新的腳本,它僅僅由Nashron執(zhí)行,所以我們這里可以安全地使用Nashron的擴(kuò)展。
load('http://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.6.0/underscore-min.js');
load('http://cdnjs.cloudflare.com/ajax/libs/backbone.js/1.1.2/backbone-min.js');
load('product-backbone-model.js');
var calculate = function(javaProduct) {
var model = new Product();
model.set('name', javaProduct.name);
model.set('price', javaProduct.price);
model.set('stock', javaProduct.stock);
return model.attributes;
};
這個腳本首先加載了相關(guān)的外部腳本Underscore 和 Backbone(Underscore是Backbone的必備條件),以及我們前面的ProductBackbone模型。
函數(shù)calcute接受ProductJava Bean,將其所有屬性綁定到新創(chuàng)建的BackboneProduct上,之后返回模型的所有屬性給調(diào)用者。通過在Backbone模型上設(shè)置stock和price屬性,ValueOfGoods屬性由于注冊在模型initialize構(gòu)造函數(shù)中的事件處理器,會自動計算出來。
最后,我們在Java中調(diào)用calculate函數(shù)。
Product product = new Product();
product.setName("Rubber");
product.setPrice(1.99);
product.setStock(1337);
ScriptObjectMirror result = (ScriptObjectMirror)
invocable.invokeFunction("calculate", product);
System.out.println(result.get("name") + ": " + result.get("valueOfGoods"));
// Rubber: 2660.63
我們創(chuàng)建了新的ProductJava Bean,并且將它傳遞到JavaScript函數(shù)中。結(jié)果觸發(fā)了getValueOfGoods方法,所以我們可以從返回的對象中讀取valueOfGoods屬性的值。
總結(jié)
在Nashron中復(fù)用現(xiàn)存的JavaScript庫十分簡單。Backbone適用于構(gòu)建復(fù)雜的HTML5前端。在我看來,Nashron和JVM現(xiàn)在是Node.js的優(yōu)秀備選方案,因為你可以在Nashron的代碼庫中充分利用Java的整個生態(tài)系統(tǒng),例如JDK的全部API,以及所有可用的庫和工具。要記住你在使用Nashron時并不限制于Java -- 想想 Scala、Groovy、Clojure和jjs上的純JavaScript。
這篇文章中可運(yùn)行的代碼托管在Github上(請見這個文件)。請隨意fork我的倉庫,或者在Twitter上向我反饋。