typeof和instanceof的区别

instanceof 常用来判断一个变量是否为空,或者是什么类型的。但它们之间还是有区别的

instanceof的用法

instanceof返回的是一个布尔值

var a = {};
alert(a instanceof Object); //true
var b = [];
alert(b instanceof Array); //true

需要注意的是,instanceof只能用来判断对象和函数,不能用来判断字符串和数字等,如:

var b = '123';
alert(b instanceof String); //false
alert(typeof b); //string
var c = new String("123");
alert(c instanceof String); //true
alert(typeof c); //object

typeof的用法

 typeof会返回一个变量的基本类型,只有以下几种:number,boolean,string,object,undefined,function;

typeof运算符介 绍:
typeof 是一个一元运算,放在一个运算数之前,运算数可以是任意类型。
它返回值是一个字符串,该字符串说明运算数的类型。

你知道下面typeof运算的结果吗?

typeof(1);
typeof(NaN);
typeof(Number.MIN_VALUE);
typeof(Infinity);
typeof("123");
typeof(true);
typeof(window);
typeof(document);
typeof(null);
typeof(eval);
typeof(Date);
typeof(sss);
typeof(undefined);

看 看你会几个?

如果看了以后,不是很明白的话,请看下面(明白的人就不用往下看了):
typeof是一个一元运算符,它返回的结果 始终是一个字符串,对不同的操作数,它返回不同的结果。
具体的规则如下
一、对于数字类型的操作数而言, typeof 返回的值是 number。比如说:typeof(1),返回的值就是number。
上面是举的常规数字,对于非常规的数字类型而言,其结果返回的也是number。比如typeof(NaN),NaN在
JavaScript中代表的是特殊非数字值,虽然它本身是一个数字类型。
在JavaScript中,特殊的数字类型还有几种:
Infinity 表示无穷大特殊值
NaN            特殊的非数字值
Number.MAX_VALUE     可表示的最大数字
Number.MIN_VALUE     可表示的最小数字(与零最接近)
Number.NaN         特殊的非数字值
Number.POSITIVE_INFINITY 表示正无穷大的特殊值
Number.NEGATIVE_INFINITY  表 示负无穷大的特殊值

以上特殊类型,在用typeof进行运算进,其结果都将是number。

二、对于字符串类型, typeof 返回的值是 string。比如typeof("123")返回的值是string。 
三、对于布尔类型, typeof 返回的值是 boolean 。比如typeof(true)返回的值是boolean。
四、对于对象、数组、null 返回的值是 object 。比如typeof(window),typeof(document),typeof(null)返回的值都是object。
五、 对于函数类型,返回的值是 function。比如:typeof(eval),typeof(Date)返回的值都是function。
六、如 果运算数是没有定义的(比如说不存在的变量、函数或者undefined),将返回undefined。比如:typeof(sss)、typeof(undefined)都返回undefined。

看完了六条规则,再回头看一下,是不是很简单了……

下面 我们将用程序代码验证一下:

document.write ("typeof(1): "+typeof(1)+"<br>");            //number
document.write ("typeof(NaN): "+typeof(NaN)+"<br>");    //number
document.write ("typeof(Number.MIN_VALUE): "+typeof(Number.MIN_VALUE)+"<br>")  //number
document.write ("typeof(Infinity): "+typeof(Infinity)+"<br>")          //number
document.write ("typeof(\"123\"): "+typeof("123")+"<br>")   //string
document.write ("typeof('123' + 12): "+typeof('123' + 12)+"<br>")  //string
document.write ("typeof('123' + Date): "+typeof('123' + Date)+"<br>")  //string
document.write ("typeof(true): "+typeof(true)+"<br>")     //boole
document.write ("typeof(window): "+typeof(window)+"<br>")  //object
document.write ("typeof(document): "+typeof(document)+"<br>")  //object
document.write ("typeof(null): "+typeof(null)+"<br>")  //object
document.write ("typeof(eval): "+typeof(eval)+"<br>")  //function
document.write ("typeof(Date): "+typeof(Date)+"<br>")  //function
document.write ("typeof(sss): "+typeof(sss)+"<br>")    //undefined
document.write ("typeof(undefined): "+typeof(undefined)+"<br>")  //undefined

判断变量是否存在

如果我们想要判断一个变量是否存在,可以使用typeof:(不能使用if(a) 若a未声明,则报错)

if(typeof a != 'undefined'){
//变量存在
}

判断数组是否为数组

typeof方法不适用于来判断数组,因为不管是数组还是对象,都会返回object,这就需要我们需求其他的方法。

有几种方法可以拿来判断:

constructor属性

这个属性在我们使用js系统或者自己创建的对象的时候,会默认的加上,例如:

var arr = [1,2,3];  //创建一个数组对象
arr.prototype.constructor = Array; //这一句是系统默认加上的

所以我们就可以这样来判断:

var arr = [1,2,3,1];
alert(arr.constructor === Array); // true

instanceof

instanceof是检测对象的原型链是否指向构造函数的prototype对象的,所以我们也可以用它来判断:

var arr = [1,2,3];
alert(arr instanceof Array); // true

自己封装函数判断

            var arr = [1, 2, 3];
function isArrayFn(obj) { //封装一个函数
if(typeof Array.isArray === "function") {
return Array.isArray(obj); //浏览器支持则使用isArray()方法
} else { //否则使用toString方法
return Object.prototype.toString.call(obj) === "[object Array]";
}
}
alert(isArrayFn(arr)); // true

JS中typeof和instanceof的用法和区别的更多相关文章

  1. C#中??和?分别是什么意思? 在ASP.NET开发中一些单词的标准缩写 C#SESSION丢失问题的解决办法 在C#中INTERFACE与ABSTRACT CLASS的区别 SQL命令语句小技巧 JQUERY判断CHECKBOX是否选中三种方法 JS中!=、==、!==、===的用法和区别 在对象比较中,对象相等和对象一致分别指的是什么?

    C#中??和?分别是什么意思? 在C#中??和?分别是什么意思? 1. 可空类型修饰符(?):引用类型可以使用空引用表示一个不存在的值,而值类型通常不能表示为空.例如:string str=null; ...

  2. JS中typeof与instanceof的区别

    JavaScript 中 typeof 和 instanceof 常用来判断一个变量是否为空,或者是什么类型的.但它们之间还是有区别的: Typeof typeof 是一个一元运算,放在一个运算数之前 ...

  3. JS中typeof与instanceof的区别 (2010-05-26 10:47:40

    JavaScript 中 typeof 和 instanceof 常用来判断一个变量是否为空,或者是什么类型的.但它们之间还是有区别的: typeof typeof 是一个一元运算,放在一个运算数之前 ...

  4. js中typeof和instanceof

    对于typeof和instanceof,我们经常用来检测数据的类型.typeof可以检测Number.Boolean.String.Undefined类型,对于其他类型的数据都返回为object:而i ...

  5. js中typeof与instanceof用法

    今天写JS代码,遇到动态生成多个名称相同的input复选按钮 需要判断其是否是数组,用到了if (typeof(document.MapCheckMgr.checkid)!="undefin ...

  6. JS中typeof和instanceof用法区别

    typeof和instanceof都可以用来判断变量 1.typeof用以获取一个变量或者表达式的类型,typeof一般只能返回如下几个结果: number,boolean,string,functi ...

  7. js中 typeof 和 instanceof 的区别

    typeof 和 instanceof 都能判断数据类型,但是它们之间有什么区别呢,浅谈如下 typeof 用于判断数据类型,返回值为以下6种类型 1.string 2.boolean 3.numbe ...

  8. JavaScript 中typeof、instanceof 与 constructor 的区别?

    typeof.instanceof 与 constructor 详解 typeof  一元运算符 返回一个表达式的数据类型的字符串,返回结果为js基本的数据类型,包括number,boolean,st ...

  9. js中typeof与instanceof用法区别

    今天写JS代码,遇到动态生成多个名称相同的input复选按钮 需要判断其是否是数组,用到了if (typeof(document.MapCheckMgr.checkid)!="undefin ...

随机推荐

  1. CYUSB3014芯片使用EEPROM无法下载固件说明

    当使用128KB的EEPROM存储CYUSB3014芯片的固件时,需要注意,不同厂家的EEPROM存储器,其A0.A1.A2功能不一样,在设计时电路也不一样.Microchip对应的128KB的EEP ...

  2. [Delphi]编译条件

    当软件在多个DELPHI版本下编译时,需要处理各版本的不同情况,使用编译条件技术实现. 万一博客,编译指令基础使用介绍:http://www.cnblogs.com/del/category/1686 ...

  3. Angularjs 分页控件

    实现效果: 实现步骤: 1.分页页面:page.html,页面多余样式,需要自己去除. <div class="row" ng-show="conf.totalIt ...

  4. jmeter分布式环境

    搭建jmeter分布式环境     (1)确定分布式结构,即1台机器部署master.几台机器部署slave?     (2)将相同版本的jmeter分别拷贝到这几台机器     (3)修改maste ...

  5. 上传文件时form表单需要添加的属性

    enctype="multipart/form-data"

  6. ASP.NET MVC 通过ActionFilterAttribute来实现防止重复提交

    实现思想:每个页面打开的时候会在页面的隐藏控件自动生成一个值并将这个值赋值session,当提交方法的时候会在过滤器的时候进行获取session和页面传值过来的隐藏控件的值进行比较,如果值相同的话,重 ...

  7. django drf Token验证

    https://www.django-rest-framework.org/api-guide/authentication/#basicauthentication 1.INSTALLED_APPS ...

  8. FasterRunner在Centos7.6服务器部署

    前言: 测试工作,就是要保障软件产品质量,如何保障软件产品质量,是一个博大精深的问题.功能测试,性能测试,接口测试,安全测试等.而在现实的项目过程中,软件版本的快速迭代,给测试的时间会越来越少.特别是 ...

  9. Mybatis 动态Sql语句《常用》

    MyBatis 的强大特性之一便是它的动态 SQL.如果你有使用 JDBC 或其他类似框架的经验,你就能体会到根据不同条件拼接 SQL 语句有多么痛苦.拼接的时候要确保不能忘了必要的空格,还要注意省掉 ...

  10. centos7安装nginx(自定义安装文件夹)

    一.安装所需要的依赖软件 1.gcc:nginx编译依赖gcc环境 #yum install gcc-c++ 2.pcre:(Perl Compatible Regular Expressions)是 ...