JavaScript中的constructor、instanceof、isPrototypeOf、typeof以及hasOwnProperty

转自:http://www.cnblogs.com/ArthurXml/p/6555509.html

1、hasOwnProperty和in

先来理解hasOwnProperty方法。这个方法是用来检查对象的非原型链属性,换句话说,也就是检查对象中用户自定义的属性,而且这些属性不是定义在prototype上的。通过下面的代码进行理解:

var myFunc=function(){
    this.foo=‘value‘;
};
myFunc.prototype.ok=‘ok‘;
thefunc=new myFunc();
console.log(
    thefunc.hasOwnProperty(‘foo‘),//true
    thefunc.hasOwnProperty(‘ok‘),//false
    myFunc.hasOwnProperty(‘foo‘),//false
    myFunc.prototype.hasOwnProperty(‘ok‘),//true这里有点特殊
    ‘ok‘ in thefunc,//true
    ‘foo‘ in thefunc,//true
    ‘ok‘ in myFunc.prototype,//true
    ‘ok‘ in myFunc//false
);

在上面的代码中,foo是用户自定义的非原型属性,而ok则是定义在prototype上的原型属性,所以thefunc.hasOwnProperty(‘foo‘)的值为true,thefunc.hasOwnProperty(‘ok‘)的值为false。

JavaScript语言中还有一个in操作符,用来检查一个对象的属性,包括来自原型链的属性。

2、constructor

每一个JavaScript函数(ECMAScript 5中的Function.bind()返回的函数除外)都自动拥有一个prototype属性。这个属性的值是一个对象,这个对象包含唯一一个不可枚举的属性constructor。构造函数实例都拥有指向其构造函数的constructor属性。constructor属性的值是一个函数对象:

var F=function(){};//这是一个函数对象
var P=F.prototype;//这是F相关联的原型对象
var C=P.constructor;//这是与原型相关联的函数
C===F;//true,对于任意函数F.prototype.constructor===F
//摘自JavaScript权威指南

在这里插入第一节里的代码,并扩展了一些,希望能够解释清楚构造函数和原型的关系:

var myFunc=function(){
    this.foo=‘value‘;
};
myFunc.prototype.ok=‘ok‘;
thefunc=new myFunc();
console.log(
    thefunc.constructor===myFunc, //true
    myFunc.constructor===Function,//true
    typeof thefunc,//object
    myFunc.prototype//Object(){ok=‘ok‘}
);

3、instanceof和isPrototypeOf

instanceof是JavaScript语言中的一种运算符。左操作数是待检测其类的对象,右操作数是定义类的构造函数。因此,没有使用构造函数的字面量形式定义的对象使用instanceof运算符时,无法找到其构造函数。

isPrototypeOf是用来判断要检查其原型链的对象是否存在于指定对象实例中,是则返回true,否则返回false。

var myFunc=function(){
    this.foo=‘value‘;
};
myFunc.prototype.ok=‘ok‘;
thefunc=new myFunc();
console.log(
    thefunc instanceof myFunc,//true
    myFunc instanceof Function,//true
    myFunc.prototype.isPrototypeOf(thefunc),//true
    Function.prototype.isPrototypeOf(myFunc),//true
    myFunc.prototype,//Object(){ok=‘ok‘}
    typeof thefunc,//object
    thefunc.prototype//undefined,这里没搞懂
);

细细品味会发现两者的区别主要是:

A.isPrototypeOf(B) 判断的是A对象是否存在于B对象的原型链之中
A instanceof B  判断的是B.prototype是否存在与A的原型链之中

所以就有下面的结论:

    如果 A.isPrototypeOf(B)  返回true 则B instanceof A 一定返回true

4、typeof

typeof是一元运算符,放在操作数的前面,操作数可以是任意类型。返回值为表示操作数类型的一个字符串。typeof是用来鉴别原始类型的最佳方法。

下面是以上几个操作的测试用例:

var myNumber = new Number(‘23‘);
var myNumberL = 23; // literal shorthand
var myString = new String(‘male‘);
var myStringL = ‘male‘; // literal shorthand
var myBoolean = new Boolean(‘true‘);
var myBooleanL = true; // literal shorthand
var myObject = new Object();
var myObjectL = {}; // literal shorthand
var myArray = new Array();
var myArrayL = []; // literal shorthand
var myFunction = new Function();
var myFunctionL = function() {}; // literal shorthand
var myDate = new Date();
var myRegExp = new RegExp(‘/./‘);
var myRegExpL = /./; // literal shorthand
var myError = new Error();

console.log( // all of these return true
    myNumber.constructor === Number,
    myNumberL.constructor === Number,
    myString.constructor === String,
    myStringL.constructor === String,
    myBoolean.constructor === Boolean,
    myBooleanL.constructor === Boolean,
    myObject.constructor === Object,
    myObjectL.constructor === Object,
    myArray.constructor === Array,
    myArrayL.constructor === Array,
    myFunction.constructor === Function,
    myFunctionL.constructor === Function,
    myDate.constructor === Date,
    myRegExp.constructor === RegExp,
    myRegExpL.constructor === RegExp,
    myError.constructor === Error

);
console.log( //others return true
    myNumber instanceof Number,
    myNumberL instanceof Number,//false
    myString instanceof String,
    myStringL instanceof String,//false
    myBoolean instanceof Boolean,
    myBooleanL instanceof Boolean,//false
    myObject instanceof Object,
    myObjectL instanceof Object,
    myArray instanceof Array,
    myArrayL instanceof Array,
    myFunction instanceof Function,
    myFunctionL instanceof Function,
    myDate instanceof Date,
    myRegExp instanceof RegExp,
    myRegExpL instanceof RegExp,
    myError instanceof Error
);
console.log( //others return true
    Number.prototype.isPrototypeOf(myNumber),
    Number.prototype.isPrototypeOf(myNumberL),//false
    String.prototype.isPrototypeOf(myString),
    String.prototype.isPrototypeOf(myStringL),//false
    Boolean.prototype.isPrototypeOf(myBoolean),
    Boolean.prototype.isPrototypeOf(myBooleanL),//false
    Object.prototype.isPrototypeOf(myObject),
    Object.prototype.isPrototypeOf(myObjectL),
    Array.prototype.isPrototypeOf(myArray),
    Array.prototype.isPrototypeOf(myArrayL),
    Function.prototype.isPrototypeOf(myFunction),
    Function.prototype.isPrototypeOf(myFunctionL),
    Date.prototype.isPrototypeOf(myDate),
    RegExp.prototype.isPrototypeOf(myRegExp),
    RegExp.prototype.isPrototypeOf(myRegExpL),
    Error.prototype.isPrototypeOf(myError)
);
console.log(
    typeof myNumber,//object
    typeof myNumberL,//number
    typeof myString,//object
    typeof myStringL,//string
    typeof myBoolean,//object
    typeof myBooleanL,//boolean
    typeof myObject,//object
    typeof myObjectL,//object
    typeof myArray,//object
    typeof myArrayL,//object
    typeof myFunction,//function
    typeof myFunctionL,//function
    typeof myDate,////object
    typeof myRegExp,//object
    typeof myRegExpL,//object
    typeof myError//object
);
时间: 2024-09-29 16:22:47

JavaScript中的constructor、instanceof、isPrototypeOf、typeof以及hasOwnProperty的相关文章

【转】JavaScript中的constructor与prototype

最初对js中 object.constructor 的认识: 在学习JS的面向对象过程中,一直对constructor与prototype感到很迷惑,看了一些博客与书籍,觉得自己弄明白了,现在记录如下: 我们都知道,在JS中有一个function的东西.一般人们叫它函数.比如下面的代码 function Person(name)   {     alert(name);   }   Person('js');//js 上面的代码中,Person的表现的确跟一般的函数没有什么区别,接着看下面的代码

JavaScript中的constructor和继承

概述 这是我在看JavaScript面向对象编程指南的时候,对constructor和继承的总结. 关于它们的详细知识,可以上网查到,所以我只写那些网上没有的. 内容 constructor的理解 constructor的实际用途 constructor的陷阱 从应用角度理解继承 函数构造器的继承 纯对象的继承 constructor的理解 constructor 属性是一个指针,指向创建此对象的函数.(可以更改) constructor的实际用途 看下面这段代码: var a,b; (func

javascript 中 typeof 和 instanceof 的区别

在 javascript 中经常会用到 typeof 和 instanceof 来判断一个对象的类型,可能 typeof 用得多些,那来看看这两个之间的区别吧. typeof : typeof 是一个一元运算符,放在一个运算数之前,运算数可以是任意类型.它返回值是一个字符串,该字符串说明运算数的类型. typeof 一般只能返回如下几个结果:number,boolean,string,function,object,undefined. ? 1 2 3 4 5 6 7 8 <script typ

Javascript中的数据类型知多少

JavaScript 是一种弱类型或者说动态语言.这意味着你不用提前声明变量的类型,在程序运行过程中,类型会被自动确定.这也意味着你可以使用同一个变量保存不同类型的数据 根据ECMAScript 5.1的规范,javascript中共有六种数据类型,分别为:Undefined, Null, Boolean,Number, String.Object.前五种属于基本类型,最后一种属于Object类型. 最新的ECMAScript 6 又加了一种类型:Symbol (ECMAScript 6 新定义

JavaScript中typeof、toString、instanceof与constructor

JavaScript 是一种弱类型或者说动态语言.这意味着你不用提前声明变量的类型,在程序运行过程中,类型会被自动确定. 这也意味着你可以使用同一个变量保存不同类型的数据. 最新的 ECMAScript 标准定义了 7 种数据类型: 6种原始类型:Boolean.Null.Undefined.Number.String.Symbol (ECMAScript 6 新定义)和Object,除 Object 以外的所有类型都是不可变的(值本身无法被改变). 一.typeof typeof操作符返回一个

javascript 中isPrototypeOf 、hasOwnProperty、constructor、prototype等用法

hasOwnProperty:是用来判断一个对象是否有你给出名称的属性或对象,此方法无法检查该对象的原型链中是否具有该属性,该属性必须是对象本身的一个成员. isPrototypeOf是用来判断要检查其原型链的对象是否存在于指定对象实例中,是则返回true,否则返回false. instanceof  操作检查对象中是否有名为 property 的属性.也可以检查对象的原型,判断该属性是否为原型链的一部分. Java代码 hasOwnProperty:   var obj = {a:1,b:2}

JavaScript中“typeof”运算符与“instanceof”运算符的差异

在JavaScript中,运算符“typeof”和“instanceof”都可以用来判断数据的类型,那么这两个运算符有什么不同之处呢? 差异一:使用方式不同. 最明显的差异就是这两个运算符的使用方式了.“typeof”是一元运算符,其后直接跟需要进行类型判断的数据:而“instanceof”是二元运算符,其左侧是需要判断的数据,右侧是用于比较的类型. //typeof是一元运算符: var amount = 108; console.log(typeof amout);//控制台输出“numbe

javascript中typeof与instanceof的区别

JavaScript 中 typeof 和 instanceof 常用来判断一个变量是否为空,或者是什么类型的.但它们之间还是有区别的: typeof typeof 是一个一元运算,放在一个运算数之前,运算数可以是任意类型. 它返回值是一个字符串,该字符串说明运算数的类型.typeof 一般只能返回如下几个结果: number,boolean,string,function,object,undefined.我们可以使用 typeof 来获取一个变量是否存在,如 if(typeof a!="un

JavaScript中instanceof运算符的用法以及和typeof的区别

instanceof : 为判断一个对象是否为某一数据类型,或一个变量是否为一个对象的实例;返回boolean类型栗子①: <script type="text/javascript"> var aColors = ["red", "green", "blue"]; alert(typeof aColors[0]); //output "string" alert(aColors[0] inst