JS原型链的理解

java作为面向对象的一门后台开发语言,有类的概念,有继承、封装、多态。但是js是基于对象,没有类,包括es6的class本质上还是对象,和java中的class并不相同。但是想一下在实际开发经常用到toString这些方法,为什么可以直接使用而不用每次都去定义,这一切都要归功于原型链

构造函数

构造函数其实就是一个普通函数,但是在命名上习惯采用首字母大写的方式,其次调用的时候需要使用new关键字

function Person(name, age) {
    this.name = name
    this.age = age
    this.sayName = function () {
        console.log(this.name);
    }
}
var per1 = new Person("CXK", 18);
var per2 = new Person("huge", 28);

per1.sayName() // CXK
per2.sayName() //huge

很明显,per1和per2两个实例对象的sayName是不一样的,那意味着每次实例化同一个函数,都会开辟新的内存空间,如果new了无数个对象,那系统开销就十分庞大了,那这时候就需要一个方法,让实例对象在需要的时候沿着某个线索去一个公共区域自己找需要的对象,也就是原型prototype

function Person(name) {
  this.name = name;
}

// 通过构造函数的 Person 的 prototype 属性找到 Person 的原型对象
Person.prototype.gender = function() {
  console.log("都是男人");
}

let p1 = new Person("CXK");
let p2 = new Person("huge");

console.log(p1.gender === p2.gender); // true

可以发现,通过prototype实例化的两个对象属性指向了同一块内存地址,为什么会这样呢

每个函数都会有一个prototype属性,这是在创建函数的时候js引擎自动创建的,这个属性指向函数的原型对象,那原型对象怎么知道自己是被哪个构造函数初始化的呢,其实原型对象也有一个constructor属性指向了构造函数

Person.prototype.constructor === Person // true

原型链

每个对象在被创建的时候会被自动添加一个_proto_的属性,这个属性值指向了当前实例对象的构造函数对应的原型对象

p1.__proto__ === Person.prototype // true

假如我们从一个对象中去找一个属性name,如果在当前对象中没有找到,那么会通过__proto__属性往原型对象中找,没有继续原型的原型对象找,一直往上找,期间如果找到了就直接用,没找到就到了Object对象,Object是JS中所有对象数据类型的基类(最顶层的类)在Object.prototype上没有__proto__这个属性

Object.prototype.__proto__ === null

 

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

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

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

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值