[译] 在 Nashron 中使用 Backbone.js

原文:Using Backbone.js with Nashorn
译者:飞龙
协议:CC BY-NC-SA 4.0前端

这个例子展现了如何在Java8的Nashron JavaScript引擎中使用Backbone.js模型。Nashron在2014年三月首次做为Java SE 8 的一部分发布,并经过以原生方式在JVM上运行脚本扩展了Java的功能。对于Java Web开发者,Nashron尤为实用,由于它能够在Java服务器上复用现有的客户端代码。传统的Node.js具备明显优点,可是Nashorn也可以缩短JVM的差距。java

当你在HTML5前端使用现代的JavaScript MVC框架,例如Backbone.js时,愈来愈多的代码从服务器后端移动到Web前端。这个方法能够极大提高用户体验,由于在使用视图的业务逻辑时节省了服务器的不少往返通讯。node

Backbone容许你定义模型类,它们能够用于绑定视图(例如HTML表单)。当用户和UI交互时Backbone会跟踪模型的升级,反之亦然。它也能经过和服务器同步模型来帮助你,例如调用服务端REST处理器的适当方法。因此你最终会在前端实现业务逻辑,将你的服务器模型用于处理持久化数据。git

在服务端复用Backbone模型十分容易用Nashron完成,就像下面的例子所展现的那样。在咱们开始以前,确保你经过阅读个人Nashorn教程熟悉了在Nashron引擎中编程JavaScript。github

Java 模型

首先,咱们在Java中定义实体类Product。这个类可用于数据库的CURD操做(增删改查)。要记住这个类是个纯粹的Java Bean,不实现任何业务逻辑,由于咱们想让前端正确执行UI的业务逻辑。ajax

class Product {
    String name;
    double price;
    int stock;
    double valueOfGoods;
}

Backbone 模型

如今咱们定义Backbone模型,做为Java Bean的对应。Backbone模型Product使用和Java Bean相同的数据结构,由于它是咱们但愿在Java服务器上持久存储的数据。数据库

Backbone模型也实现了业务逻辑:getValueOfGoods方法经过将stockprice相乘计算全部产品的总值。每次stockprice的变更都会使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语言扩展,咱们能够在客户端(浏览器)和服务端(Java)安全地使用同一份代码。后端

要记住我特地选择了十分简单的函数来演示个人意图。真实的业务逻辑应该会更复杂。浏览器

将两者放在一块儿

下一个目标是在Nashron中,例如在Java服务器上复用Backbone模型。咱们但愿完成下面的行为:把全部属性从Java Bean上绑定到Backbone模型上,计算valueOfGoods属性,最后将结果传回Java。

首先,咱们建立一个新的脚本,它仅仅由Nashron执行,因此咱们这里能够安全地使用Nashron的扩展。

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;
};

这个脚本首先加载了相关的外部脚本UnderscoreBackbone(Underscore是Backbone的必备条件),以及咱们前面的ProductBackbone模型。

函数calcute接受ProductJava Bean,将其全部属性绑定到新建立的BackboneProduct上,以后返回模型的全部属性给调用者。经过在Backbone模型上设置stockprice属性,ValueOfGoods属性因为注册在模型initialize构造函数中的事件处理器,会自动计算出来。

最后,咱们在Java中调用calculate函数。

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

咱们建立了新的ProductJava Bean,而且将它传递到JavaScript函数中。结果触发了getValueOfGoods方法,因此咱们能够从返回的对象中读取valueOfGoods属性的值。

总结

在Nashron中复用现存的JavaScript库十分简单。Backbone适用于构建复杂的HTML5前端。在我看来,Nashron和JVM如今是Node.js的优秀备选方案,由于你能够在Nashron的代码库中充分利用Java的整个生态系统,例如JDK的所有API,以及全部可用的库和工具。要记住你在使用Nashron时并不限制于Java -- 想一想 Scala、Groovy、Clojure和jjs上的纯JavaScript。

这篇文章中可运行的代码托管在Github上(请见这个文件)。请随意fork个人仓库,或者在Twitter上向我反馈。

相关文章
相关标签/搜索