JavaScript数据检测
2015-09-25 17:26
513 查看
前言:
随着编程实践的增加,慢慢发现关于数据类型的检测至关重要。我认为程序就是为了处理数据和展示数据。所以,数据的检测对于编程来说也至关重要。因为只有符合我们预期的输入,才可能产生正确的输出。众所周知,JavaScript是弱类型语言,这带来很多便利的同时,也带来了不少问题。为了减少编程实践中在变量判断方面出现的问题,我们需要对不确定的变量进行检测,以保证处理符合预期的数据。本文是对数据检测的总结。1.检测原始值
ECMAScript 有 5 种原始类型(primitive type),即 Undefined、Null、Boolean、Number 和 String。对于原始值,我们可以使用typeof来检测。// 检测字符串 typeof "str" // 返回"string" // 检测数字 typeof 123 // 返回"number" // 检测布尔值 typeof true // 返回"boolean" // 检测undefined typeof undefined // 返回"undefined" // 检测null typeof null // 返回"object"
typeof运算符有个很独特的地方就是,当我们检测一个未声明的变量时也不会报错。未定义的变量和undefined的变量通过typeof检测都将返回“undefined”。
还有就是当我们用typeof检测null变量时,返回的是“object”而不是“null”。null一般是不用于检测语句的,简单地和null比较通常不会包含足够的信息以判断值的类型是否合法。但,当所期望的值确定是null,则可以和null直接比较(===和!==)。
2.检测引用值
引用值也称为对象,在js中除了原始值之外的值都是引用,如Object、Function、Array、String、Boolean、Number、Date等。由于使用typeof检测引用类型时,返回的是“object”,我们并不能真正的获得引用类型的详细信息。而instanceof运算符可以解决这个问题,instanceof 运算符与 typeof 运算符相似,用于识别正在处理的对象的类型。与 typeof 方法不同的是,instanceof 方法要求开发者明确地确认对象为某特定类型。基本用法为:value instanceof constructor
其含义是判断一个value是否为constructor对象的实例,如果是则返回true,否则返回false。
instanceof并不仅仅止步于检测构造这个对象的构造器,它还会沿着原型链进行检测。示例如下:
var now = new Date(); console.log(now instanceof Date); // 输出:true console.log(now instanceof Object); // 输出:true
在默认情况下,每个对象都继承自Object,因此每个对象的 value instanceof Object都会返回true,使用这个方法来判断对象是否属于某个特定类型的做法并非最佳。
instanceof运算符也可以用来检测自定义类型,示例如下:
function BasicType() { this.property=true; this.getBasicValue = function(){ return this.property; }; } function NewType() { this.subproperty=false; } NewType.prototype = new BasicType(); var test = new NewType(); console.log(test instanceof NewType); // 输出:true console.log(test instanceof BasicType); // 输出:true console.log(test instanceof Object); // 输出:true
在JavaScript中检测自定义类型时,最好的做法就是使用instanceof运算符,这也是唯一的方法。
3.检测属性
另外一种用到null(以及undefined)的场景是当检测一个属性是否在对象中存在时,比如:// 不好的写法:检测假值 if (object[propertyName]) { // code } // 不好的写法:和null比较 if (object[propertyName] != null) { // code } // 不好的写法:和undefined比较 if (object[propertyName] != undefined) { // code }
在上例中,实际上是通过给定的属性名来检测属性的值,而非判断属性是否存在,因为当属性值为假值时结果超出我们的预期,比如0、""、false、null和undefined时。如果我们要检测的属性值为null或者undefined时,以上是哪个判断都会出错。
判断属性是否存在的最好方法是使用in运算符。in运算符只会判断属性存在与否,而不管属性值,这样就避免了上面问题的产生。
var object = { count: 0, name: null }; // 好的写法 if ("count" in object) { // 执行代码 }; // 不好的写法:检测假值 if (object["count"]) { // 不执行代码 }; // 好的写法 if ("name" in object) { // 执行代码 }; // 不好的写法:检测是否为null if (object["name"] != null) { // 不执行代码 };
但还有一点需要注意,in运算符也会检测原型链上的所有属性,无论是实例上还是继承对象的原型上具有目标属性,都会返回true。如果需要检测对象的某个属性是否存在,则需要使用hasOwnProperty()方法。所有继承自Object的JS对象都有这个方法,如果实例中包含这个属性则返回true(如果这个属性只存在在原型中则返回false)。
然而,在IE8以及更早版本的IE中,DOM对象并非继承自Object,也就不包含hasOwnProperty()方法。我们在使用hasOwnProperty()方法时,应该先检测是否存在这个方法。
var object = { count = 0, name = null }; // 对于所有的非DOM对象来说,这是最好的实现 if (Object.hasOwnProperty("name")) { // 执行代码 } // 对于所有不确定是否为DOM的对象来说,应该这样实现 if ("hasOwnProperty" in Object && Object.hasOwnProperty("name")) { // 执行代码 }
不管在任何情况下检测属性的存在性,最好使用in运算符或者hasOwnProperty(),这样可以避免很多bug。
相关文章推荐
- 不开webServer让chrome能读取本地json等文件
- javascript学习笔记(一)
- jstack 线程状态
- json obj map 互转utils
- 移动开发js库Zepto.js应用详解
- 150925-周五不干活-HTML(CSS),Javascript
- JavaScript进阶内容1:各种对象类型检测
- js 正则表达式
- JSONP原理
- JS设计模式-工厂模式
- 解决IE8以上乱码
- Javascript 保存到本地
- javascript--内置函数
- JS 中如何判断 undefined 和 null
- extjs 表格可复制
- js 与或运算符 || && 妙用
- NetJson 解析字符串
- Javascript立即执行函数
- JavaScript的DOM编程--09--节点的替换
- Javascript立即执行函数