源码网商城,靠谱的源码在线交易网站 我的订单 购物车 帮助

源码网商城

如何检测JavaScript的各种类型

  • 时间:2022-12-13 23:26 编辑: 来源: 阅读:
  • 扫一扫,手机访问
摘要:如何检测JavaScript的各种类型
[b]一、先介绍下5种原始类型[/b] JavaScript中5种原始类型为[b]string[/b],[b]number[/b],[b]boolean[/b],[b]undefined[/b],[b]null[/b]
var name = "Jack";
var age = 32;
var single = false;
var app;  //undefined

console.log(typeof name);  //string
console.log(typeof age);  //number
console.log(typeof single); //boolean
console.log(typeof app);  //undefined
console.log(typeof null);  //object
发现[b]除null外[/b]的其他4种基本类型均可以用[b]typeof[/b]来识别:
if(typeof name === "string") { name += "Zhang"; }
if(typeof age === "number") { age++; }
if(typeof single === "boolean" && single) { … }
if(typeof app === "undefined") { app = {}; }
因为typeof null会得到object,所以直接用===来检测null:
if(el === null) { … }
[b]二、对象[/b] JavaScript的对象包括内置对象([b]Date,RegExp ,Error[/b]等)和[b]自定义对象[/b]。 (注意,Function和Array虽然也都是内置对象,但下一节单独讲) 对象不能像基本类型那样用[b]typeof[/b]来检测了,因为检测出来的结果都是[b]object[/b]:
console.log(typeof new Date());  //object
console.log(typeof new RegExp()); //object
console.log(typeof new Error());  //object
console.log(typeof new Person()); //用typeof检测出自定义对象也是object
[b]要改用instanceof来检测:[/b]
var date = new Date();
var reg = new RegExp();
var err = new Error();
var me = new Person();

if(date instanceof Date) {  //检测日期
  year = date.getFullYear(); 
}
if(reg instanceof RegExp) {  //检测正则表达式
  reg.test(...); 
}
if(err instanceof Error) {  //检测异常
  throw err; 
}
if(me instanceof Person) {  //检测自定义对象
  ... 
}
但自定义对象有个问题,假设浏览器frameA里和frameB里都定义了Person。 frameA里定义了me对象,用[code]me instanceof Person[/code]检测出来为true。但当自定义对象me传给frameB后,在frameB里instanceof会是false。 本节一开头就说了,Function和Array虽然也都是内置对象,但留到下一节讲。原因就是Function和Array也有和自定义对象相同的上述问题。因此Function和Array一般不用instanceof [b]三、Function[/b] 上面说了用instanceof检测Function不能跨frame。因此用typeof来检测,它可跨frame:
var func = function(){};
if(typeof func === 'function') { … }
但IE8以前用typeof来检测DOM系函数会得到object,因此IE8以前改用in:
console.log(typeof document.getElementById);    //object,不是function
console.log(typeof document.getElementsByTagName); //object,不是function
console.log(typeof document.createElement);     //object,不是function

//IE8以前的IE浏览器,要改用in来检测是否支持DOM函数
if("getElementById" in document) { … }    
if("getElementsByTagName" in document) { … }
if("createElement" in document) { … }
[b]四、Array[/b] 上面说了用instanceof检测Array不能跨frame。ES5之前都自定义检测方法。其中最精确的方法:[b]依赖Array的toString会返回固定字符串”[Object Array]”的事实来检测[/b]:
function isArray(arr) {
  return Object.prototype.toString.call(arr) === "[Object Array]";
}
该方法精确且优雅,因此被很多库所采纳,最终在ES5被作为isArray方法引入了Array,参照MDN。现在你不需要自定义检测方法了,直接用[b]isArray()[/b]即可。 其他检测方法,都各有缺陷,不能100%精确。但作为一种思路是可以借鉴的。例如依赖Array是唯一包含sort方法的对象的事实来检测:
function isArray(arr) {
  return typeof arr.sort === "function";
}
如果是自定义对象也定义了sort方法,该方法就失效了。 [b]五、属性 [/b] 检测属性是否在实例对象中应该用[b]hasOwnProperty[/b]。如果你不关心属性是在实例对象中还是在原型对象中,可以简单点用in 例如检测字面量对象属性:
var Person = {
  name: "Jack",
  age: 33
};
if("name" in Person) { … }         //true
if(Person.hasOwnProperty("name")) { … }  //true
[b]例如实例对象属性:[/b]
var Person = function (name, age) {
  this.name = name;
  this.age = age;
};
Person.prototype.location = "Shanghai";

var me = new Person("Jack", 33)
if("name" in me) { … }         //true
if(me.hasOwnProperty("name")) { … }  //true
if("location" in me) { … }       //true
if(me.hasOwnProperty("location")) { … }//false
[b]除此之外其他方法都不好:[/b]
if (object[propName])      //Not Good,你怎么知道属性值不是0或1?
if (object[propName] === null)    //Not Good,你怎么知道属性值不是null?
if (object[propName] === undefined)  //Not Good,你怎么知道属性值不是undefined?
[b]总结[/b] 用typeof检测string,number,boolean,undefined,Function 用===检测null 用isArray()检测Array 用instanceof检测内置对象(除Function和Array)和自定义对象 用hasOwnProperty检测属性是否在实例对象中。如果你不关心属性是在实例对象中还是在原型对象中,可以简单点用in 好了,本篇介绍如何检测JavaScript各种类型的内容就到这里了,希望大家能够认真学习本文的内容,或许对大家学习JavaScript有所帮助。
  • 全部评论(0)
联系客服
客服电话:
400-000-3129
微信版

扫一扫进微信版
返回顶部