今天就跟大家聊聊有关JavaScript原型及实例分析,可能很多人都不太了解,为了让大家更加了解,小编给大家总结了以下内容,希望大家根据这篇文章可以有所收获。
构造函数 实例 原型三者的关系
任何函数都有一个prototype属性,该属性是一个对象
function F () {}console.log(F.prototype) // => object//原型对象F.prototype.sayHi = function () { console.log('hi!')}
构造函数的prototype对象默认都有一个constructor属性,指向prototype对象所在函数
console.log(F.constructor === F) // => true//表示这个
通过构造函数得到的实例对象内部会包含一个指向构造函数的prototype对象的指针_proto_
var instance = new F()console.log(instance.__proto__ === F.prototype) // => true
意思是用当前构造函数创建的实例对象内部都包含一个指针,这个指针就是_proto_
,然后这个指针是指向构造函数的prototype对象的
因此我们可以直接用实例访问原型对象上的成员
例:
instance.sayHi() // => 打印hi!
注意
_proto_
是一个非标准属性
prototype属性
Javascript 规定,每一个构造函数都有一个 prototype 属性,指向另一个对象。
这个对象的所有属性和方法,都会被构造函数的实例继承。
这也就意味着,我们可以把所有对象实例需要共享的属性和方法直接定义在prototype对象上。
例子:
function Person (name, age) { this.name = name this.age = age}console.log(Person.prototype)//打印原型Person.prototype.type = 'human'//将human挂载到原型对象的属性上Person.prototype.sayName = function () {//还可以定义函数 console.log(this.name)}let p1 = new Person(...)let p2 = new Person(...)console.log(p1.sayName === p2.sayName) // => true
我们可以看到console.log(p1.sayName === p2.sayName)
这行代码打印的结果是true
这是因为所有实例的type
属性和sayName()
方法都是一个同一个内存地址,都是指向prototype
对象,因此提高了运行效率
属性或成员的搜索原则
我们知道了多个实例对象是可以共享原型对象中的属性或成员的,那么js中是怎么实现这个共享机制的呢?
这就不得不提到属性的搜索原则了
每当代码读取某个实例对象的某个属性时,都会执行一次搜索,搜索目标是具有给定名字的属性或者成员
搜索过程如下:
首先从对象实例本身开始搜索
如果在实例对象中找到了具有给定名字的属性,则返回该属性的值
如果没有找到,则继续搜索实例对象中含有的指针(上文中讲过)指向的原型对象,在原型对象中查找具有给定名字的属性
如果在原型对象中找到了这个属性,则返回该属性的值
在执行instance.sayName()
时,会执行两次搜索,第一次搜索实例对象,第二次搜索原型对象
看完上述内容,你们对JavaScript原型及实例分析有进一步的了解吗?如果还想了解更多知识或者相关内容,请关注编程网行业资讯频道,感谢大家的支持。