当前位置: 首页 > news >正文

010-原型链

原型链

  • 1、概念
  • 2、原理
  • 3、new 操作符原理
  • 4、应用

1、概念

原型链:javascript的继承机制,是指获取JavaScript对象的属性会顺着其_proto_的指向寻找,直至找到Object.prototype上。

2、原理

💡 Tips:构造函数 Fn, p 为 new Fn 的实例对象,p 有一个属性 proto 指向了 Fn.prototype,形成原型链。

function Fn(name) {this.name = name;
}
Fn.prototype.run = function () {console.log('run run run ' + this.name);
};let obj2 = new Fn('tom');
obj2.run();
console.log(obj2.__proto__ === Fn.prototype); // true
console.log(Fn.prototype.constructor === Fn); // true
console.log(obj2.constructor === Fn); // true

原型链示意图:
在这里插入图片描述

3、new 操作符原理

function Fn(name, age) {this.name = namethis.age = age
}
Fn.prototype.sayName = function () {return this.name
}
var obj = myNew(Fn, "zcf", 18)
obj.sayName() // "zcf"function myNew() {//第一步新建一个对象var obj = {}// 第二步,拿到构造函数var constructor = [].shift.call(arguments)// 将obj的原型指向构造函数的原型,这样obj就可以访问构造函数原型中的属性了obj.__proto__ = constructor.prototype// 使用apply改变构造函数this指向obj,这样obj就可以访问构造函数原型中的属性了var ret = constructor.apply(obj, arguments)// 要返回objreturn typeof ret === "object" ? ret : obj
}

4、应用

将属性挂载到实例对象上,将公共方法挂载到构造函数的原型上,减少每次 new 时,都需要创建方法,多消耗堆内存。

http://www.lryc.cn/news/312315.html

相关文章:

  • Electron-builder打包安装包——编译篇
  • Red Hat系统升级内核版本
  • Java集合set之HashSet、LinkedHashSet、TreeSet的区别?
  • 全方位碾压chatGPT4的全球最强模型Claude 3发布!速通指南在此!保姆级教学拿脚都能学会!
  • upload-Labs靶场“11-15”关通关教程
  • linux-rpm命令
  • 如何利用python实现自己的modbus-tcp库
  • linux系统-----------搭建LNMP 架构
  • C++中boost库的安装及使用(Windows)
  • CPP编程-CPP11中的内存管理策略模型与名称空间管理探幽(时隔一年,再谈C++抽象内存模型)
  • springboot项目整合minio实现文件的分布式存储
  • 微信小程序开发学习笔记《19》uni-app框架-配置小程序分包与轮播图跳转
  • Python内置模块
  • WordPress建站入门教程:小皮面板phpstudy如何安装PHP和切换php版本?
  • 用友 NC saveDoc.ajax 任意文件上传漏洞复现
  • 如何使用达摩盘
  • 网络编程的学习
  • 【Mining Data】收集数据(使用 Python 挖掘 Twitter 数据)
  • 2024京津冀光伏展
  • 在C#中使用Linq
  • Swing程序设计(11)动作事件监听器,焦点事件监听器
  • Python 开发图形界面程序
  • 百度搜索引擎SEO优化方法
  • 一文了解docker与k8s
  • Linux基础——进程控制
  • 网络工程师笔记8
  • 从零学算法128
  • 2024免费mac苹果电脑的清理和维护软件CleanMyMac X
  • Python反射机制在实际场景中的应用
  • 网络原理初识