instanceof与typeof（写一个方法判断数据类型）,prototype与_proto_

最新推荐文章于 2023-09-04 13:31:24 发布

原创最新推荐文章于 2023-09-04 13:31:24 发布 · 921 阅读

2 ·

CC 4.0 BY-SA版权

文章标签：

#前端面经汇总 #数据类型判断 #原型

HTML、CSS、javascript 专栏收录该内容

31 篇文章

订阅专栏

本文介绍了JavaScript中的类型检测方法，包括typeof操作符和instanceof运算符的使用，并详细解释了它们的区别及应用场景。此外，还探讨了原型链的概念，包括prototype与_proto_属性的作用及其在实现继承过程中的应用。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

instanceof与typeof

typeof operand

operand 是一个表达式，表示对象或原始值，其类型将被返回

下表总结了 typeof 可能的返回值。有关类型和原语的更多信息，可查看 JavaScript数据结构页面。

类型	结果
Undefined	`"undefined"`
Null	`"object"` (见下方)
Boolean	`"boolean"`
Number	`"number"`
String	`"string"`
Symbol (ECMAScript 6 新增)	`"symbol"`
宿主对象(由JS环境提供)	Implementation-dependent
函数对象 ( [[Call]] 在ECMA-262条款中实现了)	`"function"`
任何其他对象	`"object"`

object instanceof constructor

instanceof 运算符用来检测 constructor.prototype 是否存在于参数 object 的原型链上

instanceof 运算符判断的对象一般有：Array Function Object 等引用类型的实例对象

// 定义构造函数
function C(){} 
function D(){} 

var o = new C();

// true，因为 Object.getPrototypeOf(o) === C.prototype
o instanceof C; 

// false，因为 D.prototype不在o的原型链上
o instanceof D; 

o instanceof Object; // true,因为Object.prototype.isPrototypeOf(o)返回true
C.prototype instanceof Object // true,同上

C.prototype = {};
var o2 = new C();

o2 instanceof C; // true

o instanceof C; // false,C.prototype指向了一个空对象,这个空对象不在o的原型链上.

D.prototype = new C(); // 继承
var o3 = new D();
o3 instanceof D; // true
o3 instanceof C; // true

需要注意的是，如果表达式 obj instanceof Foo 返回true，则并不意味着该表达式会永远返回true，因为Foo.prototype属性的值有可能会改变，改变之后的值很有可能不存在于obj的原型链上，这时原表达式的值就会成为false。另外一种情况下，原表达式的值也会改变，就是改变对象obj的原型链的情况，虽然在目前的ES规范中，我们只能读取对象的原型而不能改变它，但借助于非标准的__proto__魔法属性，是可以实现的。比如执行obj.__proto__ = {}之后，obj instanceof Foo就会返回false了。

写一个方法判断数据类型：

prototype与_proto_

prototype 是原型，是Function对象才有的属性（如果你不信，你尽可尝试其他的数据类型，得到的绝对是undefined），原型主要是用来实现继承，从而用js 进行面向对象编程;

有以下代码：

	var person=function(){
				this.name="animal";
			};
	var p=new person();

	console.log(person.prototype);//object Object

	console.log(p.prototype);//undefined

因为构造函数的实例对象没有prototype,于是有_proto_

所有对象的_proto_都指向其构造函数的prototype,而构造函数的_proto_则都指向Function.prototype，一个空函数（Empty function）
有以下代码：
			var person=function(){
				this.name="animal";
			};
			var p=new person();
			
			console.log(person.prototype);//object Objec
			console.log(person.__proto__);//function Empty() {}


			console.log(p.prototype);//undefined
			console.log(p.__proto__);//object Objec
			
			console.log(person.prototype==p.__proto__);//true
			//可见，实例指向函数实例对象的_proto_ 指向  函数的原型prototype；
 
  				var man=function (){}

  				man.prototype=new person();//子类原型链继承父类

  			

  				var littleman=new man();

  			

  				console.log(littleman.name);//person

  			

  				console.log(man.prototype);//[object Object]

  				console.log(man.__proto__);//function Empty() {}

  			

  				console.log(littleman.prototype);//undefined

  				console.log(littleman.__proto__);//[object Object]

  			

 
 
  原型链作为实现继承的主要方法。其基本思想是利用原型让一个引用类型继承另一个引用类型的属性和方法。
  

  在JavaScript中，用_
  proto_
   属性来表示一个对象的原型链。当查找一个对象的属性时，JavaScript 会向上遍历原型链，直到找到给定名称的属性为止！

 
 
  原型链继承方法 参考博文：http://blog.youkuaiyun.com/prince_fmx/article/details/77619592
 
注意：prototype与_proto_是属性，typeof是操作符，instanceof是运算符