JS原型

2023-11-16

原型的概念

  1. 实例对象中__proto__是原型,是一个属性也是一个对象,是给浏览器使用的,是不标准的,这个叫隐式原型。
  2. 构造函数中的prototype是原型,是一个属性也是一个对象,是给程序员用的,是标准的

       __proto__原型是浏览器使用的,有些浏览器支持,有些浏览器不支持,所以说它是不标准的;而prototype原型则是给程序员用的,所有浏览器都支持;所有我们说的原型一般都指prototype


原型链

原型链:是一种关系,实例对象和原型对象之间的关系,关系是通过原型(__proto__)来联系的

原型的作用

  • 共享数据,节省内存空间
  • 通过原型实现继承

凡是你希望这个方法通过实例对象调用的并且希望共享的,那么这个方法都可以放在原型里面,而不需要共享的数据则写在构造函数中



当有多个属性和方法需要被同时共享时,这时可以将原型对象拿出来写成一个对象,不过此时需要自己手动修改构造器的指向


如果想要使用一些属性和方法,并且属性的值在每个对象中都是一样的,方法在每个对象中的操作也都是一样,那么,为了共享数据,节省内存空间,是可以把属性和方法通过原型的方式进行赋值

原型中的方法是可以被相互调用的

实例对象调用属性和方法时,现在实例对象中查找,找到了直接用,找不到则去实例对象的__proto__指向的构造函数的原型对象prototype中找,找到直接调用,属性找不到为undefined,方法找不到则报错

构造函数、原型对象、实例对象之间的关系

  1. 构造函数可以实例化对象
  2. 构造函数中有一个属性叫prototype,是构造函数的原型对象
  3. 构造函数的原型对象(prototype)中有一个constructor构造器,这个构造器指向的就是自己所在的原型对象所在的构造函数
  4. 实例对象的原型对象(__proto__)指向的是该构造函数的原型对象
  5.  构造函数的原型对象(prototype)中的方法是可以被实例对象直接访问的


改变原型指向

实例对象的原型__proto__指向的是该对象所在的构造函数的原型对象
构造函数的原型对象(prototype)指向如果改变了,实例对象的原型(__proto__)指向也会发生改变



此时若要调用Student通过原型定义的属性和方法则需要定义在改变指向的下面,这样Student的实例对象才能调用



通过原型实现继承

继承: 首先继承是一种关系,类(class)与类之间的关系,JS中没有类,但是可以通过构造函数模拟类,然后通过原型来实现继承 

继承也是为了数据共享,js中的继承也是为了实现数据共享

为了数据共享,改变原型指向,做到了继承,不过因为改变原型指向的同时实现继承,直接初始化了属性,继承过来的属性的值都是一样的了,只能重新调用对象的属性进行重新赋值。此时需要结合借用构造函数形成组合继承,完成完整的继承

借用构造函数:构造函数名字.call(当前对象,属性,属性,属性....);


本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

JS原型 的相关文章

  • 在 ajax 完成之前阻止提交

    我正在使用 jQuery 并且我希望在所有 ajax 调用完成之前表单提交不会起作用 我想到的一种方法是存储一个布尔值 该值指示是否有 ajax 请求正在进行 在每一个结束时它都会被设置为 false 我不确定这是否是最好的方法 所以我将不
  • 在 Web 浏览器中查找触发 then 事件的 jQuery 代码

    我加入了一个团队来从事一个项目 现在他们使用 jQuery 并且很多 javascript 文件都是外部文件而不是嵌入的 当我点击一个按钮时 它看起来就像 a class button cancel Cancel a 它触发一个在一个 ja
  • 我可以从 HTTP 请求中找到无线接入点的 BSSID(MAC 地址)吗?

    假设有人在咖啡店里无线连接到互联网 并向 johnsveryownserver com 发送 HTTP 请求 服务器端 有什么方法可以确定我的MAC地址吗 无线接入点他们连接到什么 请注意 我对他们机器的 MAC 地址不感兴趣 如果我无法使
  • Ext JS - 如何滚动到文本区域的底部

    这是我下面的代码 如何滚动到文本区域的底部 它一定是类似的东西 Ext getCmp output setScrollPosition Ext getCmp output getScrollHeight 这是我的文本区域代码 var myW
  • 如何将中间件绑定到socket.io中的事件

    现在您可以将中间件绑定到io use middleware 但这仅在建立套接字连接时触发 有没有办法在将其传递给事件句柄之前拦截它 就像在expressjs中一样 换句话说 In 快递 js你可以做 app get middleware1
  • 禁用 JavaScript 中的右键单击

    当我尝试禁用右键单击时 它不起作用 我尝试使用下面的代码 document onclick function e console log e button if e button 2 e preventDefault return fals
  • ElectronJS ReferenceError:导航器未定义

    我正在尝试在电子上制作自定义标题栏 但是当我启动我的应用程序时 我遇到了 ReferenceError 导航器未定义 问题 请帮忙 这是我的 main js 中的代码片段 My Codes https i stack imgur com c
  • JavaScript 动画平滑滚动

    默认情况下 当您有这样的片段链接时 a href some url some fragment some text a 浏览器立即向下滚动到该片段 我该如何编程才能使用标准 JS 顺利地向下移动到该片段 这是一个例子 Example htt
  • 如何改变HTML5视频的播放速度?

    如何更改 HTML5 中的视频播放速度 我查过视频标签的属性 https www w3schools com html html5 video asp在 w3school 但无法做到这一点 根据这个网站 http www chipwreck
  • v-file-input .click() 不是函数

    我试图以编程方式触发 v file input 的 click 事件 因为它在 Vuetify 的文档中 但它显示一个错误this refs imagePicker click is not a function我在这里错过了什么吗 代码重
  • Aptana Studio 3 上的预览选项卡在哪里?

    我在 Windows PC 上使用 Aptana Studio 2 并有一个选项卡用于在 IE 上预览页面 另一个选项卡用于在 Firefox 上预览 但我切换到了 Aptana 3 我不知道是没有预览还是我没有找到它 是的 我在 stac
  • KeyboardEvent.keyCode 已弃用。这在实践中意味着什么?

    根据 MDN 我们绝对应该not正在使用 keyCode财产 它已被弃用 https developer mozilla org en US docs Web API KeyboardEvent keyCode https develope
  • 用数组反向查找对象

    假设我有一个这样的对象 resourceMap a 0 1 2 3 4 5 6 7 8 9 10 b 11 12 c 21 23 d 54 55 56 57 510 确定是否的最佳方法是什么resourceId 21将会 c 我们不知道钥匙
  • React无限滚动scrollableTarget动态获取id?

    我在我的项目中使用react infinite scroll component 如何让scrollableTarget动态获取item id 我试过这样scrollableTarget item id 但它不起作用 必须与该 div 具有
  • window.showModalDialog 的等效跨浏览器解决方案是什么?

    window showModalDialog 的等效跨浏览器解决方案有哪些 showModalDialog 在 IE 和 FF 3 中引入 我个人认为没有 但是有很多 UI 工具包提供了这样的功能 例如jQuery UI http jque
  • 您如何看待引导模式触发器的相应回调?

    On 引导模态 http getbootstrap com javascript modals 我们知道我们可以为触发器绑定事件 例如show or hide using show shown hide hidden 但此事件绑定仅适用于一
  • 在javascript中动态生成行?

    我是 javascript 新手 我想在按下 Tab 时动态生成行 并希望获取在动态生成的行中输入的值 以便我可以在 servlet 代码中使用这些值 这是我的html
  • Restangular - _.contains() 不是一个函数

    如果您最近通过 Bower 更新了 Restangular 它将安装最新的 Lodash 新的 4 0 然而 这是一个问题 因为 Restangular Angular 现在会抛出错误 contains 不是函数 你怎么解决 解决方案非常简
  • 如何在 SVG 元素上使用箭头标记?

    我需要在 d3 js 中创建一个箭头 但我找到的只是带有节点图的示例 我需要的是简单地制作一个从 A 点到 B 点的箭头 我尝试实现以下示例中的部分代码 http bl ocks org 1153292 http bl ocks org 1
  • 如何调试 Gulp 任务?

    如何调试我的中定义的 gulp 任务gulpfile js使用诸如 Google Chrome 调试器之类的调试器逐行单步执行任务的代码 对于 Node js 6 3 版本 您可以使用 inspect flag https nodejs o

随机推荐

  • 通过增加模型的大小来加速Transformer的训练和推理

    点击上方 AI公园 关注公众号 选择加 星标 或 置顶 作者 Eric Wallace 编译 ronghuaiyang 导读 你没有看错 确实是通过增大模型的大小 大家别忘了 在训练的时候 有个隐含条件 那就是模型需要训练到收敛 模型训练会
  • SQL Server 变量

    变量的种类 在T SQL中 变量按照生存范围分为 局部变量和 全局变量 1 全局变量是由系统定义的 在整个SQL Server实例内都能访问到的变量 以 作为第一个字符 用户只能访问 不可以赋值 2 局部变量由用户定义 生命周期只在一个批处
  • 哈希函数的特征_哈希函数及其特征

    哈希函数的特征 Prerequisite Hashing data structure 先决条件 哈希数据结构 The hash function is the component of hashing that maps the keys
  • 机器学习之SVM支持向量机

    目录 经典SVM 软间隔SVM 核SVM SVM分类器应用于人脸识别 SVM优点 SVM缺点 经典SVM 支持向量机 Support Vector Machine SVM 是一种二分类模型 其基本思想是在特征空间中找到一个最优的超平面 使得
  • UWB系统的定位精度影响因素

    UWB系统的定位精度影响因素 影响UWB定位精度的因素较多 主要包括 多径效应 非视距传播 多址干扰 参考基站数量 参考基站位置和时钟同步误差等因素 1 多径效应 超宽带信号在室内传播过程中受到复杂的室内环境 如墙体 窗体及室内障碍物等 的
  • go的配置文件

    go湖南老乡 2018 2 5 17 55 54 package main import github com kylelemons go gypsy yaml fmt type reply to findnode neighbors st
  • 初学者用Eclipse和IDEA哪个好用一点?

    idea 毫无疑问 它已经强大到各处吊打eclipse了 新人更是推荐idea 它的语法提示十分智能 假如你写了一段很傻的代码 它会提示你使用更优写法 只需要点一下就可以自动变成更优写法了 普通for自动转增强for 自动转lambda语法
  • SpringBoot版本升级 2.4.5-->2.7.9 遇到的问题

    原项目功能部署 SpringCache Swagger 项目Boot版本升级遇到的问题 问题一 无法启动 报错信息为 org springframework context ApplicationContextException Faile
  • 查看Mysql表的引擎

    show create table 表名
  • 三.数 据 链 路 层

    数据链路层是实现设备之间通信的非常重要的一层 数据链路层的作用 数据链路层使用的信道 1 使用点对点信道的数据链路层 1 1 数据链路和帧 链路 link 是一条无源的点到点的物理线路段 中间没有任何其他的交换结点 一条链路只是一条通路的一
  • 数据分析之-pandas

    1 pandas库安装导入 windows下和linux下都可以使用pip安装 安装之前最好把pip升级到最新版 python m pip install upgrade pip 升级pip pip install pandas 安装pan
  • myabtis-plus 代码生成器自定义模板

    mybatis plus代码生成器默认生成的controller是下面这样的 一个空的controller RestController RequestMapping sysUserRoleRelevance public class Sy
  • JavaScript中浮点数精确值问题

    js中规定安全整数的范围是 2的53次方至2的53次方 也就是 9007199254740992 9007199254740992 在JavaScript中0 1 0 2不等于0 3的问题 0 1 0 2 0 300000000000000
  • 深度学习系统为什么容易受到对抗样本的欺骗?

    转自 https zhuanlan zhihu com p 89665397 本文作者 kurffzhou 腾讯 TEG 安全工程师 最近 Nature发表了一篇关于深度学习系统被欺骗的新闻文章 该文指出了对抗样本存在的广泛性和深度学习的脆
  • LeetCode 7. 整数反转(C语言)

    Description 给出一个 32 位的有符号整数 你需要将这个整数中每位上的数字进行反转 示例 1 输入 123 输出 321 示例 2 输入 123 输出 321 示例 3 输入 120 输出 21 注意 假设我们的环境只能存储得下
  • 【01规划】POJ 3621 Sightseeing Cows

    POJ 3621 Sightseeing Cows 题意 给定一张 n 个点 m 条边的有向图 每个点都有一个权值 f i 每条边都有一个权值 t i 求图中的一个环 使 环上各点的权值之和 除以 环上各边的权值之和 最大 输出这个最大值
  • MVC 实现登录功能

    1 表单 2 数据层 3 逻辑层 4 servlet分发控制器
  • 高校巡讲总结—侯伯薇讲师

    这个月里面 借助CSDN的平台 在三所高校中做了 程序员修炼之路 的巡讲 在其中讲述了自己的一些经历 并和同学们聊了学习 思考和分享这三个要素 三所高校各自有各自的特点 感觉很有意思 一一叙述如下 首先 第一站是在辽宁工程技术大学 位于葫芦
  • 总结Windows下安装WSL与升级WSL2的方法

    目录 1 安装WSL1的方法 2 安装WSL2的方法 3 升级WSL1到WSL2的方法 1 打开win10的设置 搜索windows功能 打开启用或者关闭Windows功能 2 勾选以下2个地方 并重启 3 下载WSL2升级包 并点击安装
  • JS原型

    原型的概念 实例对象中 proto 是原型 是一个属性也是一个对象 是给浏览器使用的 是不标准的 这个叫隐式原型 构造函数中的prototype是原型 是一个属性也是一个对象 是给程序员用的 是标准的 proto 原型是浏览器使用的 有些浏