js类型判断及鸭式辨型
目录
三种检测对象的类方式: instanceof、constructor 、构造函数名字
用法如下:
1)instanceof
console.log([1,2,3] instanceof Array); true console.log([1,2,3] instanceof Object); true
尽管构造函数是原型的唯一标识,instanceof运算符的右操作数是构造函数,instanceof实际计算过程中检测的是对象的继承关系,而不是检测的创建对象时的构造函数,只是使用了构造函数作为中介
当然也可以使用isPrototypeOf 来判断一个对象是否存在于另一对象的原型链中,此时不使用构造函数作为中介
var a1 = new Array(); console.log(Array.prototype.isPrototypeOf(a1)); true console.log(Array.prototype.isPrototypeOf([1,2,3])); true
注意:多个执行上下文时(例如存在不同框架时)instanceof使用有限制
2)constructor
每个javascript函数都可以用作构造函数,调用构造函数需要使用prototype属性,因而每个javascript函数会自动拥有prototype属性,这个属性值是一个对象,这个对象包含一个contructor属性,constructor属性值是一个函数对象。
即对于函数var F = function(){}; F.prototype.constructor===F
关系图如下:
eg:
var F= function(){}; var p = F.prototype; var c = p.constructor; console.log(p); console.log(c); console.log(c===F);
Object {} function (){} true
因而对象继承的constructor均指代他们的构造函数
eg:
var o= new F(); console.log(o.constructor===F);
//输出
true
var a = new Array(); console.log(a.constructor===Array);
//输出
true
function typeDiscern(x){ switch(x.constructor){ case Number: return "Number:"+x; case String: return "String:"+x; case Array: return "Array:"+x; } } console.log(typeDiscern([1,2,3])); console.log(typeDiscern("abc")); console.log(typeDiscern(5));
//输出
Array:1,2,3 String:abc Number:5
注意: 同instanceof在多个上下文下没法使用,另外并不是所有的对象都包含constructor属性
eg:
定义Person类
function Person(name) { this.name=name; this.getName=function() { return this.name; } }; var wish=new Person(‘js‘); console.log(wish.constructor==Person); console.log(Person.prototype); console.log(Person.constructor); console.log(wish.getName());
//输出 true Person {} function Function() { [native code] } js
给Person自定义prototype
function Person(name) { this.name=name; this.getName=function() { return this.name; } }; Person.prototype={ toString: function(){ return this.name; } }; var wish=new Person(‘js‘); console.log(wish.constructor==Person); console.log(Person.prototype); console.log(Person.constructor); console.log(wish.getName()); console.log(wish.toString());
//输出 false Object {toString: function} function Function() { [native code] } js js
此时新定义的原型对象不含有constructor属性,因而Person的实例也不包含constructor属性
解决方法:可显示的给原型添加构造方法
Person.prototype={ constructor=Person, toString: function(){ return this.name; } };
构造函数名字
没有intanceof和constructor的执行上下文问题,一个窗口中的Array构造函数和另一个窗口内Array构造函数不等,但是构造函数名字相同,但是并不是每个函数都有名字
Function.prototype.getName= function(){ if("name" in this){ return this.name; } return this.name=this.toString().match(/function\s*([^(]*)/); } function test1(){ } console.log(test1.getName());
//输出: test1
鸭式辨型
关注对象能做什么,而不是对象的类是什么
James Whitcomb Riley提出像鸭子一样走路、游泳和嘎嘎叫的鸟就是鸭子
主要对象包含walk(),swim(),bike()这三个方法就可以作为参数传入
利用鸭式辩型实现的函数:
function quackImplements(o/*,...*/){ for(var i=1; i<arguments.length;i++){ var arg=arguments[i]; switch(typeof arg){ case ‘string‘: if(typeof o[arg]!=="function") return false; continue; case ‘function‘: arg=arg.prototype; case ‘object‘: for (var m in arg){ if(typeof arg[m]!=="function") continue; if(typeof o[m]!=="function") return false; } } } return true; }
对于字符串直接检查命名方法
对于对象检查是否有同名方法
对于函数检查构造函数的原型对象中是否有相同方法
在javascript中很多函数都不对对象做类型检测只是关心这些对象能做什么
eg:Array的prototype利用了鸭式辨型,arguments是伪数组
(function () { var arr = Array.prototype.slice.apply(arguments); console.log(arr); })(1, 2, 3);
//输出: [1, 2, 3]
var arr = Array.prototype.slice.apply({ 0: 1, 1: 2, 2: 3, length: 3 }); console.log(arr); //输出: [1, 2, 3]
使用鸭式辨型可以扩大对象的使用范围
eg:让普通对象具有数组的push方法
Function.prototype.unCurrying = function () { var f = this; return function () { var a = arguments; return f.apply(a[0], [].slice.call(a, 1)); }; }; Function.prototype.unCurrying = function () { return this.call.bind(this); }; var push = Array.prototype.push.unCurrying(), obj = {}; push(obj, ‘first‘, ‘two‘); console.log(obj); console.log("length:"+obj.length)
输出:
Object{0: "first", 1: "two", length: 2}
length:2
参考:javascript权威指南
http://www.cnblogs.com/pigtail/p/3450852.html
郑重声明:本站内容如果来自互联网及其他传播媒体,其版权均属原媒体及文章作者所有。转载目的在于传递更多信息及用于网络分享,并不代表本站赞同其观点和对其真实性负责,也不构成任何其他建议。