`

jQuery中对象字面量形式判断的原理及实现

阅读更多
//测试Chrome版本  40.0.2214.115 m

//如有错误欢迎指出
//isPlainObject才是重点
//下面的一些方法前面都做了分析
//如有不懂可以看下我以前对这些方法的说明

var toString={}.toString;
var class2type={};
var hasOwn={}.hasOwnProperty;
var isArray=Array.isArray;
var indexOf=[].indexOf;

var each=function(obj,callback){
	var 
		value,
		length=obj.length,
		i=0,
		isArray=isArrayLike(obj);
		//两种情况
		//类数组
		if(isArray){
			for(;i<length;i++){
				//若是返回false,则直接跳出
				value=callback.call(obj,i,obj[i]);
				if(value===false){
					break;
				}
			}
		}else{
			for(i in obj){
				value=callback.call(obj,i,obj[i]);
				if(value===false){
					break;
				}
			}
		}
		return obj;
};

//第二个判断是否像数组一样的对象

var isArrayLike=function(obj){
	var 
		length=obj.length;
		
	//判断为空
	if(obj==null){
		return false;
	}
	
	if(type(obj)==="object" ||typeof(obj)==="function"){
		return false;
	}
	
	return type(obj)==="array" ||length===0 || (length>0 &&(length-1) in obj);
};


//第三个判断类型
var type=function(obj){
	//排除为空的
	if(obj==null){
		return obj+"";
	}
	//做判断,如果是object或者function类型的时候
	//不是执行后面
	return  typeof obj==="object" ||typeof obj==="function"  ? class2type[toString.call(obj)] : typeof obj;
};

each("Boolean Number String Function Array Date RegExp Object Error".split(" "),function(_,name){
	class2type["[object "+name+"]"]=name.toLowerCase();  
});


var isFunction=function(obj){
	return type(obj);
};
var isWindow=function(obj){
	return obj!==null && obj.window===window;
};

//本次重点来了
//字面量对象判断
//判断之前做一个测试,形如 {}
var isPlainObject=function(obj){
	//第一判断,如果不是object类型直接返回false
	//第二判断是否是节点类型
	//第三window
	if(type(obj)!=="object" ||obj.nodeType||isWindow(obj)){
		return false;
	}
	//当是{}或者是new Object() 时为真,这两种是符合的  只有object对象的原型中有这个方法
	if(hasOwn.call(obj.constructor.prototype,"isPrototypeOf")){
		return true;
	}
	
};

console.info(isPlainObject(window));
console.info(isPlainObject({}));
console.info(isPlainObject(new Object()));
console.info(isPlainObject(new Date()));
var d=new Object();
d.namexx='fsafa';
d.xx=function(){};


var c=function(){
	this.namess="xxx";
	this.fas=function(){};
};
//来看下  hasOwn.call(obj.constructor.prototype,"isPrototypeOf") 这句话到底是什么东东
//首先支hasOwnProperty做个说明 hasOwnProperty:
//是用来判断一个对象是否有你给出名称的属性或对象。//
//此方法无法检查该对象的原型链中是否具有该属性,该属性必须是对象本身的一个成员。
console.info("c "+c.constructor);
console.info("c "+c.constructor.prototype);

console.info("d "+d.constructor);
console.info("d "+d.constructor.prototype);//[object Object] //这个下面才有isPrototypeOf方法

console.info("{} "+{}.constructor);
console.info("{} "+{}.constructor.prototype);//[object Object]

console.log(d);//__proto__: Object -->isPrototypeOf: function isPrototypeOf() { [native code] }
console.log(new c());//__proto__: c --->__proto__: Object   constructor: function ()

 

分享到:
评论

相关推荐

Global site tag (gtag.js) - Google Analytics