`
javamore
  • 浏览: 63370 次
  • 性别: Icon_minigender_1
  • 来自: 杭州
社区版块
存档分类
最新评论

modulejs 模块化JavaScript框架【国产】

阅读更多

 

 

 

modulejs是极致模块化的且面向对象的javascript框架,modulejs能让你在简单易用的前提下写出更佳维护性和可重用性的javascript代码。


Features

 

  • HTML document query/traversing/manipulation
  • Lightweight selector engine
  • Event handling
  • Animation
  • Cookie/localStorage storage
  • Language extensions
  • Ajax/JSONP request
  • Template engine
  • Rich utility class

 

modulejs 兼容全部主流浏览器 Internet Explorer 6+, Firefox 2+ (and browsers based on gecko) Chrome 4+, Safari 3+ and Opera9+.


modulejs quick example:


var ajax = module("net.Ajax").ajax;
ajax({
	url:"localhost/ajaxdemo.php",      //提交地址
	form:"formName",                   //表单名称
	timeout: 200,                      //过期时间
	success: function(response){       //成功后回调函数
		console.log(response);
	}
});
 


Download


You can also clone the project with Git by running:

$ git clone git://github.com/yuanyan/modulejs


Open Source License


modulejs是免费并且开源的,基于目前最宽泛的MIT协议 ,你可以在项目中使用并修改modulejs的所有代码。


Guide


Note: 当前文档只适用于 modulejs 0.1.0


getting started

在使用modulejs之前我们须加载global.js,global.js是整个modulejs的核心与基础。

 <script src="./global.js"> </script> 

modulejs中一个很重要的概念就是按需加载, modulej不是像jQuery一样在使用前加载整个已经打包的一个js文件,而是加载模块的最小集合。关于为什么需要按需加载,modulejs认为这不仅可以减少服务器的流量,更重要的是因为按需加载页面的加载时间也会大幅缩短,最终对用户更友好。

modulejs通过下面方式加载模块:

module.load("lang.Base");

module.load("util.Uri");

module.load("net.Request");

module.load("net.Ajax");

 or 

module.load(["lang.Base","util.Uri","net.Request","net.Ajax"]);

模块加载是有依赖顺序的,而modulejs的极致模块化设计可以让我们很方便的管理各模块间的依赖关系,对于简单的依赖关系你可以选择手动维护模块间依赖关系,当然我们推荐你使用modulejs提供的工具来自动生成以免出错。

在moudlejs中module.load是异步加载module的,所以当需要调用一个module时,必须是在module加载完成之后。modulejs提供了onReady事件,只需注册onReady事件,需要执行的代码就会在module加载完成(ModuleReady)并且同时在整个页面文档加载完成(DOMReady)之后执行。

注册onReady事件:

module.onReady(function(){

var ajax = module("net.Ajax").ajax;

ajax({

url:"localhost/ajaxdemo.php",      //提交地址

form:"formName",                   //表单名称

timeout: 200,                      //过期时间

success: function(response){       //成功后回调函数

console.log(response);

}

});

});


about module

 

在modulejs中"everything is module",一个实例对象可以是一个module,一个类可以是一个module,甚至一个函数也可以是一个module,在modulejs中所有代码都是通过module方式来组织的,这让我们非常方便的扩展modulejs,并且可以自由控制module的粒度。

下面例子是注册一个命名空间为"lang.String"的module :

module("lang.String",function(){

var LEFT = /^\s+/, RIGHT = /\s+$/;

var trim = function(str){

return str.replace(LEFT, "").replace(RIGHT, "");

};

...

//EXPOSE

return {

"trim":trim

};

});

当module注册后module会自动存储在模块仓库中进行管理。然后你通过moduel("namespace")来导入moduel。

如导入并使用已注册的命名空间为"lang.String"的module :

var trim = moduel("lang.String").trim;

var r = trim("   betrimed  ");  //r === "betrimed"

 

===============================================================

 

From http://madscript.com/modulejs/

 

分享到:
评论

相关推荐

    modulejs 下载,面向对象的javascript框架.rar

    modulejs是极致模块化的且面向对象的javascript框架,modulejs能让你在简单易用的前提下写出更佳维护性和可重用性的javascript代码。 Features: •HTML document query/traversing/manipulation •Lightweight ...

    javascript模块化

    Require.js是一种实现**AMD(Asynchronous Module Definition)**规范的JavaScript模块加载器。AMD规范允许模块异步加载,并且可以在定义模块时声明其依赖关系。这有助于减少页面加载时间和提高代码执行效率。 - **...

    JavaScript模块化编程

    ### JavaScript模块化编程 #### 一、理解JavaScript模块化 ##### 1.1 模块化的概念 在软件工程中,模块化是一种重要的设计思想,指的是将复杂的系统分解成一系列独立的功能单元(即模块),每个模块负责实现系统...

    JavaScript模块化架构Hydra.js.zip

    Hydra.js 是一个开源的 JavaScript 库,提供 Web 应用的模块化架构。其目的: 避免因为一个小错误导致整个应用挂掉 扩展性 框架 可伸缩、可维护的面向模块的系统 标签:Hydra Web框架

    10大js框架 javaScript框架

    在探讨“十大JavaScript框架”这一主题时,我们深入解析了多个关键框架,这些框架在现代Web开发中扮演着至关重要的角色。以下是对每个框架的详细分析: ### 1. Prototype Prototype是最早一批的JavaScript库之一,...

    JavaScript的模块化开发框架Sea.js上手指南

    Sea.js是一款遵循CMD模块定义规范的JavaScript模块化开发框架。CMD(Common Module Definition)是一种模块定义规范,与AMD(Asynchronous Module Definition)类似,但是CMD更加适合于Node.js环境,并且在浏览器端...

    Javascript模块化编程

    ### JavaScript模块化编程知识点 #### 一、模块化的重要性 模块化编程是现代软件开发的基础之一,尤其是在JavaScript这种广泛应用于Web开发的语言中尤为重要。模块化的关键在于它允许开发者将复杂的程序拆分成更小...

    渐进式JavaScript框架Vue.js的全家桶应用

    Vue.js 是一款渐进式JavaScript框架,其全家桶是一套完整的工具链,旨在提升开发效率,确保项目的可维护性、性能稳定性和模块化。Vue全家桶涵盖了自动化构建、状态管理、路由控制和UI组件等多个方面,完全符合前端...

    JavaScript前端开发模块化教程_源代码.rar

    JavaScript前端开发模块化教程是针对现代Web开发中的一个重要主题,旨在帮助开发者更好地组织和管理他们的代码。模块化在JavaScript中扮演着至关重要的角色,尤其是在大型项目中,它能提高代码的可读性、可维护性和...

    JavaScript前端开发模块化教程_PPT.rar

    1. CommonJS:CommonJS 是一种在Node.js环境中广泛使用的模块化规范,通过`require`函数引入模块,`module.exports`或`exports`导出模块。它允许同步加载模块,适用于服务器端开发。 2. AMD(Asynchronous Module ...

    SeaJS(Javascript模块加载框架)v0.9.1免费版

    SeaJS是中国开源社区贡献的一款JavaScript模块加载框架,其主要目标是为Web开发提供一种遵循CommonJS规范的模块化解决方案。这个框架的版本v0.9.1是一个免费版,适用于各种项目开发,帮助开发者更有效地组织和管理...

    javascript常见的7个框架

    MooTools 是一个简洁、模块化、面向对象的 JavaScript 框架。它能够帮助您更快、更简单地编写可扩展和兼容性强的 JavaScript 代码。MooTools 从 Prototype.js 中汲取了许多有益的设计理念,语法也和其极其类似。但它...

    模块化的js.pdf

    为了解决上述问题,JavaScript社区发展出了几种模块化标准,包括CommonJS、AMD(Asynchronous Module Definition)和CMD(Common Module Definition)。其中: - CommonJS主要应用于Node.js环境,它允许模块之间...

    国产JS框架——Como1.0

    通过这个平台,开发者可以学习如何初始化框架、使用各种组件、处理用户事件以及与其他JavaScript库集成。API文档通常会涵盖以下几个关键部分: 1. **框架初始化**: Como1.0的启动过程,包括如何引入框架文件、配置...

    modularJSFramework:一个用 javascriptjquery 编写的简单模块化框架

    **模块化JS框架详解** 在JavaScript开发中,随着项目的复杂度不断提升,代码组织和管理变得愈发重要。模块化编程提供了一种有效的方式,使得代码结构清晰、可维护性增强,同时也便于团队协作。"modularJSFramework...

    JavaScript模块化开发库之SeaJS

    JavaScript模块化开发库之SeaJS 在Web开发中,JavaScript代码的组织和管理是一个重要的问题。随着项目的复杂性增加,代码的模块化变得至关重要。SeaJS便是一个专注于JavaScript模块化开发的库,它提供了一种在...

    Sea.js模块化官方demo

    **Sea.js 模块化详解** Sea.js 是一个轻量级的前端模块加载器,它遵循 CommonJS 规范,并且特别适用于浏览器环境。Sea.js 的出现为前端开发者提供了一种组织和管理代码的新方式,使得大型应用的构建变得更加有序...

    JavaScript图库为移动和桌面独立的模块化框架.zip

    模块化框架意味着它们遵循模块化编程原则,允许开发者按需引入和组合不同的组件,从而降低项目的复杂性和依赖性。 描述中的“独立”可能指的是这些图库具有良好的平台兼容性,可以在不同的设备和浏览器上运行,包括...

    JavaScript框架高级编程——应用Prototype、YUI、Ext JS、Dojo、MooTools

    JavaScript框架高级编程——应用Prototype、YUI、Ext JS、Dojo、MooTools JavaScript框架高级编程——应用Prototype、YUI、Ext JS、Dojo、MooTools

Global site tag (gtag.js) - Google Analytics