最近看到了很多关于数据类型判断的方法,总结了下

一、javascript的数据类型

js数据分为两种类型:原始数据类型引用数据类型
原始数据类型有:string、number、boolean、undefined和null
引用数据类型有:Function、Object、Date、RegExp、Number、String、Boolean和自定义类等

其中原始数据类型也称基础数据类型,是不可拆分的数据类型,他存在于栈中;而引用数据类型也是通常意义上所说的,存在于堆中。
这两者的一个重要的区别在于原始数据类型在赋值的时候使用的是传值的方式,而引用数据类型在赋值时使用的是传址(指针)的方式。

var str1 = "string";
var str2 = str1;
str2 = "another string";
alert(str1); //"string" var obj1 = {key1:1};
var obj2 = obj1;
obj2.key1 = 2;
alert(obj1.key1) //

二、javascript类型判断

1、typeof()函数
对于原始数据类型,我们可以使用typeof()函数来判断他的数据类型:

typeof(1)                              //number
typeof("1") //string
typeof(true) //boolean
typeof(undefined) //undefined
typeof(null) //object

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

2、instanceof
typeof()函数对于原始类型的判断还差强人意,但他是没法用来区分引用数据类型的,因为所有的引用数据类型都会返回"object"。于是javascript引入了java中使用的instanceof,用来判断一个变量是否是某个对象的实例,所以对于引用类型我们使用instanceof来进行类型判断。

var obj = {};
obj instanceof Object; //true var arr = [];
arr instanceof Array; //true var now = new Date();
now instanceof Date; //true var func = function(){};
func instanceof Function; //true var str = "string";
str instanceof String; //false

如上面所示,instanceof对于引用类型的支持很好,但他是无法对原始类型进行判断,所以一般都是在typeof判断为object时才使用instanceof。

3、Object.prototype.toString.call()
在javascript高级程序设计中提供了另一种方法,可以通用的来判断原始数据类型和引用数据类型,先看代码:

var num1 = 1;
var num2 = new Number(1);
Object.prototype.toString.call(num1) == "[object Number]"; //true
Object.prototype.toString.call(num2) == "[object Number]"; //true var arr = [];
Object.prototype.toString.call(arr) == "[object Array]"; //true var func = function(){};
Object.prototype.toString.call(func) == "[object Function]"; //true function A(){};
var a = new A();
Object.prototype.toString.call(a) == "[object Object]"; //true

如上所示,这个方法提供了一个通用的数据类型判断模式,虽然对于自定义类的判断还没法做到,但在日常的类型判断中我们更多的是针对非自定义类,对于自定义类我们也可以转使用instanceof来进行判断,所以这种方法可以成为一种通用的类型判断方法。

下面附上常用的类型判断函数集合:

var valide = (function(){
// 是否是字符串
function isString(value){
return Object.prototype.toString.call(value) == "[object String]";
}
// 是否是数字
function isNumber(value){
return Object.prototype.toString.call(value) == "[object Number]";
}
// 是否是布尔值
function isBoolean(value){
return Object.prototype.toString.call(value) == "[object Boolean]";
}
// 是否undefined
function isUndefined(value){
return Object.prototype.toString.call(value) == "[object Undefined]";
}
// 是否是null
function isNull(value){
return Object.prototype.toString.call(value) == "[object Null]";
}
// 是否数组
function isArray(value){
return Object.prototype.toString.call(value) == "[object Array]";
}
// 是否是函数
function isFunction(value){
return Object.prototype.toString.call(value) == "[object Function]";
}
// 是否是对象
function isObject(value){
return Object.prototype.toString.call(value) == "[object Object]";
}
// 是否是正则表达式
function isRegExp(value){
return Object.prototype.toString.call(value) == "[object RegExp]";
}
// 是否是日期对象
function isDate(value){
return Object.prototype.toString.call(value) == "[object Date]";
}
return {
isString: isString,
isNumber: isNumber,
isBoolean: isBoolean,
isUndefined: isUndefined,
isNull: isNull,
isArray: isArray,
isFunction: isFunction,
isObject: isObject,
isRegExp: isRegExp,
isDate: isDate
};
})();

4、constructor

在W3C定义中的定义:constructor 属性返回对创建此对象的数组函数的引用

就是返回对象相对应的构造函数。从定义上来说跟instanceof不太一致,但效果都是一样的

如: (a instanceof Array)   //a是否Array的实例?true or false

   (a.constructor == Array)  // a实例所对应的构造函数是否为Array? true or false

举个例子:

function employee(name,job,born){
this.name=name;
this.job=job;
this.born=born;
} var bill=new employee("Bill Gates","Engineer",1985);
console.log(bill.constructor); //输出function employee(name, jobtitle, born){this.name = name; this.jobtitle = job; this.born = born;}

那么判断各种类型的方法就是:

console.log([].constructor == Array);
console.log({}.constructor == Object);
console.log("string".constructor == String);
console.log((123).constructor == Number);
console.log(true.constructor == Boolean);

较为严谨并且通用的方法:

function isArray(object){
return object && typeof object==='object' &&
Array == object.constructor;
}

!!注意:

使用instaceof和construcor,被判断的array必须是在当前页面声明的!比如,一个页面(父页面)有一个框架,框架中引用了一个页面(子页面),在子页面中声明了一个array,并将其赋值给父页面的一个变量,这时判断该变量,Array == object.constructor;会返回false;
原因:
1、array属于引用型数据,在传递过程中,仅仅是引用地址的传递。
2、每个页面的Array原生对象所引用的地址是不一样的,在子页面声明的array,所对应的构造函数,是子页面的Array对象;父页面来进行判断,使用的Array并不等于子页面的Array;切记,不然很难跟踪问题!

/*********************************************************/

补充jquery判断js数据类型

$.isArray([1,2]);              // 数组
$.isFunction(function () { }); // 函数function
$.isEmptyObject(null); // null,undefind
$.isXMLDoc(); // xml
typeof (2) === "number"; // 数字
typeof ("2") === "string"; // 字符串
typeof (true) === "boolean";// bool型
typeof (function () { }) === "function";// 函数function

javascript数据类型的判断的更多相关文章

  1. javaScript数据类型及判断

    ECMAScript数据类型概念: ECMAScript数据类型分为两类:原始类型和对象类型(即基本类型和引用类型): ECMAScript数据类型也可以分为可变类型和不可变类型,数组和对象属于可变类 ...

  2. JavaScript学习总结(2)——JavaScript数据类型判断

    最近做项目中遇到了一些关于javascript数据类型的判断处理,上网找了一下资料,并且亲自验证了各种数据类型的判断,在此做一个总结吧! 一.JS中的数据类型  1.数值型(Number):包括整数. ...

  3. 关于 JavaScript 数据类型判断

    在 JavaScript 中,有 undefined.null.number.string.boolean 五种基本数据类型,另外,有一种复杂数据类型 object ,类似于 C# 中值类型.引用类型 ...

  4. JavaScript数据类型判断的四种方法

    码文不易啊,转载请带上本文链接呀,感谢感谢 https://www.cnblogs.com/echoyya/p/14416375.html 本文分享了JavaScript类型判断的四种方法:typeo ...

  5. javascript中怎么判断两个数据类型相等

    在 JavaScript 中,判断一个变量的类型尝尝会用 typeof 运算符,在使用 typeof 运算符时采用引用类型存储值会出现一个问题,无论引用的是什么类型的对象,它都返回 "obj ...

  6. Javascript:Javascript数据类型详解

    要成为一个优秀的前端工程师,系统的学习Javascript,有夯实的Javascript基础,以及对语言本身的深刻的理解,是基本功.从Javascript数据类型开始,我将对Javascript知识体 ...

  7. 第九十九节,JavaScript数据类型

    JavaScript数据类型 学习要点: 1.typeof操作符 2.Undefined类型 3.Null类型 4.Boolean类型 5.Number类型 6.String类型 7.Object类型 ...

  8. javascript学习-类型判断

    javascript学习-类型判断 1.类型判断的的武器 javascript中用于类型判断的武器基本上有以下几种: 严格相等===,用来判断null,undefined,true,false这种有限 ...

  9. JavaScript复习之--javascript数据类型隐式转换

    JavaScript数据类型隐式转换.一,函数类    isNaN()    该函数会对参数进行隐式的Number()转换,如果转换不成功则返回true.    alert()    输出的内容隐式的 ...

随机推荐

  1. html 页内跳转

    第一种 <a href="#div1">to div1</a> //跳转链接<div id="div1">div1</ ...

  2. <a>标签缺少href 属性,鼠标经过不会出现手型

    声明: web小白的笔记,欢迎大神指点.联系QQ:1522025433. 直接看实例吧! <!doctype html> <html> <head> <met ...

  3. Bootstrap表格中,thead固定,tbody有垂直滚动条

    1.html源码:这里的table是使用的vue写法,实际生成的表格和一个一个写的tr th td无异 <div class="panel-body no-padding"& ...

  4. Kibana加载样本数据

    kibana 6.2 加载样本数据 kibana loading sample data 下载样本数据 # 莎士比亚经典作品 wget https://download.elastic.co/demo ...

  5. LICEcap方便快捷制作gif图片的工具

    总是看见别人的博客里面动态的小图片,是不是有种冲动自己也想搞,但是就是不知道咋搞,这里简单介绍一款很实用的制作gif的软件. LICEcap的网址:http://www.cockos.com/lice ...

  6. mysql 查看正在执行的语句

    一.不完全显示: show processlist 二.完全显示: show full processlist

  7. java实现判断一个经纬度坐标是否在一个多边形内(经自己亲测)

    1.在高德地图上绘制的多边形:经纬度逗号分隔格式:上面是用来方便存坐标的对象:下面是方法测试:直接复制代码即可运行 public class Point { private Double x; pri ...

  8. Python安装scrapy过程中出现“Failed building wheel for xxx”

    https://www.lfd.uci.edu/~gohlke/pythonlibs/#lxml Python安装scrapy库过程中出现“ Failed building wheel for xxx ...

  9. moodle 笔记

    默认版块的设置: //这些变量为新课程定义了DEFAULT块变量如果设置了这个变量,它将覆盖所有其他变量,并且是唯一使用的变量s $CFG->defaultblocks_override = ' ...

  10. Android系统下用js自定义gesture事件(仿ios实现移动端事件一致)

    .katex { display: inline-block; text-align: initial; } .katex { font-family: Consolas, Inconsolata, ...