为什么使用void 0代替undefined?

  在很多框架的源码以及webpack打包出来的bundle.js中,我们都可以看到void 0的身影,如下:

function generateRandomKey() {
var key = void ;
while (key === undefined || seenKeys.hasOwnProperty(key) || !isNaN(+key)) {
key = Math.floor(Math.random() * MULTIPLIER).toString();
}
seenKeys[key] = true;
return key;
}

  

module.exports = function shallowEqual(objA, objB, compare, compareContext) {

    var ret = compare ? compare.call(compareContext, objA, objB) : void ;

    if(ret !== void ) {
return !!ret;
}

  在浏览器中运行,可以发现,void 0的返回值就是undefined,即通过这种方式将某个变量赋值为 undefined,但是为什么不直接赋值呢? 为什么需要使用 void 0 这种方式呢?我认为有以下几点原因:

  • 在IE中,直接给变量赋值为undefined后,这个变量还可以重写,但是chrome等浏览器不会。
  • 在chrome下的某个全局变量直接赋值为undefined,不会被重写,但是在局部作用域中如何也被赋值为 undefined,那么这个值还可以被重写。
  • void 0在大量使用的时候,一定会比 undefined 所占用的字节少。

类型判断的常用方法

  比如判断数组可以使用下面的方法:

function isArray(a) {
Array.isArray ? Array.isArray(a) : Object.prototype.toString.call(a) === '[object Array]';
}

  其中 Array.isArray() 方法是ES5内置的判断数组的方法,如果支持就使用;如果不支持,就使用通用的 Object.prototype.toString.call() 。 因为前者更为简洁,效率更高,后者更为通用。

  

  当判断对象时,我们可以认为function也是对象,但是null一般需要排除掉,那么判断的方式可以是下面这样的:

_.isObject = function(obj) {
var type = typeof obj;
return type === 'function' || type === 'object' && !!obj;
};

   可以看到,比较通用的方式就是使用 typeof,之所以数组不这么使用,是因为数组使用 typeof 得到的也是对象,所以才需要通过一些其他方法。

   类似的,如果我们希望判断  'Arguments', 'Function', 'String', 'Number', 'Date', 'RegExp', 'Error'  这些类型时,也都可以通过使用 Object.prototype.toString.call() 这种比较通用的方式进行判断,使用understore的方式如下:

_.each(['Arguments', 'Function', 'String', 'Number', 'Date', 'RegExp', 'Error'], function(name) {
_['is' + name] = function(obj) {
return toString.call(obj) === '[object ' + name + ']';
};
});

  其中,_each就是underscore中对each方法的一个封装,而toString.call()实际上就是Object.prototype.toString.call()方法。

  而在IE9以下的浏览器中,对于argument我们得到的时[object Object],所以,我们还需要再添加一层判断,就是是否具有callee属性。

  

  另外,如果我们希望判断DOM元素时,只需要知道这个元素不是空的,并且其nodeType为1即可,如下所示:

_.isElement = function(obj) {
return !!(obj && obj.nodeType === );
};

  

  

   那么如何判断NaN类型呢? 通过Object.prototype.toString.call(),我们可以判断出来NaN类型得到的时[object Number], 而NaN又是Number中唯一一个自己不等于自己的数,所以:

isNaN = function(obj) {
return _.isNumber(obj) && obj !== +obj;
};

  另外我们是可以首先判断是否支持 isNaN() 方法,如果支持,就可以先用 isNaN 来判断,然后再使用上面的方法。

  

  

underscore相关记录的更多相关文章

  1. [Android学习笔记]理解焦点处理原理的相关记录

    焦点处理相关记录 以下所涉及的焦点部分,只是按键移动部分,不明确包含Touch Focus部分 需解决问题 控件的下一个焦点是哪? 分析思路 当用户通过按键(遥控器等)触发焦点切换时,事件指令会通过底 ...

  2. 关于视觉跟踪中评价标准的相关记录(The Evaluation of Visual Tracking Results on OTB-100 Dataset)

    关于视觉跟踪中评价标准的相关记录(The Evaluation of Visual Tracking Results on OTB-100 Dataset) 2018-01-22  21:49:17 ...

  3. Linux系列笔记 - vim相关记录

    一.常用到的vim命令 这里只简单记录常用到的命令,后面会有自己记录的命令,但有些可能不常用. 常规模式: gg 跳到文件头 shift+g 跳到文件尾 行数+gg 跳到指定行 如:123gg 跳到1 ...

  4. web app 相关记录

    今天在手机浏览器上运行cocos2d-html5的sample, crystalcraze运行起来只有10~20帧, moonwarrior只有20~30帧,很不理想的数据: 记录下几个web app ...

  5. UnderScore.jsAPI记录

    Collection Functions (Arrays or Objects) each         _.each(list, iterator, [context]) 遍历list中的所有元素 ...

  6. quartz相关记录

    1.http://www.quartz-scheduler.org/api/2.3.1-SNAPSHOT/ api地址 2.https://www.jianshu.com/p/3c3e166a7da1 ...

  7. Jexus使用的相关记录

    前言 本文是零零散散的记录,部分内容是我在平时工作中用到的,部分是从群里"偷"来的,所以难免会有一些错误. 主要还是希望能帮到部分使用Jexus的朋友. 安装 curl https ...

  8. powerdesigner相关记录

    背景 项目逐步开始规范化,表设计直接用designer来,然后生成语句,到oracle数据库,把相关的操作等记录一下, designer版本:15.1 oracle版本:11.2,64位 oracle ...

  9. git使用相关记录

    上传github操作记录:https://blog.csdn.net/pql925/article/details/72772660 git提交仓库相关:https://blog.csdn.net/M ...

随机推荐

  1. Converting HTML to PDF with pdfHTML

    https://itextpdf.com/itext7/pdfHTML pdfHTML 的一个例子 一个基本的例子将显示使用 pdfHTML.为此, 我们将使用下面的 HTML 和 CSS. < ...

  2. Web图片编辑控件开发文档-Xproer.ImageEditor

    版权所有 2009-2014 荆门泽优软件有限公司 保留所有权利 官方网站:http://www.ncmem.com 产品首页:http://www.ncmem.com/webplug/image-e ...

  3. 何时使用[self release]

    这样的语句   [self release]; 乍看上去让人很困惑. 从release方法本身的作用上来说,就是给self的引用技术减一,就像release对其他对象所做的一样. 一般来说,唯一用到, ...

  4. How to Create a Framework for iOS[RE]

    In the previous tutorial, you learned how to create a reusable knob control. However, it might not b ...

  5. 课堂限时训练-简易计算器·mini dc

    课堂限时训练-简易计算器·mini dc 实验题目 采用后缀表达式法,设计一个建议计算器,实现+.-.*./四种运算. 代码实现 码云链接 关键代码部分及结果如下: 实验分析 首先,分析一下后缀表达式 ...

  6. div自适应宽度

    对于div自适应宽度,网上的说法基本上都是将要自适应宽度的div放在其它固定宽度的最后,不指定其float属性或将float属性指定为none,比如三栏布局居中的一栏为自适应宽度,就可以这样来定义三栏 ...

  7. osgi.net框架

    osgi.net是一个动态的模块化框架.它向用户提供了模块化与插件化.面向服务构架和模块扩展支持等功能.该平台是OSGi联盟定义的服务平台规范移植到.NET的实现. 简介 尤埃开放服务平台是一个基于. ...

  8. HBase – 探索HFile索引机制

    本文由  网易云发布. 作者: 范欣欣 本篇文章仅限内部分享,如需转载,请联系网易获取授权. 01 HFile索引结构解析 HFile中索引结构根据索引层级的不同分为两种:single-level和m ...

  9. iOS 界面布局

    1. auto layout http://www.devtalking.com/articles/adaptive-layout-for-iphone6-1/ http://blog.sina.co ...

  10. php—Smarty-缓存1(25)

    一.            缓存原理: IE:将资源文件保存至本地 Smarty:将缓存保存到服务器 编译      <            缓存      <            静 ...