写出更好的JavaScript程序之undefined篇(中)


Posted in Javascript onNovember 23, 2009

写在前面的依然是消歧义声明:本文中JavaScript是指一般意义上的JavaScript,并不只限定“自称是JavaScript”的运行环境;“全局变量”和“全局对象的属性”是指同样的东西,只是因为要配合上下文才用了不同的说法,正文中我就不再另外解释了;“声明”指通过“var”语句声明变量和/或对函数及其签名的定义;“变量”指通过“var”语句声明过或者在函数体中试图访问的命名参数;“undefined”指名为“undefined”的值(全局或本地变量),而“未定义”指type(...) == “undefined”的概念值;“output”是向我们显示传入参数的函数,其实就是“alert”的同类。

首先介绍的是和void(0)具有异曲同工之妙的一种办法,我们知道在JavaScript中尝试访问任何一个“没有返回值”的函数的执行结果,都会得到“未定义”这个概念值,所以我们可以这样做:
myVar = function(){}();
这个方法的原理是创建一个空函数,并且获取其(根本不存在的)返回值。很明显,我们会得到“未定义”这个概念值,这个原理是和void(0)一样的。
需要特别注意的是,只有当function关键字不在语句之首的时候,才可以使用这种调用方式;如果需要直接调用一个匿名函数,应该这样做:

(function(){
// code here
})();
假如我们不想污染全局作用域,我们就可以用这种方式来创造一个闭包——很多现有的JavaScript库就是这样做的。
这种办法是在不了解void(0)的执行效果的情况下诞生的,既然我们知道void(0),也就不需要这种办法了。

第二种不常见的办法是访问window.undefined,就像下边这样:
output(myVar === window.undefined);
myVar = window.undefined;
这种办法的原理是:
如果JavaScript的运行环境预定义了undefined这一值,window.undefined就可以直接访问到;
如果没有预先定义undefined这一值,window.undefined就会返回“未定义”这一概念值——还是我们想要的东西。
访问形式从“全局变量”变成“属性”以后,脚本引擎就不会认为这是一个意外操作了,因此代码可以正确执行。

然而这种办法还是存在不足:
undefined在所有的JavaScript引擎中都不是保留字,也就是说它是可以被污染的,这会影响我们的程序的运行效果;
直接访问全局对象的属性效率是很差的,应该避免这么做。

因此,接下来就要介绍我所见过的最为有趣的办法——在本地声明undefined变量!
它的做法是这样的:
function myFunc(){
var undefined;
// some code here
output(myVar === undefined);
myVar = undefined;
}
说到这里我要提一下,有的人对“早期的浏览器上没有undefined”这一说法有不同的理解,认为上面这样的做法是行不通的。
而我认为这种观点是不对的,在我的印象中(大约是2003年),IE5虽然没有预定义undefined,但并不影响我们的不指派声明。
不过毕竟是很多年前的事情,记忆模糊,为了避免想当然造成的错误,我特地装了Windows 98来实验一下:
写出更好的JavaScript程序之undefined篇(中)
写出更好的JavaScript程序之undefined篇(中)

上面两幅是用了QQ屏幕截取 ,不知道为什么变成了JPG,下边这幅是用OneNote截取的。

写出更好的JavaScript程序之undefined篇(中)

由此可以得出,为这样不指派声明undefined变量担忧是多余的。
前一篇解释过,在JavaScript中,如果尝试读取一个没有预定义也未声明过的变量,会引发一个“不存在(未定义)”异常,因此在早期的浏览器上如果直接访问undefined的操作可能会失败。
这种(引发异常的)现象可能是为了方便排除故障而有意设计的;而对于声明过的变量,即使是未经赋值,也不会在读取的时候引发异常——经过声明就表示开发人员确定有“这个东西”。

上面这种在函数作用域内声明本地变量undefined的做法,既解决了引用未声明变量会引发异常的问题,又避免了受全局变量污染的影响,还取代了void(0)这种乍看之下意味不明的小把戏,不仅没有造成难以觉察的拼写错误的隐患,还能提高运算效率——真是一举N得的妙招!
所以了解了这么多之后就发现,最后介绍的这种办法实在是居家旅行、杀人灭口的首选
如果有人问:“undefined应该怎么用?”我们现在就可以回答:就这么用!

终于到了结尾,有的人可能忍不住要问了:为什么在这个系列中我的代码示例都用三个等号的“严格相等”来比较?两个等号的普通的“相等”有什么问题吗?
这就是这个系列的下篇要讲解的内容:undefined及其各种等价形态的适用场合。

Javascript 相关文章推荐
自己动手制作jquery插件之自动添加删除行的实现
Oct 13 Javascript
window.setInterval()方法的定义和用法及offsetLeft与style.left的区别
Nov 11 Javascript
jQuery实现选项卡切换效果简单演示
Dec 09 Javascript
javascript日期比较方法实例分析
Jun 17 Javascript
Angularjs 制作购物车功能实例代码
Sep 14 Javascript
JS实现向iframe中表单传值的方法
Mar 24 Javascript
Angular2 之 路由与导航详细介绍
May 26 Javascript
React props和state属性的具体使用方法
Apr 12 Javascript
JavaScript字符串转数字的5种方法及遇到的坑
Jul 16 Javascript
react build 后打包发布总结
Aug 24 Javascript
jquery实现二级导航下拉菜单效果实例
May 14 jQuery
vue-video-player实现实时视频播放方式(监控设备-rtmp流)
Aug 10 Javascript
通过身份证号得到出生日期和性别的js代码
Nov 23 #Javascript
javascript 在网页中的运用(asp.net)
Nov 23 #Javascript
javascript DOM编程实例(智播客学习)
Nov 23 #Javascript
传智播客学习之java 反射
Nov 22 #Javascript
Javascript 刷新全集常用代码
Nov 22 #Javascript
写出更好的JavaScript之undefined篇(上)
Nov 22 #Javascript
COM中获取JavaScript数组大小的代码
Nov 22 #Javascript
You might like
让这部DC动画新作刷新你的认知
2020/03/03 欧美动漫
PHP数组操作类实例
2015/07/11 PHP
PHP上传图片、删除图片简单实例
2016/11/12 PHP
关于PHP定时发送服务的解决办法
2017/04/23 PHP
Thinkphp 框架配置操作之动态配置、扩展配置及批量配置实例分析
2020/05/15 PHP
一些经常会用到的Javascript检测函数
2010/05/31 Javascript
jquery.validate使用攻略 第一部
2010/07/01 Javascript
js图片预加载示例
2014/04/30 Javascript
js去除输入框中所有的空格和禁止输入空格的方法
2014/06/09 Javascript
jquery插件NProgress.js制作网页加载进度条
2015/06/05 Javascript
javascript中tostring()和valueof()的用法及两者的区别
2015/11/16 Javascript
JQuery 在文档中查找指定name的元素并移除的实现方法
2016/05/19 Javascript
js实现背景图自适应窗口大小
2017/01/10 Javascript
详解vue-router 2.0 常用基础知识点之router-link
2017/05/10 Javascript
VUE 3D轮播图封装实现方法
2018/07/03 Javascript
vue-resource:jsonp请求百度搜索的接口示例
2019/11/09 Javascript
vue如何使用async、await实现同步请求
2019/12/09 Javascript
Vue-Ant Design Vue-普通及自定义校验实例
2020/10/24 Javascript
JS画布动态实现黑客帝国背景效果
2020/11/08 Javascript
[00:50]深扒TI7聊天轮盘语音出处6
2017/05/11 DOTA
Python实现读取目录所有文件的文件名并保存到txt文件代码
2014/11/22 Python
Python处理字符串之isspace()方法的使用
2015/05/19 Python
Python中MySQLdb和torndb模块对MySQL的断连问题处理
2015/11/09 Python
Windows中使用wxPython和py2exe开发Python的GUI程序的实例教程
2016/07/11 Python
Python实现的多叉树寻找最短路径算法示例
2018/07/30 Python
基于python实现蓝牙通信代码实例
2019/11/19 Python
Python extract及contains方法代码实例
2020/09/11 Python
Python3 用matplotlib绘制sigmoid函数的案例
2020/12/11 Python
写自荐信有哪些不宜?
2013/10/17 职场文书
学校岗位设置方案
2014/01/16 职场文书
《荷花》教学反思
2014/04/16 职场文书
2014年国庆节广播稿
2014/09/19 职场文书
2015年六一儿童节活动总结
2015/02/11 职场文书
博士生专家推荐信
2015/03/25 职场文书
关爱留守儿童捐款倡议书
2015/04/27 职场文书
公共场所卫生管理制度
2015/08/05 职场文书