当前位置: 首页 > Web前端 > HTML

js原型、原型链

时间:2023-03-28 01:38:08 HTML

原型、原型链:1.原型:js中的函数可以有属性。每个函数都有一个特殊的属性,称为原型函数Person(a,b){this.age=a;这个.name=b;}console.log("Person'sprototype:",Person.prototype)prototype有两个属性:constructor,[[Prototype]]constructor:每个实例对象都从原型继承一??个constructor属性,指向用来构造这个实例的构造函数object,也就是说我创建了一个Person对象,在prototype中会继承prototype的constructor,指向函数Person(我觉得constructor的作用是知道它是从哪个函数创建的,如果prototype的当前函数修改为对象,构造函数将被替换,如需使用请修改)[[Prototype]]:为隐藏属性,不能直接访问。它可以通过__proto__的读取器(getter)来访问。其实可以这样理解,__proto__代表[[Prototype]]**注意**:web标准中已经去掉了__proto__特性。虽然有些浏览器仍然支持它,但将来可能会停止支持它。请尽量不要使用此功能。推荐使用Object.getPrototypeOf()。2、原型链:javaScript常被描述为一种基于原型的语言(prototype-basedlanguage)——每个对象都有一个原型对象,对象以其原型为模板,并从原型继承方法和属性。一个原型对象也可能有一个原型,并从中逐层继承方法和属性,等等。这种关系通常被称为原型链(prototypechain),它解释了为什么一个对象具有在其他对象中定义的属性和方法。原型继承:每个实例对象(object)都有一个私有属性(__proto__)指向其构造函数的原型对象(prototype)。原型对象也有自己的原型对象(__proto__),层层叠叠直到原型对象为空。null是原型链的最后一环,object是食物链的顶端。从例子中可以看出,实例对象并没有继承对象的属性,只是继承了封装后的对象//父类函数Person(a,b){this.age=a;这个.name=b;}Person.prototype.getInfo=function(){returnthis.name+':'+this.age}varperson=newPerson(20,'张三');/*****只有函数才有原型:*/console.log("person'sprototype:",person.prototype)//*****原型链的体现,逐层查找__proto__直到null*/console.log("person's__proto__1:",person.__proto__)console.log("person's__proto__2:",person.__proto__.__proto__)console.log("person's__proto__3:",person.__proto__.__proto__.__proto__)/*****对象的内置属性__proto__指向函数的原型*/console.log("__proto__andprototype:",person.__proto__===Person.prototype)//子类函数Person2(a,b){这个年龄=一个;这个.name=b;}Person2.prototype=person;varp2=newPerson2(30,'丽丝');/*****原型继承*/console.log("person:",person.getInfo())console.log("p2",p2.getInfo())运行结果:参考文章:https://developer.mozilla.org...https://developer.mozilla.org...