在JavaScript中有很多種設(shè)計模式,因此很多用戶們都會特意去選擇一直設(shè)計模式,其實并不用特意去選擇,因為設(shè)計模式一套被反復(fù)使用、多數(shù)人知曉的,那么下面小編就為大家介紹JavaScript的設(shè)計模式。
一種JavaScript的設(shè)計模式?
//簡單的類的設(shè)計模式
//定義一個類class1
function?class1()?{
??//構(gòu)造函數(shù)
}
//通過指定prototype對象來實現(xiàn)類的成員定義
class1.prototype?=?{
??someProperty:"simple",
??someMethod:function?{
????//方法代碼
??},
??//其實屬性和方法
}在一個類的成員之間互相引用,必須通過this指針來進行。因為在JavaScript中第個屬性和方法都是獨立的,它們通過this指針聯(lián)系在一個對象上。?
//簡單的帶參數(shù)的事件設(shè)計模式
<script?language="JavaScript"?type="text/javascript">
<!--
//將有參數(shù)的函數(shù)封裝為無參數(shù)的函數(shù)
function?createFunction(obj,?strFunc)?{
??var?args?=?[];//定義args用于存儲傳遞給事件處理程序的參數(shù)
??if(!obj)?obj?=?window;//如果是全局函數(shù)則obj=window;
??//得到傳遞給事件處理程序的參數(shù)
??for(var?i=2;?i<arguments.length;?i++)?{
????args.push(arguments[i]);
??}
??//用無參數(shù)函數(shù)封裝事件處理程序的調(diào)用
??return?function()?{
????obj[strFunc].apply(obj,?args);//將參數(shù)傳遞給指定的事件處理程序
??}
}
//定義類class1
function?class1()?{
??//構(gòu)造函數(shù)
}
class.prototype?=?{
??show:function()?{
????//show函數(shù)的實現(xiàn)
?????this.onshow();//觸發(fā)onshow事件
??},
??onShow:function()?{}//定義事件接口
}
//創(chuàng)建class1的實例
var?obj?=?new?class1();
//創(chuàng)建obj的onshow事件處理程序
function?objOnshow(userName)?{
???alert("hello,"+userName);
}
//定義變量userName
var?userName?=?"terry";
//綁定obj的onShow事件
obj.onShow=createFunction(null,?"objOnshow",?userName);
//調(diào)用obj的show方法
obj.show();
//-->
</script>
通過createFunction封裝,就可以用一種通用的方案實現(xiàn)參數(shù)傳遞。?
//一個簡單的開發(fā)框架
<script?language="javascript">
????var?http_request?=?false;
????function?send_request(url)?{//初始化、指定處理函數(shù)、發(fā)送請求的函數(shù)
????????http_request?=?false;
????????//開始初始化XMLHttpRequest對象
????????if(window.XMLHttpRequest)?{?//Mozilla?瀏覽器
????????????http_request?=?new?XMLHttpRequest();
????????????if?(http_request.overrideMimeType)?{//設(shè)置MiME類別
????????????????http_request.overrideMimeType("text/xml");
????????????}
????????}
????????else?if?(window.ActiveXObject)?{?//?IE瀏覽器
????????????try?{
????????????????http_request?=?new?ActiveXObject("Msxml2.XMLHTTP");
????????????}?catch?(e)?{
????????????????try?{
????????????????????http_request?=?new?ActiveXObject("Microsoft.XMLHTTP");
????????????????}?catch?(e)?{}
????????????}
????????}
????????if?(!http_request)?{?//?異常,創(chuàng)建對象實例失敗
????????????window.alert("不能創(chuàng)建XMLHttpRequest對象實例.");
????????????return?false;
????????}
????????http_request.onreadystatechange?=?processRequest;
????????//?確定發(fā)送請求的方式和URL以及是否同步執(zhí)行下段代碼
????????http_request.open("GET",?url,?true);
????????http_request.send(null);
????}
????//?處理返回信息的函數(shù)
????function?processRequest()?{
????????if?(http_request.readyState?==?4)?{?//?判斷對象狀態(tài)
????????????if?(http_request.status?==?200)?{?//?信息已經(jīng)成功返回,開始處理信息
????????????????alert(http_request.responseText);
????????????}?else?{?//頁面不正常
????????????????alert("您所請求的頁面有異常。");
????????????}
????????}
????}
</script>
看完本文后我們知道其實不用特意去選擇JavaScript的設(shè)計模式,javascript的設(shè)計模式有很多種,本文只是總結(jié)了其中的幾種,以后可能會補充。
新聞熱點
疑難解答
圖片精選