JavaScript 디자인 패턴_javascript 기술

JavaScript 디자인 패턴
//간단한 클래스 디자인 패턴
//클래스 정의 class1
function class1() {
//생성자
}

//실현 프로토타입 객체를 지정하여 클래스의 멤버 정의
class1.prototype = {
someProperty:"simple",
someMethod:function {
//메소드 코드
},
/ /실제로 속성과 메소드
}는 클래스 멤버 간에 서로를 참조하며 이 포인터를 통해 수행되어야 합니다. JavaScript의 속성과 메서드는 독립적이므로 this 포인터를 통해 개체에 연결됩니다.

//매개변수를 사용한 간단한 이벤트 디자인 패턴


createFunction을 캡슐화하면 공통 솔루션을 사용하여 매개변수 전송을 구현할 수 있습니다.
//간단한 개발 프레임워크
<script> <BR><!-- <BR>//将有参数的函数封装为无参数的函数 <BR>function createFunction(obj, strFunc) { <BR> var args = [];//定义args用于存储传递给事件处理程序的参数 <BR> if(!obj) obj = window;//如果是全局函数则obj=window; <BR> //得到传递给事件处理程序的参数 <BR> for(var i=2; i<arguments.length; i++) { <BR> args.push(arguments[i]); <BR> } <BR> //用无参数函数封装事件处理程序的调用 <BR> return function() { <BR> obj[strFunc].apply(obj, args);//将参数传递给指定的事件处理程序 <BR> } <BR>} <br><br>//定义类class1 <BR>function class1() { <BR> //构造函数 <BR>} <BR>class.prototype = { <BR> show:function() { <BR> //show函数的实现 <BR> this.onshow();//触发onshow事件 <BR> }, <BR> onShow:function() {}//定义事件接口 <BR>} <BR>//创建class1的实例 <BR>var obj = new class1(); <BR>//创建obj的onshow事件处理程序 <BR>function objOnshow(userName) { <BR> alert("hello,"+userName); <BR>} <BR>//定义变量userName <BR>var userName = "terry"; <BR>//绑定obj的onShow事件 <BR>obj.onShow=createFunction(null, "objOnshow", userName); <BR>//调用obj的show方法 <BR>obj.show(); <BR>//--> <BR></script> <script> <BR> var http_request = false; <BR> function send_request(url) {//初始化、指定处理函数、发送请求的函数 <BR> http_request = false; <BR> //开始初始化XMLHttpRequest对象 <BR> if(window.XMLHttpRequest) { //Mozilla 浏览器 <BR> http_request = new XMLHttpRequest(); <BR> if (http_request.overrideMimeType) {//设置MiME类别 <BR> http_request.overrideMimeType("text/xml"); <BR> } <BR> } <BR> else if (window.ActiveXObject) { // IE浏览器 <BR> try { <BR> http_request = new ActiveXObject("Msxml2.XMLHTTP"); <BR> } catch (e) { <BR> try { <BR> http_request = new ActiveXObject("Microsoft.XMLHTTP"); <BR> } catch (e) {} <BR> } <BR> } <BR> if (!http_request) { // 异常，创建对象实例失败 <BR> window.alert("不能创建XMLHttpRequest对象实例."); <BR> return false; <BR> } <BR> http_request.onreadystatechange = processRequest; <BR> // 确定发送请求的方式和URL以及是否同步执行下段代码 <BR> http_request.open("GET", url, true); <BR> http_request.send(null); <BR> } <BR> // 处理返回信息的函数 <BR> function processRequest() { <BR> if (http_request.readyState == 4) { // 判断对象状态 <BR> if (http_request.status == 200) { // 信息已经成功返回，开始处理信息 <BR> alert(http_request.responseText); <BR> } else { //页面不正常 <BR> alert("您所请求的页面有异常。"); <BR> } <BR> } <BR> } <BR></script>