世上只有妈妈好,没妈的孩子像棵草~【原型详解:prototype和__proto__】

#新手很容易混淆prototype和__proto__,今天就来聊聊这两个吧~#

首先区分:prototype是构造函数的,__proto__是对象的:

1. prototype 原型(的)对象:由构造函数使用。构造函数定义时系统自动会分配一个原型。

2. __proto__ 对象(的)原型 :(实质上是getter和setter,会对设置的值自动进行判断)  是通过对象直接调用的。一种非标准属性,是访问器属性。

1. prototype是构造函数的属性:

重点:实例的__proto__属性会指向该构造函数的prototype对象。

    function Star() { }
    let str = new Star()
    console.log(str.__proto__ === Star.prototype);//true
    //重点:即实例化对象的__proto__属性指向构造函数的prototype属性
    //可以这样想:实例的爸爸是构造函数,所以实例对象的(对象)原型__proto__的爸爸就是构造函数的prototype(原型)对象。

2. 普通对象没有prototype属性(实例对象自己也没有):

普通对象的原型链引用是通过 __proto__ 属性(非标准但广泛支持)或者 Object.getPrototypeOf() 方法来访问和操作的。

    //1.
    let hs = { age: 19 }
    //这里是先给对象添加prototype属性,然后再添加其他属性:
    hs.prototype = {
      show() {
        console.log('houdunrne.com');
      }
    }
    console.log(hs);

    //2.
    let th = { age: 19 }
    console.log(th);
    // 添加prototype属性,并给prototype添加多种属性:
    th.prototype = {
      constructor: Object,//constructor指向(该原型对象的)构造函数(普通函数的构造函数是Object)。
      show() {
        console.log('houdunrne.com');
      },
      render() {
        console.log('pink');

      }
    }
    console.log(th)
    //3普通函数给父级添加单一属性(添加到Object上了):
    let it = {}
    console.log(it);

    it.__proto__.show = function () {
      console.log('js');
    }
    console.log(it);

```

3.原型方法:

1.Object.isPrototypeOf()原型检测
//原型检测的Object可以自由发挥:
let hd={}
let re={}
hd.prototype=re
console.log(re.isPrototypeOf(hd))//true,即判断hd的原型是否是re


2.Object.setPrototype()设置原型
3.Object.getPrototype()得到原型

5.in和hasOwnProperty查找属性:

1.hasOwnProperty:
    let a = { name: 'jack' }
    let b = { url: 'houcunren.com' }
    console.log('name' in a);
    Object.setPrototypeOf(a, b)
    console.log('url' in a);//true,即in会攀升,查找原型链

    console.log(a.hasOwnProperty('url'));//false,即hasOwnProperty不会查找原型链

2. in:
    //在for-in 中,因为in会攀升,所以要判断:
    let object = { name: 'houdunren' }
    let object2 = { url: 'js.com' }
    Object.setPrototypeOf(object, object2)
    for (const key in object) {
      if (object.hasOwnProperty(key)) {
        console.log(key);//name
        console.log(object[key]);//houdunren
      }
    }

晚安煲仔们,今天让自己多多休息哦~

羽毛球是个不错的运动,但是很费胳膊就是了🤦‍!!!

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值