资讯专栏INFORMATION COLUMN

typeof instanceof null undefined 的区分

BigNerdCoding / 495人阅读

摘要:的使用这是一个运算符,不是方法检测数据类型,返回的结果是一个字符串类型。在检查相等性时,不能把和转换成其他值。

1 typeof的使用;这是一个运算符,不是方法

1.1检测数据类型,返回的结果是一个字符串类型。有六种可能:number boolean string object function undefined

注意typeof(null) 返回的是 : object

1.2 typeof 可以用于被声明 或者未被声明 的变量;但是未被声明 的变量不能用其他运算符运算,之外的其他运算符的话,会引起错误,因为其他运算符只能用于已声明的变量上。


1.3 对于基本数据类型(Number Boolean String null undefined) 以及引用类型 object的typeof值

1.3.1类 : Object Function Array String Boolean Number Date ;这些未初始化为实例的类的typeof类型为function

    function test (){       }
    console.log(Object);//function Object() { [native code] }
    console.log(typeof Object);//function
    console.log(Array);//function Array() { [native code] }
    console.log(typeof Array);//function
    console.log(Function);//function Function() { [native code] }
    console.log(typeof Function);//function
    console.log(String);//function String() { [native code] }
    console.log(typeof String);//function
    console.log(test);//function test(){   }
    console.log(typeof test);//function

1.3.2 对象的创建方式是用关键字 new 后面跟上实例化的类的名字,当将一个函数通过new实例化之后,那么就创建了一个对象

    function test (){       }  
    var obj = new test();
    console.log(obj.constructor);//function test(){}
    console.log(obj);//test{}
    console.log(typeof obj);//Object

    var obj1 = new Array();
    console.log(obj1.constructor);//function Array() { [native code] }
    console.log(obj1);//[]
    console.log(typeof obj1);//Object

    var obj2 = new Function();
    console.log(obj2.constructor);//function Function() { [native code] }
    console.log(obj2);//function anonymous() {}
    console.log(typeof obj2);//function

    var obj3 = new String();
    console.log(obj3.constructor);//function String() { [native code] }
    console.log(obj3);//String {length: 0, [[PrimitiveValue]]: ""}
    console.log(typeof obj3);//object

    var obj4 = new Object();
    console.log(obj4.constructor);//function Object() { [native code] }
    console.log(obj4);//Object {}
    console.log(typeof obj4);//object

1.3.3 基本数据类型的typeof的值


1.3.5 通过上面分析我们发现typeof可以判断基本数据类型,但是对于复杂数据类型,返回都是object,那么如何检测object的"类"呢?也就是说,如何检测一个对象是由哪个构造函数创建的呢?

这个时候就要用到 instanceof 了;语法: obj instanceof Type ,会沿着对象的原型链一层层的找,如果找到由Type类型的则返回true,否则返回false;

    function test (){       }
    var obj = new test();
    console.log(obj.constructor);//function test(){}
    console.log(obj);//test{}
    console.log(typeof obj);//Object
    console.log(obj instanceof test);//true   表示obj对象时test这个构造函数产生的

2 null undefined

2.1 null是一个表示"无"的对象,转化为数值的时候值为0;典型的用法是:

用来初始化一个变量,该变量将来可能会被赋值成一个对象

用来和一个已经初始化的对象进行比较,这个变量可以是一个对象,也可以不是一个对象

当函数的参数期望是对象时,被用作参数传入

当函数返回值期望是对象时,被当做返回值输出

删除事件绑定,事件本身是一个 null ,是一个空的对象,可以添加

作为对象原型链的终点




    
    






2.2 undefined 是一个表示"无"的原始值,转化为数值的时候值为0 ;典型用法是:

变量被声明了,但是没有赋值,那么该变量的值就是undefined

调用一个函数的时候,如果应该提供的参数没有提供,那么该参数默认是undefined

如果一个对象的属性没有赋值,那么该属性值为undefined

函数没有返回值的时候,默认返回undefined;

2.3 如何区分二者?

== 运算符只比较值,不进行类型的比较,比较之前会进行隐式转化,null==undefined 返回true.

=== 区分两者,不仅仅比较内容,还比较数据类型 null===undefined false

如何判断一个变量是null还是undefined?

如何确定一个变量是undefined;

var exp = undefined ;//var exp ;如果不进行赋值的话,结果也是undefined
//这种方法是错误的,因为null==undefined 返回true;
if(exp == undefined){
console.log("exp变量是undefined");
}
//这种方法才是正确的,注意undefined加"" ,因为typeof返回的值是一个字符串类型的
if(typeof(exp) == "undefined"){
console.log("exp变量是undefined");
}

以下附上== 运算符的W3C解释,方便读者回忆基础

执行类型转化遵循的规则:
如果一个运算数是 Boolean 值,在检查相等性之前,把它转换成数字值。false 转换成 0,true 为 1。 
如果一个运算数是字符串,另一个是数字,在检查相等性之前,要尝试把字符串转换成数字。 
如果一个运算数是对象,另一个是字符串,在检查相等性之前,要尝试把对象转换成字符串。 
如果一个运算数是对象,另一个是数字,在检查相等性之前,要尝试把对象转换成数字。
还遵循以下转化规则:
值 null 和 undefined 相等。 
在检查相等性时,不能把 null 和 undefined 转换成其他值。 
如果某个运算数是 NaN,等号将返回 false,非等号将返回 true。 
如果两个运算数都是对象,那么比较的是它们的引用值。如果两个运算数指向同一对象,那么等号返回 true,否则两个运算数不等。

我觉得可以进行再简化,来进行解释这个比较过程:

如果其中一个是布尔类型则先将布尔类型转化 为0 或者 1 ;
如果一个是对象,和字符串、 数字 或者 布尔类型 进行比较的时候则将对象转化为原始值,对象通过toString  valueOf 查看原始值,然后在与字符串 数字 布尔类型进行比较

如何确定一个变量是null

var exp = null;
//以下两种是不正确的
if(!exp){ //0 或者undefined同样可以进入if语句
console.log("该变量是null");
}
if(exp == null ){ //undefined == null 返回true
console.log("该变量是null")
}
//下面这种才是正确判断null 类型的
if(typeof(exp) == "object" && exp == null){ //同时进行类型和内容的判断
console.log("该变量是null");
}

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/81783.html

相关文章

  • 如何判断JavaScript数据类型?

    摘要:本文将讲解我目前所知道的判断数据类型的方法。数据类型一共有种除了之外的种属于原始数据类型。等价于问题四的返回值是什么答案。 本文将讲解我目前所知道的判断JavaScript数据类型的方法。JavaScript数据类型一共有7种: Undefined Null Boolean String Symbol Number Object 除了Object之外的6种属于原始数据类型。有时,我...

    jackzou 评论0 收藏0
  • JS 中类型判断

    摘要:和这三种基本的数据类型,都有对应的引用包装类型和。应用于引用类型的判断,所以对于这三类基本类型没有什么意义。 JS 中的类型判断 js中的数据类型 基本数据类型 undefined、number、string、boolean 引用数据类型 null、Object、Number、String、Boolean、Function、Array、Date、RegExp、Error、Argumen...

    ChanceWong 评论0 收藏0
  • JavaScript基础语法 变量 常量 数据类型

    摘要:第十六天笔记基础语法区分大小写是一种区分大小写的语言的关键字变量名函数名以及任何其他的标识符必须适应一致的大小写形势卧龙前端空格和换行并不是的语法内容可有可无建议使用将代码书写的更加整洁美观更有可读性可选的分号分号可选项语法并不是强制要 第十六天笔记 JavaScript 基础语法 区分大小写 JavaScript是一种区分大小写的语言 JavaScript的关键字 变量名 函...

    xingpingz 评论0 收藏0
  • 原型模式故事链(3)--JS数据类型、以及区别、区分、转化

    摘要:所以不论你妈妈是喊,狗蛋回家吃饭了,还是喊小明回家吃饭了,其实喊的都是你。当然的嘛狗蛋买了件新衣服,小明当然就有这件新衣服了。。。 上一章--原型链讲解:传送门:https://segmentfault.com/a/11... 在上一章讲解原型链时提到了:所有的引用类型都有一个_proto_属性,称之为隐式原型。那么引用类型是什么鬼? 尽量简单的讲解一下javascript中的数据类...

    stdying 评论0 收藏0
  • 原型模式故事链(3)--JS数据类型、以及区别、区分、转化

    摘要:所以不论你妈妈是喊,狗蛋回家吃饭了,还是喊小明回家吃饭了,其实喊的都是你。当然的嘛狗蛋买了件新衣服,小明当然就有这件新衣服了。。。 上一章--原型链讲解:传送门:https://segmentfault.com/a/11... 在上一章讲解原型链时提到了:所有的引用类型都有一个_proto_属性,称之为隐式原型。那么引用类型是什么鬼? 尽量简单的讲解一下javascript中的数据类...

    RiverLi 评论0 收藏0

发表评论

0条评论

最新活动
阅读需要支付1元查看
<