`
yxc_gdut
  • 浏览: 97416 次
  • 性别: Icon_minigender_1
  • 来自: 深圳
社区版块
存档分类
最新评论

instanceof 和 prototype 关系

阅读更多

    一直想知道js的 instanceof 是根据什么来判断两个对象的继承关系? 会不会跟prototype有关,然后就试试了

    如果觉得下面的代码比较长,请先看注释

 

 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <title>intanceof.html</title>
    <meta http-equiv="content-type" content="text/html; charset=UTF-8">
  </head>
  <body>
    <script type="text/javascript">
    	/*
    		A instanceof B 
    		如果A.__proto__ === B.prototype 则返回true
    	*/
    	var proto = {
    		say:function(){
    			alert("my name is "+this.name);
    		}
    	}
    	var Parent = function(name){
    		this.name = name||"yan";
    	}
    	Parent.prototype = proto;
    	
    	var Child = function(age){
    		this.age = age;
    	}
    	Child.prototype = proto;
    	var child = new Child(11);
	var parent = new Parent();
    	//测试    	
    	console.group("instanceof是根据prototype来判断两个对象的继承关系");
    	console.log("parent instanceof Parent :"+(parent instanceof Parent));//true;
    	console.log("child instanceof Parent :"+(child instanceof Parent));//true;
    	console.log("parent instanceof Child :"+(parent instanceof Child));//true;
    	console.log("Child instanceof Parent :"+(Child instanceof Parent));//false;
    	console.groupEnd();
	/*
    		A instanceof B 
    		沿着A的原型链查找 如果有一个原型和B.prototype相等 则返回true 
    			如:A.__proto__.__proto__ === B.prototype 则返回true
    	*/
    	var Fn = function(){}
    	Fn.prototype = new Parent("a");
    	Child.prototype = new Fn();
    	var fn = new Fn();
    	child = new Child();
	console.group("沿着原型链查找 如A instanceof B ,沿着A原型链查找直到找到跟B.prototype相等的原型");
    	console.log("child instanceof Parent :"+(child instanceof Parent));//true;
    	console.log("child instanceof Fn :"+(child instanceof Fn));//true;
    	console.log("fn instanceof Parent :"+(fn instanceof Parent));//true;
    	console.log("fn instanceof Child :"+(fn instanceof Child));//false;
    	console.groupEnd();
    	/*
    		进一步确定 instanceof 是检查原型的引用 而不是深入原型去检测他们的内容是否一样
    	*/
    	var proto2 = {
    		say:function(){
    			alert("my name is "+this.name);
    		}
    	}
    	Child = function(){}
    	Child.prototype = proto2;
    	child = new Child();
    	console.group(" instanceof 是检查原型的引用 而不是深入比较原型的内容");
    	console.log("child instanceof Parent :"+(child instanceof Parent));//false;
    	console.groupEnd();
    </script>
  </body>
</html>

 

 firefox执行结果如图

 

       

 

总结:

        js的instanceof是根据prototype来判断两个对象是否存在继承关系,

        A instanceof B

        js会沿着A的原型链查找 直到找到A.__proto__ === B.prototype 返回true

 

期待你们的意见,谢谢。 

 

注:__proto__属性指向prototype对象,对开发者不可见,例如var a = new A(), a.__proto__ = A.prototype;

 

  • 大小: 25.6 KB
分享到:
评论

相关推荐

    JS:typeof instanceof constructor prototype区别

    本文将深入探讨四种常用的方法来识别和判断JavaScript中的数据类型:`typeof`、`instanceof`、`constructor`以及`prototype`。 ### 1. `typeof` `typeof`操作符是最常见的类型检测方式之一,它返回一个表示未经计算...

    js中的instanceof操作符1

    `instanceof`是JavaScript中的一个操作符,用于检查一个对象是否是特定构造函数的实例,或者更具体地说,是检查该对象的原型链上是否存在指定构造函数的`prototype`。这个操作符对于理解和处理对象继承关系非常关键...

    了解JavaScript中的prototype (实例)

    `__proto__`用于表示对象的继承关系,而`prototype`则用于定义构造函数的继承。 **四、`Object.create()`和`new`操作符** `Object.create()`函数允许我们创建一个新对象,并将新对象的`__proto__`设置为指定的对象...

    JavaScript的instanceof有bug?

    在不同全局环境中,构造函数和它们的`prototype`是隔离的,这意味着在一个环境中创建的对象不能通过`instanceof`正确地识别为另一个环境中的构造函数的实例。 此外,`instanceof`对自定义类型和内置类型(如`Array`...

    实例讲解JavaScript中instanceof运算符的用法

    总的来说,`instanceof`运算符在JavaScript中用于判断对象的类型和继承关系,对于处理复杂的数据结构和原型链关系至关重要。正确理解和运用`instanceof`可以帮助我们编写更加健壮和准确的代码。

    理解Javascript_07_理解instanceof实现原理

    在实际应用中,理解instanceof的原理可以帮助开发者更好地设计和维护代码中的对象类型关系,避免在运行时出现不预期的行为。同时,这一知识点对于深入理解JavaScript中的原型继承机制以及对象之间的关系也至关重要。

    JavaScript instanceof 的使用方法示例介绍

    总的来说,`instanceof` 是一个强大的工具,能够帮助开发者检查对象的类型和继承关系,尤其是在涉及原型链和继承的场景下。在编写 JavaScript 代码时,合理使用 `instanceof` 可以提高代码的健壮性和可维护性。然而...

    JS中typeof与instanceof之间的区别总结.docx

    在JavaScript中,`typeof`和`instanceof`是两种常用的类型检查操作符,它们各自有着不同的用法和特点。...在实际编程中,根据需要检查的内容选择合适的操作符,可以更准确地了解变量的类型和实例关系。

    prototype学习

    在JavaScript中,`prototype`是一个核心概念,它与对象继承和函数原型紧密相关。`prototype`机制是JavaScript实现面向对象编程的关键部分。本篇将深入探讨`prototype`的基本原理、用法以及它在实际开发中的应用。 #...

    Javascript原型链及instanceof原理详解

    综上所述,原型链和instanceof是JavaScript中实现继承和类型判断的重要概念。掌握这些概念对于编写高质量、高效能的JavaScript代码是非常必要的。由于原型链是动态的,开发者可以灵活地改变对象的原型,实现更加丰富...

    javascript instanceof 内部机制探析

    首先,我们需要了解 JavaScript 中的构造函数、原型和实例之间的关系。当使用 `new` 关键字创建一个对象时,实际上是执行了以下步骤: 1. 创建一个新的空对象。 2. 将新对象的原型(`__proto__`)设置为构造函数的...

    JavaScript中instanceof运算符的使用示例

    instanceof运算符的一般使用语法是:object instanceof Constructor,它会返回一个布尔值,表示object的原型链上是否存在Constructor的prototype属性。 以下是一些关于instanceof运算符使用的基本知识点: 1. 检测...

    JavaScript中prototype的使用

    上述提到的“类型”和“原型”的关系是JavaScript继承的基础。通过设置一个对象的`prototype`为另一个对象,我们可以让这个对象继承另一个对象的属性和方法。例如,如果我们有一个`Point`构造函数,可以将`Point....

    prototype教程

    原型(Prototype)是JavaScript中的一个内置属性,它允许对象之间共享属性和方法,从而实现对象的继承。每个JavaScript对象都有一个内部`[[Prototype]]`属性,通常通过`__proto__`(非标准)或`Object....

    浅谈javascript中的instanceof和typeof

    instanceof操作符用于检测构造函数的prototype属性是否出现在某个实例对象的原型链上。它主要用于判断引用类型变量的类型。例如,当我们需要区分Array实例和普通的Object实例时,instanceof就显得非常有用。下面是几...

    详解JavaScript中基于原型prototype的继承特性_.docx

    例如,`instance instanceof Object`和`Object.prototype.isPrototypeOf(instance)`分别用于检测`instance`是否是`Object`的实例及其关系。 然而,原型链继承也存在一些问题。首先是共享引用类型的特性,如果超类的...

    js代码-手写instanceof

    总结一下,`instanceof` 是JavaScript中进行类型检查的重要工具,它依赖于原型链来确定对象与构造函数的关系。手写 `instanceof` 可以帮助我们更深入地理解原型链和构造函数的概念,这对于编写高质量的JavaScript...

    深入剖析JavaScript instanceof 运算符

    总的来说,`instanceof`是JavaScript中用于检查对象类型和继承关系的重要工具。正确理解和使用`instanceof`可以帮助我们编写更健壮、更具有适应性的代码,尤其是在处理复杂的数据结构和继承层次时。

    第五课 函数与对象-011

    总的来说,`instanceof`是检测对象类型的有效工具,而函数与对象的关系体现在函数可作为对象,且通过`prototype`属性实现了对象的继承和扩展。在前端开发中,熟练运用这些概念可以创建出具有强大功能和良好封装性的...

Global site tag (gtag.js) - Google Analytics