JS基础-该如何理解原型、原型链? (2)

语法:object instanceof constructor

let test = function () { } let testObject = new test(); testObject instanceof test // true test.prototype在testObject的原型链上 testObject instanceof Function // false Function.prototype 不在testObject的原型链上 testObject instanceof Object // true Object.prototype在testObject的原型链上

isPrototypeOf:测试一个对象是否存在于另一个对象的原型链上

语法:prototypeObj.isPrototypeOf(object)

let test = function () { } let testObject = new test(); test.prototype.isPrototypeOf(testObject) // true test.prototype在testObject的原型链上 Object.prototype.isPrototypeOf(testObject) // true Object.prototype在testObject的原型链上 原型链的终点: Object.prototype

Object.prototype是原型链的终点,所有对象都是从它继承了方法和属性。

Object.prototype没有原型对象

const proto = Object.getPrototypeOf(Object.prototype) // null

下面是两个验证例子,有疑虑的同学多写几个测试用例印证一下。

字符串原型链的终点:Object.prototype

let test = '由String函数构造出来的' let stringPrototype = Object.getPrototypeOf(test) // 字符串的原型 stringPrototype === String.prototype // true 字符串的原型是String对象 Object.getPrototypeOf(stringPrototype) === Object.prototype // true String对象的原型是Object对象

函数原型链的终点:Object.prototype

let test = function () { } let fnPrototype = Object.getPrototypeOf(test) fnPrototype === Function.prototype // true test的原型是Function.prototype Object.getPrototypeOf(Function.prototype) === Object.prototype // true 原型链用来做什么? 属性查找:

如果试图访问对象(实例instance)的某个属性,会首先在对象内部寻找该属性,直至找不到,然后才在该对象的原型(instance.prototype)里去找这个属性,以此类推

我们用一个例子来形象说明一下:

let test = '由String函数构造出来的' let stringPrototype = Object.getPrototypeOf(test) // 字符串的原型 stringPrototype === String.prototype // true 字符串的原型是String对象 Object.getPrototypeOf(stringPrototype) === Object.prototype // true String对象的原型是Object对象

当你访问test的某个属性时,浏览器会进行以下查找:

浏览器首先查找test 本身

接着查找它的原型对象:String.prototype

最后查找String.prototype的原型对象:Object.prototype

一旦在原型链上找到该属性,就会立即返回该属性,停止查找。

原型链上的原型都没有找到的话,返回undefiend

这种查找机制还解释了字符串为何会有自带的方法: slice/split/indexOf等。

准确的说:

这些属性和方法是定义在String这个全局对象/函数上的。

字符串的原型指向了String函数的prototype。

之后通过查找原型链,在String函数的prototype中找到这些属性和方法。

拒绝查找原型链:

hasOwnProperty: 指示对象自身属性中是否具有指定的属性

语法:obj.hasOwnProperty(prop)

参数: prop 要查找的属性

返回值: 用来判断某个对象是否含有指定的属性的Boolean。

let test ={ 'OBKoro1': '扣肉' } test.hasOwnProperty('OBKoro1'); // true test.hasOwnProperty('toString'); // false test本身没查找到toString

这个API是挂载在object.prototype上,所有对象都可以使用,API会忽略掉那些从原型链上继承到的属性。

扩展: 实例的属性

你知道构造函数的实例对象上有哪些属性吗?这些属性分别挂载在哪个地方?原因是什么?

function foo() { this.some = '222' let ccc = 'ccc' foo.obkoro1 = 'obkoro1' foo.prototype.a = 'aaa' } foo.koro = '扣肉' foo.prototype.test = 'test' let foo1 = new foo() // `foo1`上有哪些属性,这些属性分别挂载在哪个地方 foo.prototype.test = 'test2' // 重新赋值

内容版权声明:除非注明,否则皆为本站原创文章。

转载注明出处:https://www.heiqu.com/wpywdd.html