构造函数原型prototype 和 对象原型__proto__

一、构造函数原型prototype

js规定,每一个函数都有一个prototype属性,指向另一个对象。

注意这个prototype就是一个对象,这个对象的所有属性和方法,都会被构造函数创建的实例对象所访问到。

我们可以理解为把那些逻辑不变的方法和共有的属性,直接定义在prototype对象上,这样构造函数对象就可以共享这些方法和属性

一般情况下,我们的公共属性定义到构造函数里面, 公共的方法我们放到原型对象身上

 // 1. 构造函数
        function Star(uname, age) {
            this.uname = uname;
            this.age = age;
            this.colors = []; // 
            this.sing = function() {
                console.log('我会唱歌');//(19)
            }
        }
        var ldh = new Star('刘德华', 18);
        var zxy = new Star('张学友', 19);
        console.log(ldh.sing === zxy.sing);//(24) 此处对比的是地址  false
       
       //2. 一般情况下 我们的公共属性定义到构造函数里面  公共的方法放到函数原型对象上
      Star.prototype.sing = function () {
        console.log('我会唱歌');
       }
        ldh.sing();
        zxy.sing();
       console.log(Star.prototype);// (32) 返回构造函数Star的原型对象prototype
       console.dir(Star.prototype);//(33) 显示原型对象prototype所有的属性和方法
      
       Star.prototype.colors = []
        ldh.colors.push('red')
        console.log(ldh.colors);//(37)
     
        console.log(zxy.colors);//(39)
        console.dir(Star);//(40)

        
        // 原型对象:每一个函数都有一个prototype 属性,该属性指向的对象就是原型对象。
        // 作用:这个对象上所有的方法和属性都会被共享(共享)。被谁共享 ???? 构造函数创建的实例对象

        // 2. 一般情况下,我们的公共属性定义到构造函数里面, 公共的方法我们放到原型对象身上

 二、对象的原型  __proto__

对象都会有一个属性 __proto__ 指向构造函数的 prototype 原型对象,之所以我们对象可以使用构造函数 prototype 原型对象的属性和方法,就是因为对象有 __proto__ 原型的存在。

__proto__对象原型和原型对象 prototype 是等价的
__proto__对象原型的意义就在于为对象的查找机制提供一个方向,或者说一条路线,但是它是一个非标准属性,因此实际开发中,不可以使用这个属性,它只是内部指向原型对象 prototype

相当于实例对象的属性__proto__指向构造当前对象的构造函数的原型对象(prototype)

注意:[[prototype]]和 __proto__的作用是一样的。

[[prototype]]:只是一个标准(ECMAScript 推荐 通过这个属性 去实现 对象访问 原型对象),而针对这个标准,不同的浏览器有不同的实现方式。

   //创建对象Star    

   function Star(uname, age) {

            this.uname = uname;

            this.age = age;

        }

        Star.prototype.sing = function() {

            console.log('我会唱歌');

        }

   var ldh = new Star('刘德华', 18);

   var zxy = new Star('张学友', 19);
console.log(ldh.__proto__); // 在对象系统会自动添加一个 __proto__([[Prototype]]) 指向我们构造函数的原型对象 prototype
 console.log(Star.prototype);

上下输出的是一样的 

 

        console.log(Star.prototype === ldh.__proto__); // true
        console.log(zxy.__proto__ === ldh.__proto__); // true

 

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值