辨析undefined与null与void(0);

Null

MDN对null的定义是:

The value null represents the intentional absence of any object value. It is one of JavaScript’s primitive values.
(备注:JS的六个数据类型Number、String、Boolean、Undefined、Null、Object)

In APIs, null is often retrieved in a place where an object can be expected but no object is relevant.

所以null是一种特殊的对象,即一个空对象指针,出现在某个变量可以用object表示但是没有object关联 ,这也就是为什么typeof null运算的结果是object。

在实际项目中我们经常使用到null,如下例子(摘自MDN)

function getVowels(str) {
  var m = str.match(/[aeiou]/gi);
  if (m === null) { // 通常使用在一些判断是否有结果,str.match函数无结果时返回null
    return 0;
  }
  return m.length;
}
console.log(getVowels('sky'));
// expected output: 0

Undefined

MDN对undefined的解释是:

A variable that has not been assigned a value is of type undefined. A method or statement also returns undefined if the variable that is being evaluated does not have an assigned value. A function returns undefined if a value was not returned.

意思是一个变量声明了但是没有赋值,如下例子(摘自MDN)

var x;
if (x === undefined) {
   // these statements execute
}
else {
   // these statements do not execute
}

⚠️没有声明和声明了没有定义的变量typeof的结果都是undefined,原因是:虽然这两种变量从技术角度看有本质区别,但实际上无论对哪种变量也不可能执行真正的操作 ——摘自《JavaScript高级程序设计(第3版)》。所以在使用时,声明了的变量尽量赋值,如果是空对象则为null,其他根据变量类型进行赋值。

⚠️实际上,undefined 值是派生自 null 值的,因此 ECMA-262 规定对它们的相等性测试要返回 true。 ——摘自《JavaScript高级程序设计(第3版)》

null == undefined; // true
null === undefined; //false

null的插曲: void

The void operator is often used merely to obtain the undefined primitive value, usually using “void(0)” (which is equivalent to “void 0”). In these cases, the global variable undefined can be used instead (assuming it has not been assigned to a non-default value).

void 0 === void(0) === undefined

当我们在写a标签的时候,经常会用到这种写法(摘自MDN):

<a href="javascript:void(0);">
  Click here to do nothing
</a>

<a href="javascript:void(document.body.style.backgroundColor='green');">
  Click here for green background
</a>

对于两者的不同,segmentfault上有一个回答是:

" 在ES5之前,window下的undefined是可以被重写的,于是导致了某些极端情况下使用undefined会出现一定的差错。
所以,用void 0是为了防止undefined被重写而出现判断不准确的情况。 注:
ES5之后的标准中,规定了全局变量下的undefined值为只读,不可改写的,但是局部变量中依然可以对之进行改写。
补充一下:非严格模式下,undefined是可以重写的,严格模式则不能重写。"

Null vs Undefined ❤️

When checking for null or undefined, beware of the differences between equality () and identity (=) operators, as the former performs type-conversion.

typeof null          // "object" (not "null" for legacy reasons)
typeof undefined     // "undefined"
null === undefined   // false
null  == undefined   // true
null === null        // true
null == null         // true
!null                // true
isNaN(1 + null)      // false
isNaN(1 + undefined) // true

插曲: == VS ===

Features of comparisons:

Two strings are strictly equal when they have the same sequence of characters, same length, and same characters in corresponding positions.
Two numbers are strictly equal when they are numerically equal (have the same number value). NaN is not equal to anything, including NaN. Positive and negative zeros are equal to one another.
Two Boolean operands are strictly equal if both are true or both are false.
Two distinct objects are never equal for either strict or abstract comparisons.
An expression comparing Objects is only true if the operands reference the same Object.
Null and Undefined Types are strictly equal to themselves and abstractly equal to each other.

Equality (==)

The equality operator converts the operands if they are not of the same type, then applies strict comparison. If both operands are objects, then JavaScript compares internal references which are equal when operands refer to the same object in memory.

Syntax x == y

1    ==  1         // true
'1'  ==  1         // true
1    == '1'        // true
0    == false      // true
0    == null       // false
var object1 = {'key': 'value'}, object2 = {'key': 'value'}; 
object1 == object2 //false
0    == undefined  // false
null == undefined  // true

Identity / strict equality(===)

The identity operator returns true if the operands are strictly equal (see above) with no type conversion.

Syntax x === y

3 === 3   // true
3 === '3' // false
var object1 = {'key': 'value'}, object2 = {'key': 'value'};
object1 === object2 //false

拓展知识:
从内存来看 null 和 undefined 本质的区别是什么?

解答:
给一个全局变量赋值为null,相当于将这个变量的指针对象以及值清空,如果是给对象的属性 赋值为null,或者局部变量赋值为null,相当于给这个属性分配了一块空的内存,然后值为null, JS会回收全局变量为null的对象。
给一个全局变量赋值为undefined,相当于将这个对象的值清空,但是这个对象依旧存在,如果是给对象的属性赋值 为undefined,说明这个值为空值

https://github.com/yygmind/blog/issues/16

课外作业:
阮一峰老师的 《undefined与null的区别》



  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值