用 prototype.js 和其他 library 快樂的寫程式

This content is over 13 years old. It may be obsolete and may not reflect the current opinion of the author.


The title is Programming happy with prototype.js and other libraries. I am talking about how to write JavaScript with libraries and anonymous functions.

Translation is possible by request.

JavaScript 也寫了10年了吧1。一直到最近幾年2才開始寫一些牽涉複雜DOM或是AJAX的程式,然後就在自己寫的10~20kb的 JavaScript 程式碼裡面迷路。

去年底的某個深夜(汗)裡偶然發現了 prototype.js。看了它的使用說明文件的前三面之後,強大的內心OS告訴我「這個 library 不用是白痴啊。

熟悉JavaScript的人一定跟我有同感。prototype.js 除了簡單的 $()$F() 函式以外,只要善加利用 anonymous functions ,程式碼可以非常簡潔,物件之間的呼叫也不會隨便讓人迷路。

舉個例,以文件裡面的 Ajax.Request 範例來說好了。如果沒有 prototype.js,您可能要用 MDC: AJAX: Getting started 的作法建立 XMLHttpRequest() 物件然後再寫一堆函式互相呼叫,於是就迷路了。文件裡的範例解釋了 prototype.js 可以怎麼完成這個工作,不過它忘了用 anonymous functions 讓程式碼再簡化成如下:

var myAjax = new Ajax.Request(
	url,
	{
		method: 'get',
		parameters: pars,
		onComplete: function(originalRequest){
			//put returned XML in the textarea
			$('result').value = originalRequest.responseText;
		}
	}
);

於是再也不會找不到 showResponse() 了;也不會因為會跟其他 AJAX 功能撞名所以發生要把 function 改名成 searchSales_showResponse() 這樣。

除了讓程式的開發更方便以外,其他基於 prototype.js 的 library 也不少。Script.aculo.us 可以在網頁上製造不少動畫特效,而 Prototype Window Class 是在網頁上做視窗效果的 library 。

當然,使用 prototype.js 或是任何的 library 壞處也是有。一個問題是,在網路的環境中,載入一個 <script src=”…” /> 除了下載的時間以外,瀏覽器還需要時間解析並且載入程式碼。程式碼越多需要越多時間、瀏覽器的 JavaScript 引擎效率一直都不好,複雜的程式使用者會通常都會覺得網頁開啟來卡卡的、或是畫面一變白之後突然出現。所以如果您只會用到 $() 函式的話,還是勤勞一點不要用 prototype.js ,自己寫 document.getElementById() 吧。 Anonymous functions 的寫法也是改善程式易讀性的一大方向。

為了公平起見,順便說一下其他的 Web Applications 開發環境,它們除了 client-side 以外,也可以一並用來開發 server-side code;Google Web Toolkit(我不會 Java 所以跳過)、Yahoo! UI LibraryRuby on Rail、還有萬惡的(萬用的?) .NET

以前還滿古板的想要什麼都自己寫 —— 不過後來發現自己不斷在重新發明輪子。「這是輪子剩餘定理呀。」by CornGuo (我要 Google Bomb 你XD。)

1* 以我會做的事,我覺得我不夠格稱自己為 (Computer) Programmer。Instead, I think I should call myself “Web Developer” since everything I wrote are Web Applicaions, even before I knew the term.

2* 也是最近幾年Web才有寫這種程式的條件啦。AJAX、比起以前更容易掌握的DOM、比起Perl相對適合做Web Application的PHP等等。

2 thoughts on “用 prototype.js 和其他 library 快樂的寫程式

  1. 啊,我有講過這句話嗎.. (思考中)

    有嗎.. 囧?

    不過有現成的輪子,確實不用再去發明輪子啊

    ──除非那個輪子是電子花車專用,而你要的是普通的輪子 :p

  2. Pingback: -TMA-1- » links for 2006-08-03

Leave a Reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.