原始的原型链是怎样玩的

带着问题看代码:

1、原始的继承是怎样实现继承的? A类的prototype 属性 = B类的实例

2、实现继承后,连B类的中实例的属性(放在了A类的prototype中)和原型链的上的东西都可以用

3、A.prototype.constructor实际上已经指向了B--被重写了(但是不影响对实际代码运行的理解)

4、原型链继承,是往上找,找到了直接就用了,就不再往上找了

javascript 复制代码
function subType (j) {
  this.name = 'subType'
  this.nameJ = j
}
subType.prototype.getValue = function () {
  return  'subType原型上的值'
}

function deviceType (k) {
  this.nameOther = 'deviceTye'
  this.nameK = k
}
// 这种方法实现的继承,就是连constructor中的属性就也给继承了
deviceType.prototype = new subType()
deviceType.prototype.getValueOther= function() {
  return 'deviceType原型链上的值'
}

let instance = new deviceType(99)

// 继承的表现,可以看到自己原型上的,和继承某个实例对象原型链上的东西
console.log(instance.nameOther) // deviceTye
console.log(instance.name) // subType
console.log(instance.getValueOther()) // deviceType原型链上的值
console.log(instance.getValue())  // subType原型上的值

// 这行打印可以看到是怎样的,(继承某个实例的属性)会放在deviceType.prototype.
console.log(instance.__proto__) // { name: 'subType', getValueOther: [Function (anonymous)] }

// 会发现被重写了
console.log(instance.constructor) //  [Function: subType]
// 打印一下完整的原型链
console.log(instance.__proto__.__proto__.constructor) // [Function: subType]

// 虽然被重写了,但是不影响实例化
console.log(instance.nameK)  // 99
console.log(instance.nameJ) // undefined
相关推荐
_柳青杨3 小时前
深入理解 JavaScript 事件循环
前端·javascript
大家的林语冰8 小时前
ES5 凉凉,Babel 8 正式发布,默认不再编译为 ES5 和 CJS......
前端·javascript·前端工程化
weedsfly11 小时前
异步编程全景与事件循环——彻底搞懂 JS 执行机制
前端·javascript
用户17335980753711 小时前
纯前端 PDF 数字签名实战:Vue 3 + pdf-lib 在浏览器里完成签名嵌入
前端·javascript
JieE21221 小时前
LeetCode 226. 翻转二叉树|JS 递归超详细拆解,二叉树入门经典题
javascript·算法
JieE2121 天前
LeetCode 104. 二叉树的最大深度|递归思路超详细拆解
javascript·算法
kyriewen1 天前
我用 AI 一周写完了整个项目,上线第一天就崩了——这是我踩过最贵的 5 个坑
前端·javascript·ai编程
Larcher1 天前
AI Loop:让AI像人一样自主完成任务的核心机制
javascript·人工智能·设计模式
默_笙1 天前
🃏 JS 只有 8 种数据类型,但我花了 2 天才搞懂 null 和 undefined 的区别
javascript
jump_jump1 天前
流式 HTML:从 htmx 片段装配到浏览器原生增量渲染
javascript·性能优化·前端工程化