这半年的空闲时间都在学javascirpt。看了很多别人的代码,从中受益很多,感谢大家的无私奉献。仿照别人的代码基于JQUERY,
做了一个OO的封装,欢迎大家拍砖。
/**
* @author: xaofeixa
* @date: 2009-02-18
* @purpse: oop.core
*/
$.showMessage = function(message) {
alert(message);
}
/**
* 创建命名空间和类
*/
$.Class = function(name, prototype) {
// 命名空间
var parentPakege = window;
var nameSpace;
var className = "";
var createNameSpace = function(str) {
parentPakege[str] = parentPakege[str] || {};
nameSpace = parentPakege[str];
parentPakege = nameSpace;
};
var namespaces = name.split(".");
$.each(namespaces, function(i, str) {
if (i == (namespaces.length - 1)) {
className = str;
} else {
createNameSpace(str);
}
});
nameSpace[className] = function(options) {
this.options = $.extend({}, $.Class.defaults,
nameSpace[className].defaults, options);
this.instance();
};
// 继承Class类基本属性
$.extend(nameSpace[className].prototype, $.Class.prototype);
// 实现接口
if (prototype.Implements) {
$.each(prototype.Implements, function(i, inter) {
$.Implements(nameSpace[className], inter);
});
}
// 继承基类
if (prototype.Extends) {
$.each(prototype.Extends, function(i, sub) {
$.Extends(nameSpace[className], sub);
});
}
// 本身属性及实现
$.extend(nameSpace[className].prototype, prototype);
};
$.Class.prototype = {
Extends : [],
Implements : [],
instance : function() {
},
destroy : function() {
},
// 是否实现某些接口
isImp : function() {
var checkResult = true;
var object = this;
if (!object && typeof(object) != 'function') {
return false;
}
$.each(arguments, function(i, interFace) {
var result = $.grep(object.Implements, function(inter, i) {
return inter = interFace;
});
if (result.length <= 0) {
checkResult = false;
return;
}
});
return checkResult;
},
// 是否扩展自某些基类
isExt : function() {
var checkResult = true;
var object = this;
if (!object && typeof(object) != 'function') {
return false;
}
$.each(arguments, function(i, supperClass) {
var result = $.grep(object.Extends, function(sup, i) {
return sup = supperClass;
});
if (result.length <= 0) {
checkResult = false;
return;
}
});
return checkResult;
}
};
$.Class.defaults = {
enabled : true
};
/**
* 接口
*/
$.Interface = function(name, prototype) {
// 命名空间
var parentPakege = window;
var nameSpace;
var interfaceName = "";
var createNameSpace = function(str) {
parentPakege[str] = parentPakege[str] || {};
nameSpace = parentPakege[str];
parentPakege = nameSpace;
};
var namespaces = name.split(".");
$.each(namespaces, function(i, str) {
if (i == (namespaces.length - 1)) {
interfaceName = str;
} else {
createNameSpace(str);
}
});
nameSpace[interfaceName] = function(options) {
this.options = $.extend({}, $.Interface.defaults,
nameSpace[interfaceName].defaults, options);
this.instance();
return null;
};
// 继承Interface类基本属性
nameSpace[interfaceName].prototype = $.extend({}, $.Interface.prototype);
// 继承其他接口
if (prototype.Extends) {
$.each(prototype.Extends, function(i, subInterface) {
$.Extends(nameSpace[interfaceName], subInterface);
});
}
// 本身属性及实现
$.extend(nameSpace[interfaceName].prototype, prototype);
// 接口方法
if (prototype.Methods) {
$.each(prototype.Methods, function(i, method) {
nameSpace[interfaceName].prototype[method] = function() {
$.showMessage("This is a interface method!");
}
});
}
}
$.Interface.prototype = {
Extends : [],
Methords : [],
instance : function() {
$.showMessage("This is a interface!Can not instance!");
},
destroy : function() {
}
}
$.Interface.defaults = {
enabled : true
};
/**
* 继承基类属性
*/
$.Extends = function(Class) {
if (!Class && typeof(Class) != 'function') {
return;
}
$.each(arguments, function(i) {
if (i > 0) {
$.extend(Class.prototype, this.prototype);
Class.prototype.Extends.push(this);
}
});
}
/**
* 实现接口属性
*/
$.Implements = function(Class) {
if (!Class && typeof(Class) != 'function') {
return;
}
$.each(arguments, function(i) {
if (i > 0) {
Class.prototype.Implements.push(this);
$.extend(Class.prototype, this.prototype);
}
});
}
以下是创建类,接口,继承基类,实现接口,检查是否实现接口是否继承基类
// class
$.Class("xaofeixa.net.Test", {
Extends : [],
Implements : [],
instance : function() {
alert("wwww");
},
kkk : function() {
alert("this is a supper method!");
}
});
var test = new xaofeixa.net.Test();
alert(test.isExt(xaofeixa.net.Test));
alert(test.isImp(xaofeixa.Interface));
// interface
$.Interface("xaofeixa.Interface", {
Extends : [],
Implements : [],
Methods : ['mehod1', 'method2']
});
// extends
$.Class("xaofeixa.Test2", {
Extends : [xaofeixa.net.Test],
Implements : [xaofeixa.Interface],
instance : function() {
alert("sub class");
}
})
var test2 = new xaofeixa.Test2();
alert(test2.isExt(xaofeixa.net.Test));
test2.kkk();
test2.mehod1();
alert(test2.isImp(xaofeixa.Interface));
分享到:
- 2009-02-18 13:33
- 浏览 1991
- 评论(0)
- 论坛回复 / 浏览 (0 / 3498)
- 查看更多
相关推荐
在这个实例中,我们将探讨如何基于jQuery封装一个拖拽事件。这个事件允许用户通过鼠标移动来改变元素的位置,实现类似拖放功能。 首先,我们来看HTML部分。在这个例子中,HTML包含了一个class为"box"的div元素,它...
体现以下jquery的强大,让你的工程使用起来更方便
5. **AJAX**: jQuery的`$.ajax()`方法是其最强大的特性之一,它封装了XMLHttpRequest对象,使得异步数据交互变得易如反掌。此外,还有简化的`$.get()`, `$.post()`, `$.getJSON()`等方法。 **二、jQuery 2.x 特性**...
jQuery是一个快速、简洁的JavaScript框架,是继Prototype之后又一个优秀的JavaScript代码库(或JavaScript框架)。jQuery设计的宗旨是“write Less,Do More”,即倡导写更少的代码,做更多的事情。它封装JavaScript...
【PHP_OO_MVC_JQUERY:普鲁巴】 在IT领域,PHP、面向对象编程(Object-Oriented Programming, OOP)、Model-View-Controller(MVC)设计模式以及jQuery都是至关重要的技术,它们共同构建了现代Web应用程序的基础。...
7. **插件化开发**:将上述功能封装成一个可复用的jQuery插件。这包括插件的初始化、配置选项、方法调用等。 8. **动画效果**:为了让用户体验更佳,可以添加平滑的展开和关闭动画,如淡入淡出效果。 9. **自定义...
这是一种常用的方式,可以将 jQuery 插件封装成控件,并在 ASP.NET 中使用。 6. 使用 ASP.NET 中的资源嵌入式资源 在 ASP.NET 中,可以使用资源嵌入式资源来嵌入图片和其他资源。在本文中,使用了资源嵌入式资源来...
总的来说,JQuery Dialog提供了一种高效、灵活的方式来创建可拖拽的模态窗口,结合OO设计原则和jQuery的强大功能,使得在Web应用中实现复杂交互变得更加轻松。随着不断优化和完善,JQuery Dialog成为了开发者不可或...
恰好偶最近负责的一个可视化编辑器的开发,其中有些地方便应用了JQuery的自定义事件,而且达到了很好的效果-精简代码的同时充分利用了OO的原则。 本文以我实际应用开发过程中遇到的一个例子进一步说明“什么时候用...
2. **封装轮播函数**: - 定义一个`show()`函数来控制图片的显示和隐藏。 ```javascript function show() { // 下标每次+1增加 index += 1; // 如果下标大于等于图片的长度数,返回第一张图 if (index >= $...
jQuery跨域访问,封装的ajax 代码,我使用的jQuery版本是1.11.3
它基于 zepto.js,兼容 jquery.js,只有 82k,但是实现了标准浏览器下的编辑器常见功能:加粗、斜体、颜色、字体、字号、表格、图片上传、文件上传、客户端缩略、全屏,HTML 切换、上一步下一步等功能。 因为他不用...
在本项目"js-oo-mvc-app"中,我们将深入探讨JavaScript中的面向对象编程(Object-Oriented Programming, OOP)以及Model-View-Controller(MVC)设计模式。这些是构建高效、可维护的前端应用程序的基础概念。 **...
* 使用 Bootstrap、Less、AngularJs、jQuery、Modernizr 和其他JS库来开发客户端应用程序。 * 为单页面应用程序和多页面应用程序提供了项目模板。 * 自动创建 Javascript 代理层来更方便使用 Web Api。 * 封装了一些...
关键方面: 使用.bind进行部分应用删除许多jQuery调用以支持字符串连接净化功能-消除副作用,有利于返回值将副作用(读取JSON提要和更新DOM)推送到系统边缘,并将其封装在函数中用稍后将要执行的功能来修饰数据...
1. 面向对象(OO)编程:OO的核心概念包括继承、封装和多态。继承允许子类继承父类的属性和方法,封装是将数据和操作数据的方法绑定在一起,多态则是允许不同类型的对象对同一消息作出不同的响应。 2. EJB...
在JavaScript编程中,子函数(或内部函数)访问外部变量是一个常见的需求,特别是在处理异步操作、事件处理或封装逻辑时。以下将详细介绍三种解决方法,以帮助理解如何在JavaScript中实现这一目标。 1. **立即执行...
2. 客户端:提供了项目模板,支持Bootstrap、Less、AngularJs、jQuery、Modernizr等技术,自动创建Javascript代理层,方便使用Web Api封装。 3. 模块化开发:每个模块有独立的EF DbContext,可单独指定数据库,支持...
此外,我们还引入了jQuery库和自定义的`index.js`脚本文件,用于处理文件上传的逻辑。 在`index.js`脚本中,我们定义了`formDataUpload()`函数,这是上传文件的核心。当用户点击“上传”按钮时,这个函数会被调用。...
3. jsLINB: 一个全面的JavaScript解决方案,适用于现代浏览器,包含类型检查、事件模型、自定义事件、OO实现、线程模拟、Ajax支持和拖放功能。 4. My-BIC: 易用且功能强大的Ajax/PHP框架,支持XML、JSON和TEXT数据...