JS-05拷贝继承

目录

1 前置问题

2 拷贝继承实现

3 拷贝封装

4 浅拷贝和深拷贝

5 应用广泛


场景:想使用某个对象中的属性,但是又不能直接修改它,于是就可以创建一个该对象的拷贝

1 前置问题

   直接将一个对象source赋值给另一个对象target,此时两个是同一个对象(共享),修改任一个对象,另一个对象也会随之改变(不能实现上述问题)

var source={name:"张三",age:18};

var target=o3

  • var source={name:"张三",age:18}
  • var target={};
  • target.name=source.name
  • target.age=source.age;

这段代码可以实现需求,但是如果属性过多,则会出现代码冗余现象。

2 拷贝继承实现

 1、已经拥有了o3对象

 2、创建一个o3对象的拷贝(克隆):for...in循环

        a、取出o3对象中的每一个属性

        b、获取到对应的属性值

        c、把属性值放到o4中

3、修改克隆对象,把该对象的name属性改为"李四"

  。。。后续如果修改了o4对象中的相关属性,就不会影响到o3

代码实现:

<script>var o3={name:"张三",age:18};var o4={};for (var key in o3) {//key就是o3对象中的每一个属性var value = o3[key];o4[key] = value;}o4.name="李四"console.log(o4);    //最终的目标对象的结果</script>

3 拷贝封装

上面的方式很明显无法重用,实际代码编写过程中,很多时候都会使用拷贝继承的方式,所以为了重用,可以编写一个函数把他们封装起来: 

<script>
函数:封装拷贝代码块function extend(source,target){for (var key in source) {var value = source[key];target[key] = value;}}var o3={name:"张三",age:18};var o4={};extend(o3,o4);o4.name="李四";var o5={};extend(o3,o5);o5.name="wangwu";
</script>

4 浅拷贝和深拷贝

- 浅拷贝知识拷贝一层属性,没有内部对象

-  深拷贝其实是利用递归的原理,将对象的若干层属性拷贝出来

var students=[{name:"",age:""},{name:"",age:""}
]

5 应用广泛

+ 由于拷贝继承在实际开发中使用场景非常多,所以很多库都对此有了实现
    - jquery:$.extend

+ es6中有了对象扩展运算符仿佛就是专门为了拷贝继承而生:

  var source={name:"张三",age:18}
//让target是一个新对象,同时拥有了name、age属性var target={ ...source }var target2={ ...source,age:20 } 修改属性值 

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

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

相关文章

【Flutter】显式动画

&#x1f525; 本文由 程序喵正在路上 原创&#xff0c;CSDN首发&#xff01; &#x1f496; 系列专栏&#xff1a;Flutter学习 &#x1f320; 首发时间&#xff1a;2024年5月29日 &#x1f98b; 欢迎关注&#x1f5b1;点赞&#x1f44d;收藏&#x1f31f;留言&#x1f43e; 目…

微服务项目搭建之技术选型

1、什么是微服务 Java微服务是一种架构风格&#xff0c;通过将单个Spring Boot应用程序拆分为一组小型、独立的Spring Boot服务来构建分布式系统。每个微服务都运行在自己的进程中&#xff0c;并使用轻量级通信机制&#xff08;如HTTP或消息队列&#xff09;来进行相互之间的通…

【C++】从零开始构建红黑树 —— 节点设计,插入函数的处理 ,旋转的设计

送给大家一句话&#xff1a; 日子没劲&#xff0c;就过得特别慢&#xff0c;但凡有那么一点劲&#xff0c;就哗哗的跟瀑布似的拦不住。 – 巫哲 《撒野》 &#x1f30b;&#x1f30b;&#x1f30b;&#x1f30b;&#x1f30b;&#x1f30b;&#x1f30b;&#x1f30b; ⛰️⛰️…

Vue组件通讯$attrs和$listeners例子

在Vue中&#xff0c;$attrs 和 $listeners 是两个非常有用的特性&#xff0c;它们允许你更轻松地实现组件间的通讯&#xff0c;特别是当你需要创建可复用的组件时。 $attrs 包含了父组件中未被子组件声明的属性 (class 和 style 除外)。当你不想在子组件中逐个声明父组件传递的…

在豆包这事上,字节看得很明白

大数据产业创新服务媒体 ——聚焦数据 改变商业 导语&#xff1a; 1.基于豆包的话炉/猫箱APP市场反响一般 2.价格战对于豆包来说是副产物 3.价格战对大模型市场是良性的 4.豆包接下来会推广至国际社会 因为宣称价格比行业便宜99.3%&#xff0c;豆包成功出圈了。根据火山引擎公…

笔试强训week6

day1 Q1 难度⭐⭐ 小红的口罩_牛客小白月赛41 (nowcoder.com) 题目&#xff1a; 疫情来了&#xff0c;小红网购了 n 个口罩。 众所周知&#xff0c;戴口罩是很不舒服的。小红每个口罩戴一天的初始不舒适度为 ai​。 小红有时候会将口罩重复使用&#xff08;注&#xff1a;…

【Linux】数据链路层协议+ICMP协议+NAT技术

欢迎来到Cefler的博客&#x1f601; &#x1f54c;博客主页&#xff1a;折纸花满衣 &#x1f3e0;个人专栏&#xff1a;Linux 目录 &#x1f449;&#x1f3fb;数据链路层&#x1f449;&#x1f3fb;以太网以太网帧格式网卡Mac地址对比ip地址 &#x1f449;&#x1f3fb;MTUMTU…

gtest的使用和简单例子

首先需要安装gtest的库&#xff0c;命令如下&#xff1a; git clone https://github.com/google/googletest.git cd googletest mkdir build cd build cmake .. sudo make install后续就可以直接包含gtest头文件进行测试了。 这里给出一个测试的简单例子&#xff0c;这里使用…

温度传感器安装热套管介绍

热套管&#xff08;Thermowell&#xff09;是一段末端封闭的金属管&#xff0c;主要通过焊接、螺纹或法兰连接的方式安装到过程容器或管线上&#xff0c;可保护温度传感器免受流致应力、高压和腐蚀性化学品等严苛工况的影响。此外&#xff0c;热套管使传感器可以轻松方便地拆下…

介绍图片懒加载的几种实现方法

在 JavaScript 中&#xff0c;懒加载&#xff08;Lazy Loading&#xff09;主要用于延迟加载资源&#xff0c;例如图片、视频、音频、脚本等&#xff0c;直到它们真正需要时才加载。这样可以提高页面的加载速度和性能。 以下是几种常见的 JavaScript 懒加载实现方式&#xff1…

【管理咨询宝藏116】某大型国有集团公司战略落地保障方案

本报告首发于公号“管理咨询宝藏”&#xff0c;如需阅读完整版报告内容&#xff0c;请查阅公号“管理咨询宝藏”。 【管理咨询宝藏116】某大型国有集团公司战略落地保障方案 【格式】PDF版本 【关键词】战略落地、大型国企、战略报告 【核心观点】 - 资产规模以提高资产质量、…

第三部分:领域驱动设计之通过重构得到更深层的理解

通过重构得到更深层的理解 通过重构得到更深层的理解是一个涉及很多方面的过程。有三件事情是必须要关注的: 以领域为本;用一种不同的方式来看待事物;始终坚持与领域专家对话。 开始重构 获得深层理解的重构可能出现在很多方面。一开始有可能是为了解决代码中的问题——一段…

Linux的线程状态

在Linux中,每个进程都有一个当前的状态,这个状态用于标识进程当前正在做什么。你可以通过ps命令配合不同的选项来查看进程的状态。以下是常见的进程状态及其含义: R (running or runnable): 进程正在运行或在运行队列中等待运行。这并不是说进程正在CPU上执行,而是说它处于…

项目十三:搜狗——python爬虫实战案例

根据文章项目十二&#xff1a;简单的python基础爬虫训练-CSDN博客的简单应用&#xff0c;这一次来升级我们的技术&#xff0c;那么继续往下看&#xff0c;希望对技术有好运。 还是老样子&#xff0c;按流程走&#xff0c;一条龙服务&#xff0c;嘿嘿。 第一步&#xff1a;导入…

华为诺亚等发布MagicDrive3D:自动驾驶街景中任意视图渲染的可控3D生成

文章链接&#xff1a;https://arxiv.org/pdf/2405.14475 项目链接&#xff1a;https://flymin.github.io/magicdrive3d 虽然可控生成模型在图像和视频方面取得了显著成功&#xff0c;但在自动驾驶等无限场景中&#xff0c;高质量的3D场景生成模型仍然发展不足&#xff0c;主…

Neo4J中构建的知识图谱,如何使用推理算法

在Neo4j中构建的知识图谱中&#xff0c;推理算法的使用可以极大地增强数据分析和洞察能力。Neo4j提供了多种推理和查询工具&#xff0c;主要通过Cypher查询语言和内置的图算法库来实现。以下是几种常见的推理算法和使用场景&#xff1a; 1. 规则推理&#xff08;Rule-based Re…

2951. 找出峰值 Easy

给你一个下标从 0 开始的数组 mountain 。你的任务是找出数组 mountain 中的所有 峰值。 以数组形式返回给定数组中 峰值 的下标&#xff0c;顺序不限 。 注意&#xff1a; 峰值 是指一个严格大于其相邻元素的元素。 数组的第一个和最后一个元素 不 是峰值。 示例 1&#xf…

关于宏的理解

关于宏的理解&#xff0c; 用宏函数举例 宏会把我们的内容编程一段代码&#xff0c;但是我们宏用的一切都不是变量&#xff0c;就是一个构建代码的符号。 比如下面的例子 char str1[] "1234"; const char* str2 "1234"; char st3[5] { 1,2,3,4,\0 };…

Linux网络编程:应用层协议|HTTP

前言&#xff1a; 我们知道OSI模型上层分为应用层、会话层和表示层&#xff0c;我们接下来要讲的是主流的应用层协议HTTP&#xff0c;为什么需要这个协议呢&#xff0c;因为在应用层由于操作系统的不同、开发人员使用的语言类型不同&#xff0c;当我们在传输结构化数据时&…

【全开源】宇鹿家政系统(FastAdmin+ThinkPHP+原生微信小程序)

&#xff1a;助力家政行业数字化升级 一、引言&#xff1a;家政服务的新篇章 随着移动互联网的普及和人们生活水平的提高&#xff0c;家政服务的需求日益增长。为了满足这一市场需求&#xff0c;并推动家政行业的数字化升级&#xff0c;我们特别推出了家政小程序系统源码。这…