JS~~~ 前端开发一些常用技巧 模块化结构 &&&&& 命名空间处理 奇技淫巧!!!!!!
前端开发一些常用技巧 模块化结构 &&&&& 命名空间处理 奇技淫巧!!!!!!2016-09-29 17:16:39
#####背景:
前端开发过程中,创建js对象非常容易,但是要把代码变得更容易维护,那么就需要一些方法来实现约束和规范。
使用命名空间可以减少全局变量的使用,同时避免命名冲突和额外前缀,在命名空间下定义属性方法,更加面向对象有木有!!
## 实践如图:

####Debugger调试【结合debugger来解释 这个namespace方法的实现】
Step1 : 当执行完第一个紫色框的时候 我控制台输出myApp ,如图:

这就相当于在 全局定义了myApp 的子属性
Step2 : 当执行完第二个紫色框的时候 我控制台输出myApp , 如图:

执行完第二部分代码的时候 就相当于 给myApp对象子属性添加 子方法 ;----》 这样就简单了实现了 我需要的效果。。。。。
####代码
var myApp =myApp||{};
myApp.namespace = function(ns_string){
debugger;
var parts =ns_string.split('.'), //[myApp,module1,module2,module3]
parent =myApp;
if(parts[0]==="myApp"){
parts =parts.slice(1); //[module1,module2,module3]
}
for (var i = 0; i < parts.length; i++) {
if(typeof parent[parts[i]]==="undefined"){
parent[parts[i]] = {};
}
parent =parent[parts[i]];
console.log(parent);
}
return parent;
}
debugger;
myApp.namespace("myApp.module1.module2.module3");
myApp.module1.del = function(x,y){
return x-y;
}
myApp.module1.module2.add =function(x,y){
return x+y;
}
myApp.module1.module2.module3.add1= function(x,y){
return x+y;
}
var val1 = myApp.module1.del(4,2);
var val2 = myApp.module1.module2.add(1,2);
var val3 = myApp.module1.module2.module3.add1(22,33);
console.log(val1);
console.log(val2);
console.log(val3);
JS~~~ 前端开发一些常用技巧 模块化结构 &&&&& 命名空间处理 奇技淫巧!!!!!!的更多相关文章
- sublime前端开发工具常用技巧
ctrl+N//新建文件夹ctrl+shift+p//打开命令行!,ctrl+E//快速生成html模板ctrl+E//自动补齐ctrl+P(#@)//goto 任何地方,其中#查找元素,@查找样式c ...
- [转] Web前端开发工程师常用技术网站整理
1.常用工具相关 有道云笔记 http://note.youdao.com/signIn/index.html 36镇-最好用的共享收藏夹 http://www.36zhen.com/ 浏览器同步测试 ...
- Web前端开发工程师常用技术网站整理
1.常用工具相关 有道云笔记 http://note.youdao.com/signIn/index.html 36镇-最好用的共享收藏夹 http://www.36zhen.com/ 浏览器同步测试 ...
- JS前端开发判断是否是手机端并跳转操作(小结)
JS前端开发判断是否是手机端并跳转操作(小结) 这篇文章主要介绍了JS前端开发判断是否是手机端并跳转操作,非常不错,具有参考借鉴价值,需要的朋友可以参考下 常用跳转代码 ? 1 2 3 4 5 6 7 ...
- web前端开发中常用的尺寸和位置
我们在日常web前端开发过程中,会经常用到各种尺寸和位置.通常是js做动画的时候.轮播图,滚屏动画,粒子,碰撞检测,拖拽,滚动加载等等.这里我将常用的尺寸和位置的获取进行总结,不包括canvas,SV ...
- FIS.js前端开发的使用说明文档
文档结构 什么是FIS 部署FIS FIS基本使用 模块定义 加载方式 调用Tangram 2.0 一.什么是FIS FIS提供了一套贯穿开发流程的开发体系和集成开发环境,为产品线提供前端开发底层架构 ...
- yii项目开发项目常用技巧和方法汇总
1.使用CActiveForm类组件如何输出不带html属性的结果 eg:<?php echo $form->textField($model,'email',array('size'=& ...
- 【前端】javaScript 常用技巧总结
javaScript 常用技巧总结 1. 彻底屏蔽鼠标右键 oncontextmenu="window.event.returnValue=false" <table b ...
- api日常总结:前端常用js函数和CSS常用技巧
我的移动端media html{font-size:10px} @media screen and (min-width:321px) and (max-width:375px){html{font- ...
随机推荐
- PHP store session with couchbase
如何用couchbase存储session 有两种常见方式:1.采用memcache模式连接couchbase 只需两句修改: ini_set('session.save_handler', 'mem ...
- DOM操作 ——如何添加、移除、移动、复制、创建和查找节点等。
DOM操作 --如何添加.移除.移动.复制.创建和查找节点等. (1)创建新节点 createDocumentFragment() //创建一个DOM片段 createElement() //创建一个 ...
- knockout应用开发指南(完整版)
http://www.cnblogs.com/TomXu/archive/2011/11/21/2257154.html
- AJAX JSONP源码实现(原理解析)
关于JSONP以及跨域问题,请自行搜索. 本文重点给出AJAX JSONP的模拟实现代码,代码中JSONP的基本原理也一目了然. <html xmlns="http://www.w3. ...
- [转载]va_start和va_end使用详解
va_start和va_end使用详解 原文地址:http://www.cnblogs.com/hanyonglu/archive/2011/05/07/2039916.html 本文主要介绍va_s ...
- 第3.3 案例2: 工作队列 job queue
第2个案例就是工作队列,典型的点对点的消息,一个Producer发送一个工作消息到队列去,具有Listener类的Consumer能够从工作队列中获得一个工作情况的消息,这个消息被这个消费者消费掉之后 ...
- C# FTP/SFTP文件传输控件FTP for .NET/.NET CF 详细介绍
FTP for .NET将FTP客户端功能添加到您的应用程序之中..NET控件的FTP支持所有常用的FTP服务器以及代理服务器,包括可扩展的目录解析.同步以及异步操作.主动与被动模式.以VB.NET与 ...
- 每天一点 js join 函数
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/ ...
- WebView---Android与js交互实例
Android 中可以通过webview来实现和js的交互,在程序中调用js代码,只需要将webview控件的支持js的属性设置为true 原文地址:http://blog.csdn.net/it10 ...
- .net core 学习笔记(2)-中间件
小项目中有个操作日志的功能,主要是记录用户对修改数据的操作进行记录,记录的内容包括 访问的控制器和方法,以及控制器方法中接收的参数,操作用户,及操作IP等信息,最开始是用ActionFilterAtt ...