浅拷贝方法整理

最新推荐文章于 2024-01-17 17:04:38 发布
最新推荐文章于 2024-01-17 17:04:38 发布
阅读量710 收藏 1
点赞数 1
分类专栏： JavaScript 文章标签： 浅拷贝 JS中浅拷贝
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/hohocj/article/details/103181241
版权 
​浅拷贝，就是基本类型进行传值操作，而引用类型则是传地址操作。基本类型进行浅拷贝之后互不影响，大路朝天，各走一边。引用类型进行浅拷贝之后则是牵一发而动全身，一改则全都改动

浅拷贝用的还算是比较多吧，所以整理一下浅拷贝的方法
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<script type="text/javascript">
/*
第一  =运算符  复制该对象的引用，而不是对于对象内部的复制（这个貌似不算是）
第二  利用for...in  遍历自身和继承的可枚举属性，除Symbol外===》特别注意会涉及到继承的属性
第三  利用for...of配合Object.entries  只复制可枚举的，不包含symbol和不可枚举以及继承的属性
第四  利用for...of配合Object.keys  只复制可枚举的，不包含symbol和不可枚举以及继承的属性
第五  利用for...of配合Object.getOwnPropertyNames  复制可枚举和不可枚举属性，但不包含symbol和继承的属性
第六  利用for...of配合Reflect.ownKeys  复制全部属性，包含不可枚举和symbol，但不包含继承的属性
第七  Object.assign()  复制可枚举属性和symbol，不包含继承的属性和不可枚举的属性
第八  解构赋值（...运算符） 复制可枚举属性和symbol，不包含继承的属性和不可枚举的属性
第九  Object.getOwnPropertyDescriptors方法配合Object.defineProperties
      复制可枚举和不可枚举属性以及symbol，但不包含继承的属性
第十  Object.create方法配合Object.getOwnPropertyDescriptors
      复制可枚举和不可枚举属性以及symbol，但不包含继承的属性
*/
​
​
//下面是测试
​
// //第一种  =运算符
// let peo={
//   qwer:"cc"
// }
// let obj={
//   __proto__:peo,
//   a:1,
//   stu:{
//     b:1
//   }
// }
// Object.defineProperty(obj,"three",{
//    enumerable:false,
//    value:"3",
//    writable:true,
//    configurable:true
// })
​
// //浅拷贝
// let no2=obj;
// console.log(no2);
// /*
// {a: 1, stu: {…}, three: "3"}
// a: 2
// stu: {b: 2}
// three: "3"
// __proto__: Object
// */
​
// //改动
// obj.a=2;
// obj.stu.b=2;
​
// //测试
// console.log(no2.a+"==="+obj.a);//2===2
// console.log(no2.stu.b+"==="+obj.stu.b);//2===2
​
//================================================================
​
//第二种  遍历方式
​
// let peo={
//    qwer:"cc"
// }
// let obj={
//    __proto__:peo,
//    first:"1",
//    stu:{
//      two:"2"
//    }
// }
// Object.defineProperty(obj,"three",{
//    enumerable:false,
//    value:"3",
//    writable:true,
//    configurable:true
// })
// let new_obj={};
​
//利用for...in
//(遍历自身和继承的可枚举属性，除Symbol外)===》特别注意会涉及到继承的属性
​
// for(let key in obj){
//   new_obj[key]=obj[key];
// }
// console.log(new_obj);
// /*
// {first: "1", stu: {…}, qwer: "cc"}
// first: "1"
// qwer: "cc"
// stu: {two: "2"}
// __proto__: Object
// */
​
// //改动
// obj.first="a";
// obj.stu.two="b";
// obj.qwer="c";
// new_obj.qwer="d";
​
// //测试
// console.log(new_obj.first+"==="+obj.first);//1===a
// console.log(new_obj.stu.two+"==="+obj.stu.two);//b===b
// console.log(new_obj.qwer+"==="+peo.qwer+"==="+obj.qwer);//d===cc===c
​
//============================================================================
​
//利用for...of配合Object.entries
//Object.entries() 方法会返回由自身可枚举属性(不包含继承的)的键值对数组
// for (let [key,value] of Object.entries(obj)) {
//   new_obj[key]=value;
// }
// console.log(new_obj);
/*
{first: "1", stu: {…}}
first: "1"
stu: {two: "2"}
__proto__: Object
*/
​
// //改动
// obj.first="a";
// obj.stu.two="b";
​
// //测试
// console.log(new_obj.first+"==="+obj.first);//1===a
// console.log(new_obj.stu.two+"==="+obj.stu.two);//b===b
​
//================================================================
​
//利用for...of配合Object.keys
//Object.keys() 方法会返回一个由一个给定对象的自身可枚举属性组成的数组
// for (let key of Object.keys(obj)) {
//   new_obj[key]=obj[key];
// }
// console.log(new_obj);
// /*
// {first: "1", stu: {…}}
// first: "1"
// stu: {two: "b"}
// __proto__: Object
// */
// //改动
// obj.first="a";
// obj.stu.two="b";
​
// //测试
// console.log(new_obj.first+"==="+obj.first);//1===a
// console.log(new_obj.stu.two+"==="+obj.stu.two);//b===b
​
//================================================================
​
//利用for...of配合Object.getOwnPropertyNames
//Object.getOwnPropertyNames()方法返回一个由指定对象的所有自身属性的属性名
//（包括不可枚举属性但不包括Symbol值作为名称的属性）组成的数组
// for (let key of Object.getOwnPropertyNames(obj)) {
//   new_obj[key]=obj[key];
// }
//  console.log(new_obj);
// /*
// {first: "1", stu: {…}, three: "3"}
// first: "1"
// stu: {two: "2"}
// three: "3"
// __proto__: Object
// */
// //改动
// obj.first="a";
// obj.stu.two="b";
// obj.three="c";
​
// //测试
// console.log(new_obj.three+"==="+obj.three);//3===c
// console.log(new_obj.first+"==="+obj.first);//1===a
// console.log(new_obj.stu.two+"==="+obj.stu.two);//b===b
​
//================================================================
​
//利用for...of配合Reflect.ownKeys
//静态方法 Reflect.ownKeys() 返回一个由目标对象自身的属性键组成的数组
//包含可枚举和不可枚举的属性，甚至包含Symbol属性，但是不包含继承的属性
// for (let key of Reflect.ownKeys(obj)) {
//   new_obj[key]=obj[key]
// }
// console.log(new_obj);
// /*
// {first: "1", stu: {…}, three: "3"}
// first: "1"
// stu: {two: "2"}
// three: "3"
// __proto__: Object
// */
 
// //改动
// obj.first="a";
// obj.stu.two="b";
// obj.three="c";
​
// //测试
// console.log(new_obj.three+"==="+obj.three);//3===c
// console.log(new_obj.first+"==="+obj.first);//1===a
// console.log(new_obj.stu.two+"==="+obj.stu.two);//b===b
​
//================================================================
​
//第三种 Object.assign()
//Object.assign(target, ...sources) 
//用于将所有可枚举属性的值从一个或多个源对象复制到目标对象。它将返回目标对象
//如果目标源与源对象有同名属性，或多个源对象有同名属性，则后面的会覆盖前面的
//只复制源对象自身的可枚举属性和symbol，不包含继承的属性和不可枚举的属性
​
// let peo={
//    qwer:"cc"
//  }
// let sym=Symbol("sym");
// let obj={
//   __proto__:peo,
//   first:1,
//   stu:{
//     two:2
//   }
// }
// obj[sym]="sym";
​
// Object.defineProperty(obj,"three",{
//    enumerable:false,
//    value:"3",
//    writable:true,
//    configurable:true
//  })
​
// // 浅拷贝
// let new_obj=Object.assign({},obj);
// console.log(new_obj);
// /*
// {first: 1, stu: {…}, Symbol(sym): "sym"}
// first: 1
// stu: {two: "b"}
// Symbol(sym): "sym"
// __proto__: Object
// */
  
// //改动
// obj.first="a";
// obj.stu.two="b";
​
// //测试
// console.log(new_obj.first+"==="+obj.first);//1 === a
// console.log(new_obj.stu.two+"==="+obj.stu.two);//b === b
​
//《ES标准入门》中说这个assin有一个小缺陷==》无法复制属性的赋值方法和取值方法(setter和getter方法)
//但是，我试了下，可以复制
// let obj={
//   get first(){
//     return this._first_;
//   },
//   set first(value){
//     this._first_=value;
//   }
// }
// obj.first="1";
// let new_obj=Object.assign({},obj);
// console.log(new_obj);//{first: "1", _first_: "1"}
// console.log(Object.getOwnPropertyDescriptor(new_obj,"first"));
// //{value: "1", writable: true, enumerable: true, configurable: true}
​
//=======================================================================
​
// //第四种 解构赋值（...运算符）
// //只能复制自身的可枚举的属性和symbol，不包含自身继承的和不可枚举的属性
​
// let peo={
//    qwer:"cc"
//  }
// let sym=Symbol("sym");
// let obj={
//   __proto__:peo,
//   first:1,
//   stu:{
//     two:2
//   }
// }
// obj[sym]="sym";
​
// Object.defineProperty(obj,"three",{
//    enumerable:false,
//    value:"3",
//    writable:true,
//    configurable:true
//  })
// //浅拷贝
// let { ...new_obj } = obj;
// console.log(new_obj);
// /*
// {first: 1, stu: {…}, Symbol(sym): "sym"}
// first: 1
// stu: {two: "b"}
// Symbol(sym): "sym"
// __proto__: Object
// */
 
// //改动
// obj.first="a";
// obj.stu.two="b";
   
// //测试
// console.log(new_obj.first+"==="+obj.first);//1 === a
// console.log(new_obj.stu.two+"==="+obj.stu.two);//b === b
 
//================================================================
 
 //第五种 
 //Object.getOwnPropertyDescriptors方法配合Object.defineProperties
 //Object.getOwnPropertyDescriptors() 方法用来获取一个对象的所有自身属性的描述符
 //Object.defineProperties() 方法直接在一个对象上定义新的属性或修改现有属性，并返回该对象
 //只能复制自身的属性(包括不可枚举的属性以及symbol)，但不可复制继承的属性
//  let peo={
 //   qwer:"cc"
//  }
//  let sym=Symbol("sym");
//  let obj={
 //   __proto__:peo,
 //   first:"1",
 //   stu:{
  //    two:"2"
 //   }
//  }
//  obj[sym]="sym";
//  Object.defineProperty(obj,"three",{
 //   enumerable:false,
 //   value:"3",
 //   writable:true,
 //   configurable:true
//  })
//  // console.log(obj.qwer);//cc
 
//  //浅复制
//  let new_obj=Object.defineProperties({},Object.getOwnPropertyDescriptors(obj));
//  console.log(new_obj);
//  /*
//  {first: "1", stu: {…}, three: "3", Symbol(sym): "sym"}
//  first: "1"
//  stu: {two: "b"}
//  Symbol(sym): "sym"
//  three: "3"
//  __proto__: Object
//  */
​
// //改动
// obj.first="a";
// obj.stu.two="b";
// obj.three="c"
​
// //测试
// console.log(new_obj.three+"==="+obj.three);//3===c
// console.log(new_obj.first+"==="+obj.first);//1===a
// console.log(new_obj.stu.two+"==="+obj.stu.two);//b===b
​
//==========================================================================
​
//第六种 
//Object.create方法配合Object.getOwnPropertyDescriptors
//Object.getOwnPropertyDescriptors() 方法用来获取一个对象的所有自身属性的描述符
//Object.create(proto[, propertiesObject])
/*propertiesObject
可选。如果没有指定为 undefined，则是要添加到新创建对象的可枚举属性（即其自身定义的属性，
而不是其原型链上的枚举属性）对象的属性描述符以及相应的属性名称。这些属性对应
Object.defineProperties()的第二个参数*/
//只能复制自身的属性(包括不可枚举的属性以及symbol)，但不可复制继承的属性
// let peo={
//   qwer:"cc"
// }
// let sym=Symbol("sym");
// let obj={
//   __proto__:peo,
//   first:"1",
//   stu:{
//    two:"2"
//   }
// }
// obj[sym]="sym";
// Object.defineProperty(obj,"three",{
//   enumerable:false,
//   value:"3",
//   writable:true,
//   configurable:true
// })
​
// //浅复制
// let new_obj=Object.create({},Object.getOwnPropertyDescriptors(obj));
// console.log(new_obj);
//  /*
//  {first: "1", stu: {…}, three: "3", Symbol(sym): "sym"}
//  first: "1"
//  stu: {two: "b"}
//  Symbol(sym): "sym"
//  three: "3"
//  __proto__: Object
//  */
​
// //改动
// obj.first="a";
// obj.stu.two="b";
// obj.three="c"
​
// //测试
// console.log(new_obj.three+"==="+obj.three);//3===c
// console.log(new_obj.first+"==="+obj.first);//1===a
// console.log(new_obj.stu.two+"==="+obj.stu.two);//b===b
</script>
</body>
</html>
​

有问题欢迎交流，可以随时补充

觉得不错，可以点个赞，谢谢啦

 

hohocj
关注
  • 1
    点赞
  • 踩
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
文件拷贝（6种方式）
l9528的博客
09-24 6994
文件拷贝（6种方式） 大家好，最近我总结了一些文件拷贝的方法，今天我和大家分享一下这些方法。 我们要注意一点：我们只能对标准文件进行拷贝，不能对目录进行拷贝。 第一种：用InputStream和OutputStream对文件进行拷贝（用InputStream和OutputStream可以对任意的标准文件进行拷贝） try ( //需要读取的原始文件输入流 InputStream inputStream = new FileInputStream("C:\\Users\\HP\\...
彻底理解克隆、深拷贝和浅拷贝（俩种方法）
编程爱好者
09-01 5480
之前在学Javase时没注意到克隆这个方法，后面再网上看博客和面试题是经常看到克隆、深拷贝和浅拷贝这些词语，刚开始看被吓一跳，以为有多复杂，今天下决心给他搞明白，突然发现原来这么简单，给以后的自己一个警醒，往往认为难的其实也没什么，一定要克服心理关。 首先理解克隆： 我们正常复制一个引用类型的数据时，会直接用赋值符号进行赋值，而这种赋值方法其实俩者共用的还是同一个对象，通过其中一个来改变对象中...
浅拷贝的五种实现方式
橘导的博客
10-03 1万+
浅拷贝的五种实现方式 浅拷贝与深拷贝是一道经久不衰的面试题，今日先总结一下有哪些浅拷贝的方式，以及各自的优缺点 首先，看一下什么是浅拷贝 自己创建一个新的对象，来接受你要重新复制或引用的对象值。如果对象属性是基本的数据类型，复制的就是基本类型的值给新对象；但如果属性是引用数据类型，复制的就是内存中的地址，如果其中一个对象改变了这个内存中的地址，肯定会影响到另一个对象。 Object.assign Object.assign 是 Object 的一个方法，该方法可以用于 JS 对象的合并等多个用
深浅拷贝几种常用的方法
Summer_Uncle的博客
01-17 515
浅拷贝是创建一个新对象，然后将原对象的属性值复制给新对象。如果属性值是引用类型（例如数组、对象、函数等），则复制的是引用，即新对象和原对象将引用同一块内存。因此，修改新对象的属性值可能会影响原对象。它将原始数组与传入的参数数组连接起来，按照参数数组的顺序排列。Object调用assign静态方法后,将第二个参数传入的对象复制到第一个参数,也就是新的对象.同时静态方法调用后返回的也是复制产生的新对象。深拷贝和浅拷贝是对象拷贝操作中的两个概念。
深浅拷贝的几种方法
qq_41893686的博客
03-04 582
深拷贝 方法一：递归 let user={ name:"咳咳", person:{ age:12 }, data:[] } function copy(object) { let obj = object instanceof Array ? [] : {}; for (const [k, v] of Object.entries(object)) { d
IOS 中runtime使用方法整理
08-30
需要注意的是，`object_copy()`函数用于浅复制，如果对象包含引用其他对象，这些引用不会被复制，而是共享同一内存地址。 2. **给类添加方法**： `class_addMethod()`函数可以动态地给类添加新的方法。在例子中，...
Python_列表深浅拷贝_详解配图_面试经常出现
01-20
 三、浅拷贝  四、深拷贝 编写整理不容易，看官点个赞，收藏，关注必回QAQ 一、准备知识 返回文章顶部 在 Python 中的数据类型包括 ：int、float、str、dict、lsit、set、tuple、bool等等，将其简单分类 ...
js代码-js方法整理
07-14
- `slice()`：返回数组的一部分浅拷贝。 - `splice()`：添加或删除数组中的元素。 - `concat()`：合并两个或多个数组。 - `indexOf()`和`lastIndexOf()`：查找指定元素的位置。 2. **字符串方法**： - `length...
Java中的clone方法详解_动力节点Java学院整理
08-30
浅拷贝只是复制对象的引用，而不是真正的克隆对象的内容，而深拷贝则是真正的克隆对象的内容。 浅拷贝的示例代码如下： ```java Person p = new Person(23, "zhang"); Person p1 = p; System.out.println(p); ...
浅谈计算机审计数据采集与分析整理.doc
06-11
4. 直接复制可利用的数据文件，如从用友财务软件的数据库中拷贝出数据文件。 5. 通过ODBC（开放数据库连接）通用数据转出工具，适用于各种数据库系统。 在确定要获取的数据格式和大小时，审计人员应根据所选审计...
JavaScript中的浅拷贝与深拷贝（手写浅拷贝和深拷贝）
XinKun的博客
05-19 811
一、简介 数据分为基本数据类型和引用数据类型。 基本数据类型： String、Number、Boolean、Null、Undefined、Symbol。基本数据类型是直接存储在栈中的数据。 引用数据类型： Array、Object。引用数据类型存储的是该对象在栈中引用，真实的数据存储在内存中。 由于基本数据类型是直接存储的，所以如果我们对基本数据类型进行拷贝，然后修改新数据后，不会影响到原数据。 而当你对引用数据类型进行拷贝，然后修改新数据后，它就会影响到原数据。 二、浅拷贝、深拷贝与赋值的区别 赋值
如何实现一个深浅拷贝
从人到猿
10-19 3793
把深浅拷贝单独作为一讲来专门讲解，是因为在 JavaScript 的编程中经常需要对数据进行复制，什么时候用深拷贝、什么时候用浅拷贝，是开发过程中需要思考的；同时深浅拷贝也是前端面试中比较高频的题目。 因此，深入学习这部分知识有助于提高手写 JS 的能力，以及对一些边界特殊情况的深入思考能力，这一讲会结合最基础但是又容易写不好的的题目来帮助提升。
浅拷贝、深拷贝
Addisoni
10-31 4万+
深拷贝和浅拷贝 　　这两个概念是在项目中比较常见的，在很多时候，都会遇到拷贝的问题，我们总是需要将一个对象赋值到另一个对象上，但可能会在改变新赋值对象的时候，忽略掉我是否之后还需要用到原来的对象，那么就会出现当改变新赋值对象的某一个属性时，也同时改变了原对象，此时我们就需要用到拷贝这个概念了。 深拷贝和浅拷贝的区别 1.浅拷贝： 将原对象或原数组的引用直接赋...
深拷贝-浅拷贝-引用赋值的写法
m0_51636525的博客
08-27 340
这个obj4完全是一个新的对象，修改对象的内容，info的对象内容也不会跟着改变。，拷贝了一个新的对象obj2，修改里面的name，info不会跟着改变。对象的浅拷贝：只是浅层的拷贝，内部引入对象时，依然会相互影响；但是使用JSON方法有很大的缺陷就是当info里面有其他的值时。，将后面的info拷贝到前面的{}对象中，并且返回给obj3。如果有一个对象info，想要拷贝里面的内容，有三种方式。对象的深拷贝：两个对象不再有任何关系，不会相互影响；如果改的是对象，info的对象也会跟着发生变化。.......
ES6 新增的方法 深拷贝和钱拷贝
starry__sty的博客
12-16 408
ES6新增方法 indexOf :检测数组或字符串中是否包含某个值,如果包含返回第一次查找到那个值所对应的下标,如果 查不到返回-1 Array.from(伪数组): 伪数组转换成数组 find(回调函数) :根据查找指定值,符合条件的,会返回出来这个值,返回第一值之后就会停止查找 filter(回调函数): 会把所有符合条件的值放到一个数组中返回出来 map(回调函数) 映射 把数组里面的每一个元素按照你传入到毁掉函数里面的代码都执行一遍 every(回调函数) 必
【JS】深拷贝与浅拷贝的区别，实现深拷贝的几种方法
weixin_30289831的博客
11-24 9427
如何区分深拷贝与浅拷贝，简单点来说，就是假设B复制了A，当修改A时，看B是否会发生变化，如果B也跟着变了，说明这是浅拷贝，拿人手短，如果B没变，那就是深拷贝，自食其力。 此篇文章中也会简单阐述到栈堆，基本数据类型与引用数据类型，因为这些概念能更好的让你理解深拷贝与浅拷贝。 我们来举个浅拷贝例子： let a=[0,1,2,3,4], b=a; console.log(a===...
详解Java中的clone方法 -- 原型模式
热门推荐
昨夜星辰的博客
01-19 17万+
Java中对象的创建 clone顾名思义就是复制， 在Java语言中， clone方法被对象调用，所以会复制对象。所谓的复制对象，首先要分配一个和源对象同样大小的空间，在这个空间中创建一个新的对象。那么在java语言中，有几种方式可以创建对象呢？ 1 使用new操作符创建一个对象 2 使用clone方法复制一个对象 那么这两种方式有什么相同和不同呢？ new操作符的本意是分
浅拷贝以及四种深拷贝的方法
Gaoshanyz的博客
10-21 863
浅拷贝：仅仅是指针给了另一个对象 深拷贝 两个对象之间没有任何关系 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> </head>
js的深拷贝和浅拷贝常用方法
dusehngcsdn的博客
02-14 499
** 一 浅拷贝 ** (1) Object.assign() var obj1 = {a: 1, b: 2} var obj2 = Object.assign({}, obj1) obj2.a = 4 console.log(obj1, obj2) // {a: 1, b: 2}, // {a: 4, b: 2} (2) 解构赋值 var obj1 = {a: 1, b: 2} ...
对象深拷贝+数组深拷贝几种方式整理
最新发布
06-07
1. **浅拷贝（Shallow Copy）**： 对于简单类型（如基本数据类型）或值类型，拷贝的是它们的值。对于复杂类型如数组或对象，浅拷贝实际上是创建了一个引用，两个变量指向的是同一个内存地址。这意味着对其中一个的...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值