最近更新: 2008-01-14

wxJavaScript - 以 JavaScript 開發視窗與 Web 應用程式的工具

雖然 Microsoft 的 .Net Framework 就提供了一個 JScript.Net comipler (jsc.exe),透過 JScript.Net 就可以開發 .Net 平台下的視窗與 Web 應用程式。不過知道的人應該不多,而且對 .Net Framework 架構感冒的人也不少。所以在 OpenSource 界中,就有人做了 wxJavaScript ,一樣可以寫視窗與 Web 應用程式。

熟悉 OpenSource 軟體的開發者,在看到 "wx" 這個字首後,應該就會聯想到 wxWidgets 這個老牌的跨平台 GUI 應用軟體開發工具了。 wxJavaScript 正是以 wxWidgets 為核心,並使用 Mozilla SpiderMonkey 為 JavaScript 引擎的 JavaScript 開發工具。

取得與安裝 wxJavaScript

Windows平台的使用者可下載預先編譯好的 package ,Linux平台使用者目前則請自行下載源碼編譯。安裝後,基本上就可以得到一個 JavaScript 編譯器,可供開發 Console 與 Window 應用程式。

至於 Web 應用程式開發工作,則需要再安裝 mod_wxjs 部份。 mod_wxjs 是提供 Apache 使用的 module 。需要手動設定,不過這過程非常簡單。以 Windows平台使用者為例,當 wxJavaScript 主程式安裝好後, mod_wxjs 所需的檔案也已經被置放於 wxjs/bin 的目錄之中。我們僅需要開啟 Apache 的設定檔 (httpd.conf),在最後面加上下述幾行設定內容即可。檔案路徑請自行以個人安裝環境修改,同時建議使用 Apache 2.2 版。See also: mod_wxjs@wxJavaScript

#Begin wxJavaScript Module
LoadFile "c:/program files/JavaScript/wxjs/bin/libapreq2.dll"
LoadModule apreq_module "c:/program files/JavaScript/wxjs/bin/mod_apreq2.so"

LoadModule wxjs_module "c:/program files/JavaScript/wxjs/bin/mod_wxjs.dll"
AddHandler wxjs .wxjs
#為了避免與即有的 Client 端使用的 JavaScript 衝突,副檔名使用 .wxjs 。

wxJS_Modules "c:/program files/JavaScript/wxjs/modules.xml"
wxJS_RtSize 2M
wxJS_CtxSize 32K
#End wxJavaScript Module

範例程式

根據 ECMA262 規範內容,一個運行環境 (host) 必定有一個 global object 。 wxJavaScript 的 global object 名為 wxjs ,具有 exit, include, load, namespace, print 等方法。See also: wxjs

hello1.js - console mode, say hello
// hello1.js
print("hello world\n");
//print 是 global object 'wxjs' 的方法,通常可省略前綴 'wxjs.' 。

var rp = new RegExp('^[abc]{2,4}');
//RegExp 是 ECMA262 規範的標準類,順便測一下支援程度。

var ss = [
    'aaaaa',
    'bb',
    'c'
];

for (var i = 0; i < ss.length; ++i) {
    print( rp.test(ss[i]) + "\n" );
}
C:\Program Files\JavaScript\wxjs\bin\wxjs.exe  hello1.js  
hello2.js - window mode, say hello

wxJavaScript 採用 wxWidgets 為 GUI 核心,它的編程風格自然也是 wxWidgets 。文件參考 wxJavaScript - GUI module

// hello2.js
wxTheApp.onInit = function() { 
    dlg = new wxDialog(null, -1, "test"); 
    dlg.button = new wxButton(dlg, 1, "Hello"); 
    dlg.button.onClicked = function() { 
        dlg.endModal(1); 
    } 

    dlg.showModal(); 
    return false; 
}
C:\Program Files\JavaScript\wxjs\bin\wxjs.exe  hello2.js  
hello3.wxjs - web mode, say hello

mod_wxjs 提供了兩個 object: HttpResponse (aka 'response'), HttpRequest (aka 'request')。

在副檔名部份,為了避免與即有的 Client 端使用的 JavaScript 衝突,改為 .wxjs 。

// hello3.wxjs
response.print("<html><head><title>wxJS test program</title></head><body>"); 
response.print("<b>Hello " + request.get['name'] + "</b>");

response.print("<p>List of GET:</p>");
for (p in request.get) {
    response.print(p + ": " + request.get[p] + "<br/>");
}
 
response.print("</body></html>");
firefox http://localhost/hello3.wxjs?name=john  

當然上面的範例是基本而傳統的寫法。現代寫法是運用 template ,這部份的範例請參閱官方的範例: Create a dynamic XHTML page with mod_wxjs

現有的 Module

請參考 wxJavaScript - modules 。GUI 與 IO 是以 wxWidgets 為核心。除此之外,目前在資料庫部份支援 ODBC, MySQL, SQLite。以 Expat 支援 XML 解析,GD 支援 PNG, JPEG 圖檔操作。並提供一套 TPL 樣板引擎。

樂多舊網址: http://blog.roodo.com/rocksaying/archives/4977935.html