JavaScript进阶 (1)

封装

构造函数存在问题

js可以通过构造函数进行封装,但存在浪费内存问题

每创建新的对象引用数据类型就开辟新的空间

原型

构造函数通过原型分配函数是所有对象所共享的

每一个构造函数都有一个prototype属性,指向另一个对象,也称为原型对象

构造函数和原型对象的this都指向实例化对象

js封装后可以面向对象编程

例如写一个数组扩展函数

const arr=[1,2,3]
Array.prototype.max=function(){return Math.max(...this)//展开运算符
} //this指向arr,无需添加参数arr.max()//3

constructor属性

每个原型对象里都有constructor属性

该属性指向原型对象的构造函数,

构造函数.prototype.constructor === 构造函数   //返回 true

添加公共属性时:

1.如果是追加

function fn(){}fn.proptotype.sing=function(){
} //属于追加操作console.log(fn.prototype)

不会丢失constructor(知道爸爸是谁)

2.如果直接赋值

function fn(){}fn.proptotype={//proptotype属于对象sing: function(){},dance: function(){}
} 

不难理解,constructor会丢失

解决方案:(也是constructor的应用)

function fn(){}fn.proptotype={  //重新指回构造函数constructor: fn,sing: function(){},dance: function(){}
} 

constructor由于new出新的实例对象

__proto__

所有对象都有__proto__,指向原型prototype,形成原型链,里面有constructor

实例对象.__proto__.constructor===构造函数

继承

原型继承(存在隐患)

 const Person = {eyes: 2,head: 1}function Woman() {}function Man() {}Woman.prototype = PersonMan.prototype = PersonWoman.prototype.constructor = Woman //防止丢失Woman.prototype.constructor = Man const red = new Woman()const blue = new Man()console.log(red)

上图可知,Person公共部分在__proto__中,指向对象原型

这里有个问题   

    Woman.prototype = PersonMan.prototype = Person

prototype指向了同一个person对象,地址相同,如果给Women添加公共属性,会添加到person中,就会成为使用对象的公共属性

   解决:

不要使用同一对象,但不同对象里包含相同属性和方法(结构相同)

需要构造函数

    function Person(){this.eyes = 2this.head = 1}function Woman() {}function Man() {}Woman.prototype = new Person()Man.prototype =  new Person()Woman.prototype.constructor = WomanWoman.prototype.constructor = Man const red = new Woman()const blue = new Man()

原型链

__proto__: 基于原型对象的继承使得不同构造函数的原型对象关联在一起,形成一种链状结构(对象一定具有__proto__)

实例对象.__proto__ =>构造函数.prototype.__proto__=>Object.prototype.__proto__=>null

原型链是一种查找规则

对象原型的意义在于为对象成员查找机制提供一条路线,从自身开始查找对象原型的原型

例如:Array.prototypr.map()   (没有原型链就不能使用此公共方法)

instanceof运算符

检测构造函数的prototype属性是否在某个实例对象的原型链上

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/729129.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

小型内衣裤洗衣机哪个牌子好?四款高热度内衣洗衣机力荐

相信很多用户从小就有个观念,内衣裤不能跟其他衣物一起混合洗,否则会感染细菌,所以不少人的内衣裤一直都是自己手洗的,清洗内衣裤不算麻烦,但日常都要换洗,对一个白天上班已经很累的人来说,真是…

如何 借助 AI + bat,1分钟内建立100个自定义文件和文件夹?

01 你好,我是云桃桃。 最近,我在写web系列的知识,做的过程中遇到过不少问题。今天,就来说说,我解决的一个批量新建文件/文件夹的问题。 事情是这样的。首先,我的大纲基本在幕布里已经弄好了,…

简析内部审计数字化转型的方法和路径【小落送书(第6期)】

个人名片: 🐼作者简介:一名大三在校生,喜欢AI编程🎋 🐻‍❄️个人主页🥇:落798. 🐼个人WeChat:hmmwx53 🕊️系列专栏:🖼️…

基于ACM32 MCU的电动滑板车方案介绍

随着智能科技的快速发展,电动滑板车的驱动系统也得到了长足的发展。国内外的电动滑板车用电机驱动系统分为传统刷式电机和无刷电机两种类型。其中,传统的刷式电机已经逐渐被无刷电机所取代,无刷电机的性能和寿命都更出色,已成为电…

玩转AI大模型应用开发,轻松打造热门APPai数字人直播软件!

AI大模型应用在数字人直播领域的应用愈发成熟,为开发者提供了更多创意和可能性。数字人直播软件是当前热门的应用之一,它结合了虚拟主播和人工智能技术,为用户带来全新的互动体验。想要打造一个火爆的数字人直播软件,就需要玩转AI…

从0到1快速搭建一个jeecg 企业级应用管理后台

一. 基本介绍 官网地址:https://jeecg.com/ JeecgBoot 是一款企业级的低代码平台!前后端分离架构 SpringBoot2.x,SpringCloud,Ant Design&Vue3,Mybatis-plus,Shiro,JWT 支持微服务。强大的…

vue 使用谷歌地图 @googlemaps/js-api-loader 进行模糊搜索

<template><div class"map"><div class"mapLeftStyle"><el-inputv-model"input"placeholder"请输入内容"class"controls"input"chnageinput"><i slot"prefix" class"e…

JavaWeb-MyBatis(上)

学完项目管理工具Maven后&#xff0c;继续学习MyBatis。我们都知道&#xff0c;JDBC是一个与数据库连接相关的API&#xff0c;最开始学习数据库连接都是从JDBC开始学起&#xff0c;但是其也有缺点&#xff0c;比如硬编码和操作繁琐等等。而今天学习的MyBatis就是专门为简化JDBC…

免费SSL证书整理合集

有哪些免费的SSL证书呢&#xff1f;下面整理了一下非常有性价比的 一&#xff1a;免费单域名SSL证书&#xff1a;适用于只有一个域名的情况下使用 点击申请免费单域名SSL证书https://www.joyssl.com/certificate/select/joyssl-dv-single-free.html?nid7 二&#xff1a;通配…

基于单片机的篮球计分器设计

在当今的体育赛事中,比赛的计分系统对观众和运动员尤为重要,观众可以根据比分的实时显示为自己支持的队伍呐喊助威,运动员更是要靠着计分器来把握比赛的节奏,包括攻防转换、替补换人以及赛间休息等等。因此,为了让比赛进行得更加专业化和流畅化,我们有必要对比赛的计分系…

Linux 内存

Linux 内存 一:工具1.free2.查看内存额定值3.查看指定进程内存二:buffer/cache1.Buffer具体职责2.Cache具体职责区别三级目录一:工具 1.free -b  以Byte为单位显示内存使用情况。 -k  以KB为单位显示内存使用情况。 -m  以MB为单位显示内存使用情况。 -g 以GB为单位显…

Java Day4 API

文章目录 1、Object类1.1 Tostring1.2 equals1.3 clone 2、Objects类2.1 equals方法isNull 与nonNull 3、包装类3.1 常见操作 4、StringBuilder5、StringBuffer6、StringJoiner 1、Object类 所有类的基类。 1.1 Tostring public String toString() 返回对象的字符串表示形式…

总结Redis的原理

一、为什么要使用Redis 缓解数据库访问压力mysql读请求进行磁盘I/O速度慢&#xff0c;给数据库加Redis缓存&#xff08;参考CPU缓存&#xff09;&#xff0c;将数据缓存在内存中&#xff0c;省略了I/O操作 二、Redis数据管理 2.1 redis数据的删除 定时删除惰性删除内存淘汰…

设计定时任务实现数据同步的最佳实践

✨✨谢谢大家捧场&#xff0c;祝屏幕前的小伙伴们每天都有好运相伴左右&#xff0c;一定要天天开心哦&#xff01;✨✨ &#x1f388;&#x1f388;作者主页&#xff1a; 喔的嘛呀&#x1f388;&#x1f388; 目录 引言 一、选择合适的定时任务框架 Quartz Spring 的 Task…

【MATLAB第98期】基于MATLAB的MonteCarlo蒙特卡罗结合kriging克里金代理模型的全局敏感性分析模型【更新中】

【MATLAB第98期】基于MATLAB的Monte Carlo蒙特卡罗结合kriging克里金代理模型的全局敏感性分析模型【更新中】 PS:因内容涉及较多&#xff0c;所以一时半会更新不完 后期会将相关原理&#xff0c;以及多种功能详细介绍。 麻烦点赞收藏&#xff0c;及时获取更新消息。 引言 在…

如何判断螺栓已经拧紧?——SunTorque智能扭矩系统

智能扭矩系统-智能拧紧系统-扭矩自动控制系统-SunTorque 螺栓拧紧的标准并非仅仅依赖于螺栓的外观&#xff0c;而是依赖于几个关键因素&#xff0c;包括扭矩、预紧力和材料疲劳等。下面SunTorque智能扭矩系统和大家将详细讨论这些因素&#xff0c;并给出如何判断螺栓是否已经拧…

史上最大优惠!腾讯云服务器优惠价格表一年、1个月收费明细

腾讯云服务器多少钱一年&#xff1f;61元一年起&#xff0c;2核2G3M配置&#xff0c;腾讯云2核4G5M轻量应用服务器165元一年、756元3年&#xff0c;4核16G12M服务器32元1个月、312元一年&#xff0c;8核32G22M服务器115元1个月、345元3个月&#xff0c;腾讯云服务器网txyfwq.co…

Linux MBR扇区故障 引导修复

CSDN 成就一亿技术人&#xff01; 作者主页&#xff1a;点击&#xff01; Linux专栏&#xff1a;点击&#xff01; CSDN 成就一亿技术人 前言———— Linux MBR&#xff08;Master Boot Record&#xff0c;主引导记录&#xff09;是硬盘的第一个扇区&#xff0c;通常位于磁…

maven项目引入私有jar,并打包到java.jar中

私有jar存放位置 maven依赖 <dependency><groupId>com.hikvision.ga</groupId><artifactId>artemis-http-client</artifactId><version>1.1.10</version><scope>system</scope><systemPath>${project.basedir}/s…

Tomcat常见配置(基础功能、虚拟主机、搭建博客)

目录 一、Tomcat基础功能 1、自动解压war包 2、Tomcat工具界面 2.1 Server Status (服务器状态) 2.1.1 本地登录状态页 2.1.2 远程登录状态页 2.2 Manager App (管理应用程序) 2.3 Host Manager (主机管理器) 3、Context 配置 二、配置虚拟主机 三、搭建 JPress 博客…