写出更好的JavaScript之undefined篇(上)


Posted in Javascript onNovember 22, 2009

“全局变量”和“全局对象的属性”是指同样的东西,只是因为要配合上下文才用了不同的说法,正文中我就不再另外解释了;“声明”指通过“var”语句声明变量和/或对函数及其签名的定义;“变量”指通过“var”语句声明过或者在函数体中试图访问的命名参数;“undefined”指名为“undefined”的值(全局或本地变量),而“未定义”指type(...) == “undefined”的情况;“output”是一个显示传入参数的函数,可以看作是“alert”的同类。

我们写JavaScript程序的时候总有需要用到“未定义”的时候,比方说我们要知道某一个值是不是已经经过赋值,或者我们希望消除某一个已经赋予的值,我们就可能这样做:

output(myVar === undefined); 
myVar = undefined;

然而这样做并不太好,如果我们尝试“读”(或者比较)一个不存在的变量,就会引发一个异常。
比方说如果因为设计得不够周全,执行上面的代码的时候还没有定义过myVar这个变量,上面的代码就会出错;
另外在较早的浏览器版本上,也不存在undefined这个预定义值,所以为了提高兼容性和容错性,我们可以这样做:
output(typeof(myVar) == "undefined"); 
myVar = void(0);

typeof运算符是JavaScript的语言功能,虽然上面的代码看起来像是这样的一种东西:
output(oneFunction(myVar) == "undefined"); 
myVar = void(0);

但这两者有一个重要区别——当myVar不存在的时候,前者可以正确执行,并返回字符串"undefined";而后者不管内部构造是什么样的,都会引发异常。
void则是另一个语言功能,这个运算符的意义是向脚本的其它部分隐藏它的传入参数;而假如有一个语句试图得到void“运算”的结果,它就只能得到“未定义”。
因为void的这个特性,void最常见的功能就有两种:一是像上面的代码中那样将“未定义”值赋予给其它变量/属性;另一种就是像下面这样:
<a href="javascript:void(favList.push(curItem));">添加到收藏列表</a>
其中favList是一个JavaScript数组,而curItem是一个已经定义的对象——数组的push方法会返回执行push操作以后数组的长度,在这个例子里面这个长度对我们来说一点用都没有,但如果放任它不管的话,浏览器就可能会跳转到一个几乎为空白的脚本结果页面,只显示push的返回值,比方说“3”。
因此需要用一个void运算符来“欺骗”浏览器:这里啥都没有。
现在把目光回到对“未定义”的使用上,就会发现前面我们用来同“未定义”比较的“高容错性”的typeof运算符,用起来有点麻烦:总共需要多写“typeof()""”这样10个字符。
虽然我们是成天跟麻烦打交道的程序员,但这也不能说明我们不该想办法减少麻烦啊~各种开发工具其实不都是为了把编程工作变得简单才出现的么?
所以说如果明确知道一个变量一定一定绝对绝对已经声明过,就可以把这个变量直接和已知的“未定义”相比较,比方说这样:
output(myVar === void(0));

相比于使用typeof运算符,后面这个办法除了少打几个字符,还有一些好处:可以避免难以察觉的拼写错误(比方说把“undefined”写成“undefinied”什么的) 。

到这里,最常见的关于“undefined”/“未定义”的技巧,已经介绍完了。
在下一篇里面,我会介绍另一些不太常见的技巧。

Javascript 相关文章推荐
js split 的用法和定义 js split分割字符串成数组的实例代码
May 13 Javascript
js获得地址栏?问号后参数的方法
Aug 08 Javascript
javascript使用location.search的示例
Nov 05 Javascript
介绍一个简单的JavaScript类框架
Jun 24 Javascript
JS实现超精简响应鼠标显示二级菜单代码
Sep 12 Javascript
快速移动鼠标触发问题及解决方法(ECharts外部调用保存为图片操作及工作流接线mouseenter和mouseleave)
Aug 29 Javascript
关于JavaScript和jQuery的类型判断详解
Oct 08 Javascript
bootstrap+jQuery 实现下拉菜单中复选框全选和全不选效果
Jun 12 jQuery
原生JS实现瀑布流插件
Feb 06 Javascript
jquery radio 动态控制选中失效问题的解决方法
Feb 28 jQuery
解决Mac下安装nmp的淘宝镜像失败问题
May 16 Javascript
Vue+Express实现登录注销功能的实例代码
May 05 Javascript
COM中获取JavaScript数组大小的代码
Nov 22 #Javascript
面向对象的编程思想在javascript中的运用上部
Nov 20 #Javascript
javascript 设置文本框中焦点的位置
Nov 20 #Javascript
ExtJS Grid使用SimpleStore、多选框的方法
Nov 20 #Javascript
Jquery中增加参数与Json转换代码
Nov 20 #Javascript
ExtJS的FieldSet的column列布局
Nov 20 #Javascript
页面版文本框智能提示JS代码
Nov 20 #Javascript
You might like
PHP分页类集锦
2014/11/18 PHP
浅析php静态方法与非静态方法的用法区别
2016/05/17 PHP
js操作ajax返回的json的注意问题!
2010/02/23 Javascript
juqery 学习之六 CSS--css、位置、宽高
2011/02/11 Javascript
20款效果非常棒的 jQuery 插件小结分享
2011/11/18 Javascript
关于javascript中的typeof和instanceof介绍
2012/12/04 Javascript
JavaScript使用pop方法移除数组最后一个元素用法实例
2015/04/06 Javascript
使用Javascript实现选择下拉菜单互移并排序
2016/02/23 Javascript
JS加载iFrame出现空白问题的解决办法
2016/05/13 Javascript
JavaScript实现格式化字符串函数String.format
2016/12/16 Javascript
在vue中使用jointjs的方法
2018/03/24 Javascript
vue 中swiper的使用教程
2018/05/22 Javascript
javascript网页随机点名实现过程解析
2019/10/15 Javascript
JS如何定义用字符串拼接的变量
2020/07/11 Javascript
[03:49]显微镜下的DOTA2第十五期—VG登基之路完美团
2014/06/24 DOTA
Python中pygal绘制雷达图代码分享
2017/12/07 Python
python实现画圆功能
2018/01/25 Python
Python闭包之返回函数的函数用法示例
2018/01/27 Python
Tensorflow 自带可视化Tensorboard使用方法(附项目代码)
2018/02/10 Python
基于数据归一化以及Python实现方式
2018/07/11 Python
计算机二级python学习教程(2) python语言基本语法元素
2019/05/16 Python
Python 把序列转换为元组的函数tuple方法
2019/06/27 Python
Python变量访问权限控制详解
2019/06/29 Python
python多进程并行代码实例
2019/09/30 Python
Python利用for循环打印星号三角形的案例
2020/04/12 Python
如何在.net Winform里面显示PDF文档
2012/09/11 面试题
什么是符号链接,什么是硬链接?符号链接与硬链接的区别是什么?
2013/05/03 面试题
客服文员岗位职责
2013/11/29 职场文书
家居饰品店创业计划书
2014/01/31 职场文书
装修活动策划方案
2014/08/27 职场文书
组织生活会表态发言材料
2014/10/17 职场文书
2015年世界无烟日活动方案
2015/05/04 职场文书
2015年重阳节活动主持词
2015/07/30 职场文书
电力培训学习心得体会
2016/01/11 职场文书
新课程改革心得体会
2016/01/22 职场文书
动漫APP软件排行榜前十名,半次元上榜,第一款由腾讯公司推出
2022/03/18 杂记