什么是原型、原型对象、原型链?

每当声明一个函数的时候,系统都有一个 prototype (原型)属性,这个属性是一个指针,指向一个对象, 而这个对象的用途是包含可以由特定类型的所有实例共享的属性和方法,称为原型对象

在声明了一个函数后,这个构造函数(声明了的函数)中会有一个属性prototype,这个属性指向的就是这个构造函数(声明了的函数)对应的原型对象;原型对象中有一个属性constructor,这个属性指向的是这个构造函数(声明了的函数)

function school(){}
var stu = new school()

console.log(school.prototype===stu.__proto__) // true

此时,stu就是那个构造函数school创建出来的对象,这个stu对象中是没有prototype属性的,但他有__proto__属性,prototype属性只有在构造函数students中有

构造函数students中有prototype属性,指向的是school对应的原型对象;而stu是构造函数students创建出来的对象,他不存在school属性,所以在调用prototype的时候的结构是undefined,但stu有一个__proto__属性,stu调用这个属性可以直接访问到构造函数students的原型对象(也就是说,stu的__proto__属性指向的是构造函数的原型对象) 

如果我们访问stu中的一个属性name,如果在stu对象中找到,则直接返回。如果stu对象中没有找到,则直接去stu对象的__proto__属性指向的原型对象中查找,如果查找到则返回。(如果原型中也没有找到,则继续向上找原型的原型—原型链)

<body>
    <script type="text/javascript">
        function students () {        
        }
        // 可以使用students.prototype 直接访问到原型对象
        //给students函数的原型对象中添加一个属性 name并且值是 "张三"
        students.prototype.name = "张三";
        students.prototype.age = 20;
 
        var stu = new students();
        /*
            访问stu对象的属性name,虽然在stu对象中我们并没有明确的添加属性name,但是
            stu的__proto__属性指向的原型中有name属性,所以这个地方可以访问到属性name
            就值。
            注意:这个时候不能通过stu对象删除name属性,因为只能删除在stu中删除的对象。
        */
        alert(stu.name);  // 张三
 
        var stu1 = new students();
        alert(stu1.name);  // 张三  都是从原型中找到的,所以一样。
 
        alert(stu.name === stu1.name);  // true
 
        // 由于不能修改原型中的值,则这种方法就直接在stu中添加了一个新的属性name,然后在stu中无法再访问到
        //原型中的属性。
        stu.name = "李四";
        alert(stu.name); //李四
        // 由于stu1中没有name属性,则对stu1来说仍然是访问的原型中的属性。    
        alert(stu1.name);  // 张三  
    </script>
</body>

JS中每个函数被创建时都会包含一个prototype属性并指向一个对象,这个对象的用途是包含了构造函数所有实例共享的属性和方法,这个对象也被叫做原型对象

当访问一个对象的某个属性时,会先在这个对象本身属性上查找,如果没有找到,则会去它的__proto__隐式原型上查找,即它的构造函数的prototype,如果还没有找到就会再在构造函数的prototype__proto__中查找,这样一层一层向上查找就会形成一个链式结构,我们称为原型链

  • 0
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值