js初识原型与原型链

在了解原型之前,需要对构造函数有一个简单的理解。

    function plane() {//飞机的构造函数
        this.move = function () {
            console.log('移动')
        }
    }
    let p1 = new plane();//构造一个飞机实例1
    p1.move();//调用飞机的move方法,会打印出“移动”
    console.log(p1)

此时打印p1显示如图:
p1
这里可以打印一下

 console.log(p1.__proto__)//实例化的对象才有‘__proto__’属性,这表示p1的原型对象,‘__proto__’在IE中不能使用

结果如图:
在这里插入图片描述

protoprototype

console.log(p1.__proto__ === plane.prototype);//true,同时指向了一个原型对象

需要注意的是
1.Object 是所有对象的爸爸,所有对象都可以通过 proto 找到它
2.Function 是所有函数的爸爸,所有函数都可以通过 proto 找到它
3.函数的 prototype 是一个对象
4.对象的 proto 属性指向原型, proto 将对象和原型连接起来组成了原型链

原型链

原型链,是一个链条,讲述每个对象的原型对象的关系,每个对象都有自己的原型对象
接着上面的代码:

    p1.__proto__.name = '飞机1'
    console.log(p1.name)//飞机1
    let p2 = new plane();
    p2.__proto__.name = '飞机2'
    console.log(p2.name)//飞机2

首先给实例飞机1的原型对象添加属性name,会打印出“飞机1”;其次,新建一个飞机实例2,同样给原型对象添加属性name,会打印出“飞机2”。这个就说明每一个实例对象,都有一个自己的原型对象,虽然是同一个构造函数生成的,但是彼此的原型对象并不相同。
如果给构造函数的原型对象添加属性会是怎样的呢?

    plane.prototype.name='大飞机'
    console.log(p1.name)//大飞机

此时,打印p1的name属性,发现会与之前打印的p1的name属性有冲突。原因在于,当构造函数的原型对象添加属性后,所有的实例都会去继承相应的属性,如果实例的原型对象添加同一属性的话,并不会有作用。

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

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值