javascript中提高代码的封装性
我出的面试题中,有一条是问如何避免页面引用JS,出现函数、变量重复、冲突的。
从大的方面讲,应该引入javascript的模块化开发,符合AMD规范之类;
从小的方面说,大概就是限定变量和函数的作用域了,这也涉及到一点大家如雷贯耳的闭包概念。
众所周知,javascript没有类,只有函数。其实它的函数也跟类差不多了,函数里面可以定义函数。而对于.net来说,直到近期出现的C#7,才支持这一点。
所以,我们可以将函数和变量,都定义在一个函数里面,这样即与外部隔绝矣:
<html>
<head></head>
<body></body>
</html>
<script>
(function (){
function f1(){};
var v1;
....
})();
</script>
在一个页面中这样书写,等价于:
<html>
<head></head>
<body></body>
</html>
<script>
function f1(){};
var v1;
....
</script>
但封装性就好了许多,避免出现后者这种平铺直白,将方法和变量完全暴露于外界的隐患。并且(function(){})();
这种方式可以应用到子函数,乃至推广到所有的函数,层层封装,没有止境。并且有闭包属性,不必担心全局的绑定访问不到里层的函数:
(function(){
function f1(){}
function f2(){}
$("#btn1").click(function(){
f1();
f2();
});
}
javascript中提高代码的封装性的更多相关文章
- Android 命名规范 (提高代码可以读性)
android文件众多,根据名称来辨别用途很重要,因此命名要规范 这篇文章可参考:Android 命名规范 (提高代码可以读性) 刚接触android的时候,命名都是按照拼音来,所以有的时候想看懂命名 ...
- JavaScript中的代码执行顺序
<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> </head&g ...
- Javascript面向对象三大特性(封装性、继承性、多态性)详解及创建对象的各种方法
Javascript基于对象的三大特征和C++,Java面向对象的三大特征一样,都是封装(encapsulation).继承(inheritance )和多态(polymorphism ).只不过实现 ...
- Android 命名规范 (提高代码可以读性) 转
转自:http://blog.csdn.net/vipzjyno1/article/details/23542617 刚接触android的时候,命名都是按照拼音来,所以有的时候想看懂命名的那个控件 ...
- PC-lint集成于SourceInsight 范例以及简单分析;提高代码的健壮性;
写代码之际突然想起了pc-lint这个"古董级"的代码静态分析工具; 下午机房的服务器歇菜了,没法调试游戏,刚好抽出时间来研究一下pc-lint集成在SourceInsight ...
- [转] Android 命名规范 (提高代码可以读性)
Android命名规范编码习惯 刚接触android的时候,命名都是按照拼音来,所以有的时候想看懂命名的那个控件什么是什么用的,就要读一遍甚至好几遍才知道,这样的话,在代码的 审查和修改过程中就会浪费 ...
- javascript中常见的函数封装 :判断是否是手机,判断是否是微信,获取url地址?后面的具体参数值,毫秒格式化时间,手机端px、rem尺寸转换等
// 判断是否是手机function plat_is_mobile(){ var sUserAgent = navigator.userAgent.toLowerCase(); var bIsIpad ...
- javascript中document.getElementsByClassName兼容性封装方法一
var getElmsByClsName = function(className, results) { results = results || []; // 判断浏览器是否支持 getEleme ...
- javascript中Ajax的简单封装
GET方式的在线:DEMO POST方式在线:DEMO // 1.封裝AJAX函數 function nativeAjax(option,success,error){ // 定义domain,方便环 ...
随机推荐
- 当axios需要传送application/x-www-form-urlencoded格式参数的问题
我发送出去的数据发现后台接收不到,查找了一下原因,发现需要form-data的数据后台才可以获取到.于是改成了form-data格式,成功了,后台获取到数据了,有点小激动,但是随即发现发送的数据格式出 ...
- 一次向linux开源社区提交补丁的经历
背景 在开发过程中,偶然发现了spinand驱动的一个bug,满怀欣喜地往社区提补丁.这是怎么样的一个bug呢? static int spinand_mtd_read(struct mtd_info ...
- 【CF1020A】New Building for SIS(签到)
题意: 有n栋楼,从一栋楼某个地方,到大另一栋楼的某个地方,每栋楼给了连接楼的天桥,每走一层或者穿个一栋楼花费一分钟,求出起点到大目的点最少花费的时间 n,h<=1e8,q<=1e4 思路 ...
- C++ 代码静态分析工具cppcheck【转】
转自:http://blog.csdn.net/chen19870707/article/details/42393217 权声明:本文为博主原创文章,未经博主允许不得转载. 目录(?)[-] c ...
- Android之framework修改底部导航栏NavigationBar动态显示和隐藏
原文链接 http://blog.csdn.net/way_ping_li/article/details/45727335 git diff diff --git a/frameworks/bas ...
- ExcelHelper类
/// <summary> /// ExcelHelper类 /// </summary> using System; using System.IO; using Syste ...
- js-异步请求音频完成后页面显示
var ajax = new XMLHttpRequest(); ajax.open("get", "http://gzmylike.wedei.com/zt/gzyan ...
- nrm+nvm
一.nvm的安装和使用 nvm全称Node Version Manager是 Nodejs 版本管理器,它让我们能方便的对 Nodejs 的版 本进行切换. nvm 的官方版本只支持 Linux ...
- IntelliJ IDEA 常用快捷键总结
个人使用频率的高低排序: Alt+enter 代码提示 Alt+7 查看类的方法 Alt+insert 生成get和set方法 ...
- BT服务器的搭建(tracker-P2P服务器架设)(转)
文章虽然有点老,但原理差不多. 继上一篇文章(http://www.cnblogs.com/EasonJim/p/6601146.html)介绍了BT的原理,现在来看下BT服务端搭建的原理. 一.BT ...