js高级 原型对象 显性原型对象与隐性原型对象 原型链

原型对象,是用来解决构造函数在创建实例的时候,防止重复执行所导致的性能的降低(这里主要指占用内存),来为服用带来方便

如果在构造函数上添加一个方法 当你每次调用这个构造函数的时候都会调用里面的方法如果用原型对象的话就不用反复调用

每个函数都有一个prototype属性,他默认指向一个object空对象(实例)原型对象

<script>
    function fun(age) {
        //添加一个name属性让name属性等于传过来的name参数
         this.age = age
    }
   const a= new fun()
   console.log(fun.prototype);
</script>

在这里插入图片描述

constructor主要用于记录该对象引用于哪个构造函数,它可以让原型对象重新指向原来的构造函数。
它实际上就是等于这个函数的
在这里插入图片描述

显性原型对象与隐性原型对象

prototype这个是显性原型对象 __proto__是隐性原型对象

注意 构造函数上有 prototype和__proto__属性而他的实例上没有prototype属性只有__proto__这个属性

   function fun(age) {
        //添加一个name属性让name属性等于传过来的name参数
         this.age = age
    }
   const a= new fun()
   console.log(fun.prototype);
   console.log(fun.__proto__);
   console.log(a.prototype);
   console.log(a.__proto__);

在这里插入图片描述
而且他的实例上的__proto__和他的构造函数上的prototype是一样的

***其实当你调用某些方法比如像onclick事件就是它定义好的事件都是在原型上定义的 ***

原型链

看一段代码

<script>
 function fun(){
     this.test1=function(){
         console.log("test1");
     }
 }
 fun.prototype.test2=function(){
     console.log("text2");
 }
 const a=new fun()
 a.test1()
 a.test2()
 a.toString()
 a.test3()
</script>

在这里插入图片描述
这里test和test2都能找到因为他们一个添加到构造函数上一个添加到了原型对象上
那为什么没有定义tostring和test3,tostring没报错test3确报错了因为tostring在原型链上

原型链理解
在这里插入图片描述
当要找一个方法时他会先在这个构造函数上面找,如果找不到就会去他的原型对象上面找如果还找不到他就回去object空实例对象(其实是实例对象的__proto__,实例的__proto__===构造函数的prototype,prototype指向objeect)上面找
在这里插入图片描述
这个空object空实例对象指向一个object原型对象 就相当于 object.prototype(每个函数都有prototype)它里面还有很多方法tostring就是一个如果 object.prototype再找不到就会接着去__proto__上面找而object的原型对象的__proto__是null所以就找不到test3

  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

万事胜意sy

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值