基于javascript中的typeof和类型判断(详解)

typeof

ECMAScript 有 5 种原始类型（primitive type），即 Undefined、Null、Boolean、Number 和 String。我们都知道可以使用typeof运算符求得一个变量的类型，但是对引用类型变量却只会返回object，也就是说typeof只能正确识别基本类型值变量。

var a = "abc";
console.log(typeof a); // "string"
var b = 123;
console.log(typeof b); // "number"
var c = true;
console.log(typeof c); // "boolean"
var d = null;
console.log(typeof d); // "object"
var f = undefined;
console.log(typeof f); // "undefined"
var g;
console.log(typeof g); // "undefined"

console.log(typeof x); // "undefined"

您也许会问，为什么 typeof 运算符对于 null 值会返回 "object"。这实际上是 JavaScript 最初实现中的一个错误，然后被 ECMAScript 沿用了。现在，null 被认为是对象的占位符，从而解释了这一矛盾，但从技术上来说，它仍然是原始值。

最后一个比较奇怪，typeof一个不存在的变量x居然返回了"object"而不是"undefined"。

我们在来如下代码：

var a = function() { };
console.log(typeof a); // "function"
var b = [1,2,3];
console.log(typeof b); // "object"
var c = { };
console.log(typeof c); // "object"

对于数组和对象都返回"object"，因此我们日常开发中一个常见需求就是如何判断变量是数组还是对象。

类型判断

类型判断，一般就是判断是否是数组，是否是空对象。这是针对这个需求，我日常用过或见过的判断方法

判断是否是数组

有数组：var a = [1,2,3,4,5];

方法一：

toString.call(a); // "[object Array]"方法二：

a instanceof Array; //true方法三：

a.constructor == Array; //true 第一种方法比较通用，也就是Object.prototype.toString.call(a)的简写。

instanceof和constructor判断的变量，必须在当前页面声明的，比如，一个页面（父页面）有一个框架，框架中引用了一个页面（子页面），在子页面中声明了一个a，并将其赋值给父页面的一个变量，这时判断该变量，Array == object.constructor会返回false；

var a = [1,2,3,4,5];
console.log(toString.call(a)); // "[object Array]"
console.log(a instanceof Array); //true
console.log(a.constructor == Array); //true

判断是否是空对象

有变量：var obj = {};

方法一：

JSON.stringify(obj); // "{}"通过转换成JSON对象来判断是否是空大括号

方法二：

if(obj.id){ //如果属性id存在....}这个方法比较土，大多数人都能想到，前提是得知道对象中有某个属性。

方法三：

function isEmptyObject(e) {
var t; for (t in e) return !1; return !0 } //trueisEmptyObject(obj);
//falseisEmptyObject({ "a":1, "b":2});

这个方法是jQuery的isEmptyObject()方法的实现方式。

以上这篇基于javascript中的typeof和类型判断(详解)就是小编分享给大家的全部内容了，希望能给大家一个参考，也希望大家多多支持我们。

赞 (0)

相关推荐

  • isArray()函数(JavaScript中对象类型判断的几种方法)

    1) typeof 运算符 typeof 是一元运算符,返回结果是一个说明运算数类型的字符串.如:"number","string","boolean","object","function","undefined"(可用于判断变量是否存在). 但 typeof 的能力有限,其对于Date.RegExp类型返回的都是"object".如: typeof {}; //

  • 浅谈js数据类型判断与数组判断

    写在开篇: 昨天面试发现一个十分非常简单的问题竟然没有回答上来,可能也确实是因为太紧张了,感觉被自己蠢哭了.后来想想还是应该认真记录一下,这样才能印象深刻.革命尚未成功,壮实仍需努力! 1. js六大数据类型 number:数字,整数.浮点数等等, string:单引号或者双引号来说明, Boolean:返回true和false,这两个值不一定对应1和0 object:对象,可以执行new操作符后跟要创建的对象类型的名称来创建. null:只有一个值得数据类型,逻辑上讲,null值表示一个空对象

  • 详解js类型判断

    js类型转换中typeof会将null也识别为object, 而且返回的类型比少,我们用Object.prototype.toString来实现 第一版 function isArray(value){ return Object.prototype.toString.call(value) === "[object Array]"; } function isFunction(value){ return Object.prototype.toString.call(value) =

  • javascript 类型判断代码分析

    复制代码 代码如下: var is = function(obj,type){ var toString=Object.prototype.toString,undefined; return obj===null&&type==='Null'|| obj===undefined&&type==='Undefined'|| toString.call(obj).slice(8,-1)===type; } //原文中有小括号包裹每个逻辑与运算,但根据运算符优先级,括号可以省略

  • javascript中怎么做对象的类型判断

    javascript中怎么做对象的类型判断

    最近在翻看John Resig的大作<Pro JavaScript Techniques>,里面讲到了如何做javascript的类型判断的问题.文中介绍了两种方式,一种是使用typeof,另一种是使用constructor.略感遗憾的是作为jquery的作者,他尽然没有介绍jquery使用的类型判断方式.不过没有关系,我在这里给大家一起总结下. 在这里我首先像大家推荐一个很好用的在线编辑器:http://jsfiddle.net/.他提供了jquery.mootools.prototype和

  • JavaScript 页面编码与浏览器类型判断代码

    获取页面的编码,如果是IE浏览器用document.charset即可获取,如果用firefox需要用document.characterSet获取. 复制代码 代码如下: function getPageCharset(){ var charSet = ""; var oType = getBrowser(); switch(oType){ case "IE": charSet = document.charset; break; case "FIREF

  • js判断上传文件类型判断FileUpload文件类型代码

    asp.net中html标签代码: 复制代码 代码如下: <asp:FileUpload ID="fuMain" runat="server" /> <asp:Button ID="btnUpload" runat="server" OnClientClick="return CheckWorkFile()" Text="上传" /> 普通的html标签: 复制代

  • 关于JavaScript和jQuery的类型判断详解

    对于类型的判断,JavaScript用typeof来进行. 栗子: console.log(typeof null); //object console.log(typeof []); //object console.log(typeof {}); //object console.log(typeof new Date()); //object console.log(typeof new Object); //object console.log(typeof function(){});

  • 基于javascript中的typeof和类型判断(详解)

    typeof ECMAScript 有 5 种原始类型(primitive type),即 Undefined.Null.Boolean.Number 和 String.我们都知道可以使用typeof运算符求得一个变量的类型,但是对引用类型变量却只会返回object,也就是说typeof只能正确识别基本类型值变量. var a = "abc"; console.log(typeof a); // "string" var b = 123; console.log(t

  • JavaScript中object和Object的区别(详解)

    JavaScript中object和Object的区别(详解)

    JavaScript中object和Object有什么区别,为什么用typeof检测对象,返回object,而用instanceof 必须要接Object呢 这个问题和我之前遇到的问题非常相似,我认为这里有两个问题需要解决,一个是运算符new的作用机制,一个是function关键字和Funtion内置对象之间的区别.看了一些前辈的博客和标准,这里帮提问者总结一下. 1.new new运算符的作用是创建一个对象实例.这个对象可以是用户自定义的,也可以是带构造函数的一些系统自带的对象.如果 new

  • JavaScript 中有关数组对象的方法(详解)

    JS 处理数组多种方法 js 中的数据类型分为两大类:原始类型和对象类型. 原始类型包括:数值.字符串.布尔值.null.undefined 对象类型包括:对象即是属性的集合,当然这里又两个特殊的对象----函数(js中的一等对象).数组(键值的有序集合). 数组元素的添加 arrayObj.push([item1 [item2 [. . . [itemN ]]]]); 将一个或多个新元素添加到数组结尾,并返回数组新长度 arrayObj.unshift([item1 [item2 [. . .

  • 基于js中this和event 的区别(详解)

    今天在看javascript入门经典-事件一章中看到了 this 和 event 两种传参形式.因为作为一个初级的前端开发人员平时只用过 this传参,so很想弄清楚,this和event的区别是什么,什么情况下用什么比较合适. onclick = changeImg(this)       vs     onclick = changeImg(event) <img src='usa.gif' onclick="changeImg(event)" /> <scrip

  • JavaScript中关键字 in 的使用方法详解

    for-in循环应该用在非数组对象的遍历上,使用for-in进行循环也被称为"枚举". 对于数组 ,迭代出来的是数组元素 但不推荐,因为不能保证顺序,而且如果在Array的原型上添加了属性,这个属性也会被遍历出来,所以 最好数组使用正常的for循环,对象使用for-in循环 对于对象 ,迭代出来的是对象的属性: var obj = { "key1":"value1", "key2":"value2", &q

  • 基于Java中throw和throws的区别(详解)

    系统自动抛出的异常 所有系统定义的编译和运行异常都可以由系统自动抛出,称为标准异常,并且 Java 强烈地要求应用程序进行完整的异常处理,给用户友好的提示,或者修正后使程序继续执行. 语句抛出的异常 用户程序自定义的异常和应用程序特定的异常,必须借助于 throws 和 throw 语句来定义抛出异常. throw是语句抛出一个异常. 语法:throw (异常对象); throw e; throws是方法可能抛出异常的声明.(用在声明方法时,表示该方法可能要抛出异常) 语法:[(修饰符)](返回

  • JavaScript中数组随机排序的实现详解

    目录 一.原地算法 二.Array.property.sort() 1.方法一(不推荐) 2.方法一改良 三.洗牌算法实现随机排序 1.换牌 2.抽牌 一.原地算法 在谈sort之前,我们先了解一下原地算法,什么事原地算法呢?所谓原地算法就是说基于原有的数据结构进行一定的操作修改,而不借助额外的空间.使用原地算法时,其内存干净,空间复杂度是O(1),可以减少没必要的内存,避免造成内存浪费和冗余.当然,减小内存损耗会带来算法复杂度和时间消耗的增加,所以是一个Tradeoff.Tradeoff 是一

  • 基于python中staticmethod和classmethod的区别(详解)

    例子 class A(object): def foo(self,x): print "executing foo(%s,%s)"%(self,x) @classmethod def class_foo(cls,x): print "executing class_foo(%s,%s)"%(cls,x) @staticmethod def static_foo(x): print "executing static_foo(%s)"%x a=A(

  • Javascript中的迭代、归并方法详解

    迭代方法 在Javascript中迭代方法个人觉得尤为重要,在很多时候都会有实际上的需求,javascript提供了5个迭代方法来供我们操作,它们分别为: every() 对数组中的每一个项运用给定的函数,如果每项都返回true,那么就会返回true filter() 对数组中的每一个项运用给定的函数,把返回true的项组成一个新数组并返回 forEach() 对数组中的每一项运用给定的函数,但是没有任何的返回值 map() 对数组中的每一个项运用给定的函数并返回每次函数调用的结果组成新的数组

随机推荐