理解原型和原型链

不管什么时候,js原型是前端无法绕过去的问题,所以今天抽空总结一下,方便后续学习。

初步会总结以下文章

  • 什么是原型、和原型链
  • js继承的方式
  • es5如何实现class

第一篇:什么是原型和原型链

为什么要讨论原型和原型链?

Javascript的数据类型分为基本数据类型(String、Number、Boolean 、Undefined、Null、Symbol)和引用数据类型,除了基本数据类型外,剩下的都是对象,但是由于js中没有类(class 在ES6中引入了class,其实知识语法糖,本质还是没变),如何将这些对象联系起来,如何共享这些对象中的方法和属性,于是就有了原型和原型链的概念。(其实就是怎么能解决继承的问题)

原型:

英文单词 prototype; 发音:['proʊtə.taɪp],是每个函数中的一个私有属性,这个属性是个指针,指向了它的原型对象 prototype object;

函数a,通过打印a.prototype ,可以打印出它的原型对象,但是通过构造函数B实例化出来的实例对象b,打印prototype属性时候确是undefined

所以说只有函数才有prototype这个属性,通过这个属性才能访问到它的原型对象;

原型对象:

prototype object,每一个对象都有一个原型对象

原型链:

每个实例对象都有一个私有属性__proto__指向它的构造函数的原型对象(prototype object)。该原型对象内部也有一个私有属性__proto__指向它的原型对象,这样层层向上直到一个对象的原型对象为null。null没有原型对象,并作为这个原型链中的最后一个环节。

构造函数,实例对象,原型对象三者的关系图:

如何理解上面的图片

  • 构造函数:首先明确它是一个对象,同时它也可以是一个普通函数,在它的内部有一个私有属性prototype,是一个指针,指向了它的原型对象。
  • 通过new 实例化出来的实例对象内部有一个私有属性__proto__ ,指向了它的原型对象;
  • 在原型对象中有一个constructor属性,又指️向了构造函数;

这样就将它们联系起来了;

html:
function P(name,age){
        this.name = name;
        this.age = age;
    }
    const p = new P('Nichlas',18);
    console.log(p.__proto__);
复制代码

html:
  const n = new Number(1);
  console.log(n);
  console.log(n.__proto__);
复制代码

转载于:https://juejin.im/post/5cbfb324f265da034c702a42

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值