关于原型的几个小知识
2021-08-18 本文已影响0人
捡了幸福的猪
1、 isPrototypeOf()
: 测试一个对象是否存在于另一个对象的原型链上。
语法:
prototypeObj.isPrototypeOf(object)
demo:
function Foo() {}
function Bar() {}
function Baz() {}
Bar.prototype = Object.create(Foo.prototype);
Baz.prototype = Object.create(Bar.prototype);
var baz = new Baz();
console.log(Baz.prototype.isPrototypeOf(baz)); // true
console.log(Bar.prototype.isPrototypeOf(baz)); // true
console.log(Foo.prototype.isPrototypeOf(baz)); // true
console.log(Object.prototype.isPrototypeOf(baz)); // true
说明Baz.prototype、Bar.prototype、Foo.prototype、Object.prototype 都在baz的原型链上
2、 getPrototypeOf
: 方法返回指定对象的原型(内部[[Prototype]]属性的值)
语法:
Object.getPrototypeOf(object)
demo:
var proto = {};
var obj = Object.create(proto);
Object.getPrototypeOf(obj) === proto; // true
var reg = /a/;
Object.getPrototypeOf(reg) === RegExp.prototype; // true
Object.prototype.proto 已被废弃, 使用getPrototypeOf
代替
3、 instanceOf
: 用于检测构造函数的 prototype 属性是否出现在某个实例对象的原型链上
语法:
object instanceof constructor
demo:
function C(){}
function D(){}
var o = new C();
o instanceof C; // true,因为 Object.getPrototypeOf(o) === C.prototype
o instanceof D; // false,因为 D.prototype 不在 o 的原型链上
o instanceof Object; // true,因为 Object.prototype.isPrototypeOf(o) 返回 true
C.prototype instanceof Object // true,同上
4、instanceof 使用 getPrototypeOf 与isPrototypeOf 实现:
function instance_of(L, R) { // L 表示实例,R 表示构造函数
if (typeof L !== 'object' || L === null || typeof R !== 'function')
return false;
var O = R.prototype;
do {
L = Object.getPrototypeOf(L);
if (O === L)
return true;
} while (L)
return false
}
or
function instance_of(L, R) { // L 表示实例,R 表示构造函数
return R.prototype.isPrototypeOf(L)
}
console.log(instance_of('', String)) // false
console.log(instance_of(new String(''), String)) // true
console.log(instance_of(new String(''), Object)) // true
5、遍历 原型上的属性or方法:
function 构造函数 可以使用Object.keys() or for..in 遍历:
function Test() {}
Test.prototype.testMethod = function(){}
const fnProto = Test.prototype
console.log(Object.keys(fnProto)) // ['testMethod']
for (let k in fnProto) {
console.log(k) // 'testMethod'
}
class 构造函数实现:
class TestClass{
testMethod() {}
}
const classProto = TestClass.prototype
console.log(Object.keys(classProto)) // []
for (let k in classProto) {
console.log(k) // 不会执行
}
原因: class定义的方法是不可枚举的;
方法: 使用Object.getOwnPropertyNames
, Object.getOwnPropertyNames返回一个数组包含对象自身拥有的可枚举和不可枚举属性。
class TestClass{
testMethod() {}
}
const classProto = TestClass.prototype
console.log(Object.getOwnPropertyNames(classProto))
from 如何遍历class中的原型方法?
hi~ 今天开心了没~~