说说JavaScript 深浅拷贝?

JavaScript中的深拷贝和浅拷贝主要涉及到对象和数组的复制。浅拷贝和深拷贝的主要区别在于如何处理对象中的引用类型。<h4>浅拷贝（Shallow Copy）</h4>浅拷贝只复制对象的第一层属性，如果对象的属性值还是对象，那么复制的对象和原对象中的这个属性值仍然会是对同一个对象的引用。也就是说，如果修改了其中一个对象的这个属性，另一个对象的这个属性也会随之改变。在JavaScript中，可以通过以下方式实现浅拷贝：<ul><li>使用Object.assign()方法</li></ul><pre><code class="language-javascript">let obj1 = { a: 1, b: { c: 2 } };
let obj2 = Object.assign({}, obj1);
console.log(obj2); // { a: 1, b: { c: 2 } }</code></pre><ul><li>使用数组的slice()或concat()方法</li></ul><pre><code class="language-javascript">let arr1 = [1, 2, [3, 4]];
let arr2 = arr1.slice();
console.log(arr2); // [1, 2, [3, 4]]</code></pre><ul><li>使用扩展运算符（...）</li></ul><pre><code class="language-javascript">let obj1 = { a: 1, b: { c: 2 } };
let obj2 = { ...obj1 };
console.log(obj2); // { a: 1, b: { c: 2 } }</code></pre><h4>深拷贝（Deep Copy）</h4>深拷贝会复制对象的所有层级，即使对象的属性值还是对象，复制的对象和原对象中的这个属性值也不会是对同一个对象的引用。也就是说，如果修改了其中一个对象的属性，另一个对象的这个属性不会改变。在JavaScript中，深拷贝可以通过以下方式实现：<ul><li>使用JSON.parse(JSON.stringify(object))</li></ul><pre><code class="language-javascript">let obj1 = { a: 1, b: { c: 2 } };
let obj2 = JSON.parse(JSON.stringify(obj1));
console.log(obj2); // { a: 1, b: { c: 2 } }</code></pre>需要注意的是，这种方式不能处理函数和undefined，而且如果对象中包含循环引用，会抛出错误。<ul><li>使用第三方库，如 lodash 的 _.cloneDeep() 方法</li></ul><pre><code class="language-javascript">const _ = require('lodash');
let obj1 = { a: 1, b: { c: 2 } };
let obj2 = _.cloneDeep(obj1);
console.log(obj2); // { a: 1, b: { c: 2 } }</code></pre>这两种方式都可以实现深拷贝，但是选择哪种方式取决于你的具体需求以及你的项目是否已经引入了相关的库。

DreamCoders/CoderGuide

内容风险标识

评论 (0)

DreamCoders/CoderGuide .gitee-modal { width: 500px !important; }

内容风险标识