复习原型链

前言:

由于Es6之前没有引入类(class)的概念,javascrpit并非直接通过类,而是直接通过构造函数的方式常见实例,所以有必要先复习下构造函数。

一.构造函数

构造函数模式的目的是为了创建一个自定义类,并创建这个类的实例,构造函数模式下有了类和实例的概念,并且实例和实例之间是相互独立的,即实例识别。

构造函数本身也是一个普通的函数,函数创建方式和普通函数没有区别,但构造函数习惯上首字母大写。另外就是调用方式的不同,普通函数是直接调用,而构造函数需要使用new关键字来调用。

<script>
        function Person(name,age){
            this.name = name,
            this.age = age,
           sayHello = function(){
                alert(this.name)
            }
        }
        
        var per = new Person('jack',18) //当我们直接在页面中打印一个对象时,事件上是输出的对象的toString()方法的返回值
        console.log(per)
        
    </script>

没创建一个Person构造函数,在Person构造函数中,为每一个对象添加了一个sayHello方法,也就是说构造函数每执行一次就会创建一个新的sayHello方法。这样就导致了构造函数执行一次就会创建一个新的方法,执行10000次就会创建10000个新的方法,而10000个方法都是一模一样的,为什么不把这个方法单独放到一个地方,并让所有的实例都可以访问到呢?这就需要原型(prototype)。

用一张图表示构造函数和实例原型之间的关系:

 原型对象相当于一个公共的区域,所有同一类的实例都可以访问到这个原型对象,我们可以将对象共有的内容,统一到原型对象中。

二.原型和原型链

1.原型的概念

JavaScript所有对象都包含了一个[proto]内部属性,这个属性所对应的就是自身的原型

JavaScript的函数对象,除了[proto]之外,还要prototype属性,当函数对象作为构造函数创建实例时,

该prototype属性值将被作为实例对象的原型[proto]

2.原型链的概念

当一个对象调用自身不存在的属性和方法时,就会去自己[proto]关联的前辈prototype对象上去找,如果没有找到,就会去该prototype原型[proto]关联的前辈prototype去找。依次类推,直到找到属性/方法或underfined为止。从而形成了所谓的"原型链"

总结

JavaScrpit中的对象,都有一个内置[Prototype],指向这个对象的原型对象。当查找一个属性或方法时,如果在当前对象中找不到,就会继续在当前对象的原型对象中查找;如果原型对象中依然没有找到,就会在原型对象的原型中查找(原型也是对象,也有它自己的原型);直到找到为止,或者查找到最顶层的原型对象中也没有找到,就结束查找,返回underfined。这个查找过程是一个链式的查找,每个对象都有一个到它自身对象的链接,这些链接组建的整个链条就是原型链。在上面的查找过程,我们提到了最顶层的原型对象,这个对象就是Object.prototype,这个对象中保存了最常用的方法,如toString,valueOf等,因此我们才能在任何对象中使用这些方法。

四._proto_和prototype

_proto_指向当前对象的原型,prototype是函数才具有的属性,默认情况下,new一个构造函数创建出的对象,其原型都指向这个函数的prototype。

每个实例对象都有一个私有属性(称为proto)指向它的原型对象(prototype)。该原型对象也有一个自己的原型对象,层层向上直到一个对象的原型对象为null。根据定义,null没有原型,并作为这个原型链的最后一个环节。

原文链接:

原型和原型链_yx_back的博客-CSDN博客_原型链

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

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

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

余额充值