如何判断属性是来自自身对象还是js原型链最上层对象

JavaScript015

如何判断属性是来自自身对象还是js原型链最上层对象,第1张

var obj = {name: 'h5course-com'}

obj.hasOwnProperty('name') // true

obj.hasOwnProperty('toString') // false

原型链上继承过来的属性无法通过hasOwnProperty检测到，返回false。

注意

虽然in能检测到原型链的属性，但是for in却不行。

资料参考：

HTML5学堂

1.、js的对象可以分为函数对象和普通对象，每个对象都有 proto 属性，但是只有函数对象才有prototype属性（prototype=原型对象）

2、Object是最高级的函数对象，Function、Array、RegExp、Date、Boolean、Number、String等等是第二高级的函数对象，我们自己手写的function是再低一级的函数对象

3、 proto 是一个对象，它指向某一个prototype，并且有2个属性：constructor和 proto

先来看第一种写法

我们声明了一个构造函数Person，并为它的2个实例都定义了sayName方法

如果我们希望所有的实例都有sayName方法，减少重复的定义

可以像下面这么写：（第二种写法）

我们在构造函数Person中定义了一个数据成员和一个函数成员

每当我们创造一个新的Person实例时，都会在内存中单独为它分配私有的空间

也就是说，p1和p2都有自己的name属性和sayName方法

这个name属性和sayName方法是实例自己私有的

在控制台直接打印p1得到如下结果：（第一、第二种写法是等价的）

再来看第三种写法：

这样的话，每个Person实例依然都会有name属性和sayName方法

不同的地方在哪呢？

在控制台直接打印p1得到如下结果：

不难发现，当前这种写法是将sayName定义在Person的原型对象上的

也就是说，sayName方法不再是每个Person实例私有的，而是所有Person实例共享的

这样做 既不影响每个实例打印/输出自己的name值，又可以节省内存

还是相同的例子

当我们在程序中调用 p1.sayName方法时，编译器会 沿着原型链(自底向上) 地寻找原型对象上是否有这个方法

如上图所示，编译器会先从p1自身（最外层）开始找

然后去 p1. proto （即Person的原型对象 = 外层红色方框）里面找

最后再到 p1. proto . proto （即Object的原型对象 = 内层红色方框）里面找