关于javascript原型链的一些思考

这里想要探讨关于js prototype的继承问题

创建一个名为person的类 

创建一个对象Bob

const person = function (name, year) {
  this.name = name;
  this.year = year;
  // 此处不推荐在person类内部直接创建calcAge这样当有多个对象使用person类时会降低性能
  // this.calcAge=function(){
  //   console.log(2023-this.year);
  // }
};
//正确的做法是在person的prototype中添加calcAge方法这样所有对象都可以通过prototype继承使用这一方法
person.prototype.calcAge = function () {
  console.log(2023 - this.year);
};

const p1 = new person('Bob', 2000);

此时对于Bob可以正常使用calAge(),那我们自然的想看一看Bob现在是什么

console.log(p1);
console.log(p1.__proto__);
console.log(p1.prototype);

输出：

 这里的前两行很容易理解为什么最后一行会是undefined 呢？这个问题困扰了我很久，我反复研究了关于prototype继承最终利用数组得出了答案

先明确数组的两种建立方法

const arr1 = [1, 2, 5, 8, 9];
const arr2 = new Array(3, 4, 5, 9, 0);

查看prototype

console.log(arr1.prototype, arr2.prototype);

均为undefined

查看两数组

这里的原型均为Array(0)而这也就是undefined出现的原因我们展开Array(0) 里面出现的内容与Array.prototype相同

console.log(
  arr1.__proto__ === Array.prototype,
  arr2.__proto__ === Array.prototype
);

再来看看这个

console.dir(Array());
console.log(Array());

输出

 有没有感觉很熟悉第一行正是之前两数组的prototype直接对应的值，这个值直接用console.log()输出就会得到空数组也就是undefined

而之前的p1.prototype会输出 undefined则是因为其值恰好对应一个空对象

这是我对原型链的一些理解有问题欢迎指正，这里是一个努力学习前端技术的菜鸟