typeof和instansof的区别

时间:2022-11-02 18:56:46

typeof

typeof 是一个一元运算,放在一个运算数之前,运算数可以是任意类型。

它返回值是一个字符串,该字符串说明运算数的类型。(typeof 运算符返回一个用来表示表达式的数据类型的字符串。 )

typeof其实就是判断参数是什么类型的实例,就一个参数

typeof 一般只能返回如下几个结果:"number"、"string"、"boolean"、"object"、"function" 和 "undefined"。

运算数为数字 typeof(x) = "number" 

字符串 typeof(x) = "string" 

布尔值 typeof(x) = "boolean" 

对象,数组和null typeof(x) = "object" 

函数 typeof(x) = "function" 
typeof和instansof的区别
console.log(typeof (123));//typeof(123)返回"number"
console.log(typeof ("123"));//typeof("123")返回"string"
var param1 = "string";
var param2 = new Object();
var param3 = 10;
console.log(typeof(param1)+"\n"+typeof(param2)+"\n"+typeof(param3));
     // string object number
typeof和instansof的区别

我们可以使用 typeof 来获取一个变量是否存在,如 if(typeof a!="undefined"){alert("ok")},而不要去使用 if(a) 因为如果 a 不存在(未声明)则会出错,对于 Array,Null 等特殊对象使用 typeof 一律返回 object,这正是 typeof 的局限性。

经常会在js里用到数组,比如 多个名字相同的input, 若是动态生成的, 提交时就需要判断其是否是数组. 

     if(document.mylist.length != "undefined" ) {} //这个用法有误. 

正确的是 if( typeof(document.mylist.length) != "undefined" ) {} 

     或 if( !isNaN(document.mylist.length) ) {} 

typeof的运算数未定义,返回的就是 "undefined". 

在 JavaScript 中,判断一个变量的类型尝尝会用 typeof 运算符,在使用 typeof 运算符时采用引用类型存储值会出现一个问题,无论引用的是什么类型的对象,它都返回 “object”。这就需要用到instanceof来检测某个对象是不是另一个对象的实例。

instanceof

instanceof 运算符用来测试一个对象在其原型链中是否存在一个构造函数的 prototype 属性。

语法:object instanceof constructor

参数:object(要检测的对象.)constructor(某个构造函数)

描述:instanceof 运算符用来检测 constructor.prototype 是否存在于参数 object 的原型链上。

 

instance:实例,例子

a instanceof b?alert("true"):alert("false");   //a是b的实例?真:假

instanceof 用于判断一个变量是否某个对象的实例,

typeof和instansof的区别
如 :var a=new Array();

alert(a instanceof Array); // true,

同时 alert(a instanceof Object) //也会返回 true;

这是因为 Array 是 object 的子类。

再如:function test(){};

var a=new test();

alert(a instanceof test) 会返回true

alert(a==b);  //flase
typeof和instansof的区别

案例:

typeof和instansof的区别
另外,更重的一点是 instanceof 可以在继承关系中用来判断一个实例是否属于它的父类型。

例如:

function Foo(){}
Foo.prototype = new Aoo();//JavaScript 原型继承
var foo = new Foo();
console.log(foo instanceof Foo)//true
console.log(foo instanceof Aoo)//true 上面的代码中是判断了一层继承关系中的父类,在多层继承关系中,instanceof 运算符同样适用。 又如: console.log(Object instanceof Object);//true
console.log(Function instanceof Function);//true
console.log(Number instanceof Number);//false
console.log(String instanceof String);//false
console.log(Function instanceof Object);//true
console.log(Foo instanceof Function);//true
console.log(Foo instanceof Foo);//false
typeof和instansof的区别
typeof和instansof的区别
// 定义构造函数
function C(){}
function D(){} var o = new C(); // true,因为 Object.getPrototypeOf(o) === C.prototype
o instanceof C; // false,因为 D.prototype不在o的原型链上
o instanceof D; o instanceof Object; // true,因为Object.prototype.isPrototypeOf(o)返回true
C.prototype instanceof Object // true,同上 C.prototype = {};
var o2 = new C(); o2 instanceof C; // true o instanceof C; // false,C.prototype指向了一个空对象,这个空对象不在o的原型链上. D.prototype = new C(); // 继承
var o3 = new D();
o3 instanceof D; // true
o3 instanceof C; // true
typeof和instansof的区别

谈到 instanceof 我们要多插入一个问题,就是 function 的 arguments,我们大家也许都认为 arguments 是一个 Array,但如果使用 instaceof 去测试会发现 arguments 不是一个 Array 对象,尽管看起来很像。

另外:

测试 var a=new Array();if (a instanceof Object) alert('Y');else alert('N');

得'Y’

但 if (window instanceof Object) alert('Y');else alert('N');

得'N'

所以,这里的 instanceof 测试的 object 是指 js 语法中的 object,不是指 dom 模型对象。

使用 typeof 会有些区别

alert(typeof(window)) 会得 object

需要注意的是,如果表达式 obj instanceof Foo 返回true,则并不意味着该表达式会永远返回ture,因为Foo.prototype属性的值有可能会改变,改变之后的值很有可能不存在于obj的原型链上,这时原表达式的值就会成为false。另外一种情况下,原表达式的值也会改变,就是改变对象obj的原型链的情况,虽然在目前的ES规范中,我们只能读取对象的原型而不能改变它,但借助于非标准的__proto__魔法属性是可以实现的。比如执行obj.__proto__ = {}之后obj instanceof Foo就会返回false了。

例子: 表明String对象和Date对象都属于Object类型

下面的代码使用了instanceof来证明:String和Date对象同时也属于Object类型

typeof和instansof的区别
例子: 表明String对象和Date对象都属于Object类型

下面的代码使用了instanceof来证明:String和Date对象同时也属于Object类型。
var simpleStr = "This is a simple string";
var myString = new String();
var newStr = new String("String created with constructor");
var myDate = new Date();
var myObj = {}; simpleStr instanceof String; // returns false, 检查原型链会找到 undefined
myString instanceof String; // returns true
newStr instanceof String; // returns true
myString instanceof Object; // returns true myObj instanceof Object; // returns true, despite an undefined prototype
({}) instanceof Object; // returns true, 同上 myString instanceof Date; // returns false myDate instanceof Date; // returns true
myDate instanceof Object; // returns true
myDate instanceof String; // returns false

typeof和instansof的区别的更多相关文章

  1. call()与apply()区别typeof和instanceof的区别

    摘自 http://www.cnblogs.com/qzsonline/archive/2013/03/05/2944367.html 一.方法的定义 call方法: 语法:call(thisObj, ...

  2. typeof()和instanceof()用法区别

    typeof()和instanceof()用法区别: 两者都是用来判断数据类型的 typeof()是能用来判断是不是属于五大类型Boolean,Number,String,Null,Undefined ...

  3. typeof和instanceof的区别

    typeof和instanceof的区别: typeof typeof 是一个一元运算,放在一个运算数之前,运算数可以是任意类型.它返回值是一个字符串,该字符串说明运算数的类型.typeof 一般只能 ...

  4. JS中typeof与instanceof的区别

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

  5. JS typeof与instanceof的区别

    typeof 与 instanceof 通常是用来判断一个变量的类型,二者有如下区别: typeof: 判断一个变量的类型,返回值是字符串形式,返回结果有如下几种: number,boolean,st ...

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

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

  7. C# typeof 与GetType()的区别

    C#中Type类的介绍:https://msdn.microsoft.com/zh-cn/library/system.type(VS.80).aspx C#中任何对象都具有GetType()方法,它 ...

  8. javascript typeof 和 instanceof 的区别和联系

      这篇文章是我看完<JavaScript高级程序设计(第2版)>书籍的随笔文章,目的只有一个,以备自己和网友们方便参考和记忆! typeof是什么?       typeof 是一个操作 ...

  9. javascript中typeof与instanceof的区别

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

随机推荐

  1. HDU 3605:Escape(最大流&plus;状态压缩)

    http://acm.hdu.edu.cn/showproblem.php?pid=3605 题意:有n个人要去到m个星球上,这n个人每个人对m个星球有一个选择,即愿不愿意去,"Y&quot ...

  2. bzoj 1001&colon; &lbrack;BeiJing2006&rsqb;狼抓兔子 平面图最小割

    平面图跑最大流 可以转换为其对偶图跑最短路 一个环对应一个割  找到最小环(即最短路)极为所求,注意辅助边的建立 加入读入优化  不过时间还是一般  估计是dij写的不好   大神勿喷~~~ /*** ...

  3. kindeditor 上传下载文件

    jsp代码 1 <script type="text/javascript" src="${pageContext.request.contextPath}/kin ...

  4. 数据结构4——浅谈DancingLinks的思想及应用

    在学习DancingLinks之前,我们先来回顾一下我们以前学过的回溯法. 我们学习基础的回溯法的时候,我们都是先判断是否达到解,然后继续搜索. 对于搜到的下一个点,将他标记为使用过( vis[i]= ...

  5. 关于AJAX异步请求

    一个HTTP请求由4个部分组成: *HTTP请求方法或“动作” *正在请求的URL *一个可选的请求头集合,其中可能包括身份验证信息 *一个可选的请求主体 服务器返回的HTTP响应包含3部分: *一个 ...

  6. hash 在 perl 中的用法(转载)

    Perl的数据结构中最有趣的一个特性是哈希(hash),它使得在数据片段之间建立键-值(key-value)关联成为可能.虽然这些哈希要远远比普通系统中以数字索引的数组用途更广,但是往往也会使初学者不 ...

  7. vue&period;js的安装

    使用nodejs安装Vue-cli 1.安装完成node,node有自带的npm,可以直接在cmd中,找到nodeJs安装的路径下,进行命令行全局安装vue-cli.(npm install --gl ...

  8. &lbrack;Windows Azure&rsqb; Windows Azure Web Sites&comma; Cloud Services&comma; and VMs&colon; When to use which&quest;

    This document provides guidance on how to make an informed decision in choosing between Windows Azur ...

  9. luogu P1880石子归并

    石子归并 luogu1880 传送门   noi1995 在一个圆形操场的四周摆放N堆石子,现要将石子有次序地合并成一堆.规定每次只能选相邻的2堆合并成新的一堆,并将新的一堆的石子数,记为该次合并的得 ...

  10. SpringMVC源码阅读:Json,Xml自动转换

    1.前言 SpringMVC是目前J2EE平台的主流Web框架,不熟悉的园友可以看SpringMVC源码阅读入门,它交代了SpringMVC的基础知识和源码阅读的技巧 本文将通过源码(基于Spring ...