文档章节

基于前端Js模块化规范的粗浅应用

BoomGred
 BoomGred
发布于 2017/09/07 21:24
字数 262
阅读 17
收藏 0

前言

  • 之前做项目时,由于刚起步,所以很多同事在Js的规范上写的很凌乱。又刚好自己在慕课网上接触了Js模块化的概念,顿时觉得怎么会有这么规范的写法。所以特别写篇博客,记录下。

Js架构如下

整个JS架构如图

   var JsName = {

	    //这里统一管理初始化的方法
	   	init:function(){

	   		//调用当前js的内部类方法时,如下
	   		JsName.class1.funtion1();

	   		//形式为JsName+方法名,如
	   		JsName.modual
	   	},

	   	//方法1,可以自定义方法
	    modual:function(){
	    	//
	    },

	    //内部类1
	    class1:{
	     	funtion1:function(){

	     	}
	    }

   }

具体实现·

var JsName = {
    //这里统一管理初始化的方法
   	init:function(){

   	},

   //存放当前js涉及到的url
   	url:{

   	   url1:function(){
   	   		return 'url';
   	   },

   	   .........

   	   	//其余自己按当前页面需求添加
   	},

   	.........

   	//其余自己按当前页面需求添加
   }

tips

  • 一定在调用的jsp页面底部调用该JS的init 初始化方法

Js模块规范整体说明

© 著作权归作者所有

共有 人打赏支持
BoomGred
粉丝 5
博文 36
码字总数 35331
作品 0
泉州
RequireJS与SeaJS模块化加载示例

web应用越变的庞大,模块化越显得重要,尤其Nodejs的流行,Javascript不限用于浏览器,还用于后台或其他场景时,没有Class,没有Package的Javascript语言变得难以管理,于是出现CommonJS项目...

nosand
2014/05/04
0
10
【CSS模块化之路2】webpack中的Local Scope

CSS是一门几十分钟就能入门,但是却需要很长的时间才能掌握好的语言。它有着它自身的一些复杂性与局限性。其中非常重要的一点就是,本身不具备真正的模块化能力。 1. 面临的问题 你可能会说,...

AlienZHOU
06/15
0
0
【原创】如何管理你的 Javascript 代码

今天不聊技术的问题,咱们来聊聊在前端开发中如何管理好自己的 Javascript 代码。首先,咱们先来说说一般都有哪些管理方式?我相信 、 对于前端开发者而言都不陌生,不错它们都是前端代码模块...

Mr.Zheng
2015/03/13
0
3
webpack 从入门到放弃(一)

什么是 webpack,为什么要使用 webpack 什么是 webpack 官网给出的概念是: 本质上,webpack 是一个现代 JavaScript 应用程序的静态模块打包器(module bundler)。当 webpack 处理应用程序时,...

sunshine小小倩
06/25
0
0
精读《现代 js 框架存在的根本原因》

1 引言 深入思考为何前端需要框架,以及 web components 是否可以代替前端框架? 原文地址,建议先阅读原文,或者阅读概述。 2 概述 现在前端框架非常多了,如果让我们回答 “为什么要用前端...

黄子毅
05/21
0
0

没有更多内容

加载失败,请刷新页面

加载更多

下一页

shell-日志脚本小实验

1.查找日志2018-8-15,求得那一分钟访问量最大。 #/bin/bash#from cc#2018-8-15#2018-08-15.log 哪一分钟 访问量 最大for d in `ls /data/nginx/logs/`doif [ -a 2018-08-15...

chencheng-linux
昨天
0
0
Android中的设计模式之状态模式

参考 《设计模式:可复用面向对象软件的基础 》5.8 State 状态 对象行为型模式 《Android源码设计模式解析与实战》第7章 随遇而安--状态模式 意图 允许一个对象在其内部状态改变时改变它的行...

newtrek
昨天
0
0
xshell端 vim没有颜色

说明 使用xshell连接服务器的时候,使用vim打开文档没有颜色 解决方法: 1.在更目录home或者etc下找到vim的配置文件vimrc 2.vim打开它找个坑,添加下面这个东西 set t_Co=256 3.保存退出,就...

杉下
昨天
0
0
spring 资料

spring boot http://www.ityouknow.com/springboot/2016/01/06/spring-boot-quick-start.html

zaolonglei
昨天
2
0
TypeScript基础入门 - 函数 - 简介

转载 TypeScript基础入门 - 函数 - 简介 项目实践仓库 https://github.com/durban89/typescript_demo.gittag: 1.1.6 为了保证后面的学习演示需要安装下ts-node,这样后面的每个操作都能直接...

durban
昨天
0
0

没有更多内容

加载失败,请刷新页面

加载更多

下一页

返回顶部
顶部