JavaScript 指针

在像 C++ 这样的编程语言中,我们经常初始化指针以获取内容位置。但是在 JavaScript 的情况下,我们没有直接指向地址的约定。

在 JavaScript 中,我们有两种数据类型,一种是原始数据类型,另一种是复合数据类型。

通常,原始数据类型遵循以维护按值传递。复合数据类型允许按引用传递;这就是浅拷贝的工作原理。

对象的浅拷贝获取目标对象的引用,所做的任何修改都会影响原始对象和副本。

在这里,我们将看到按值传递按引用传递的工作原理。我们还将尝试制作复合对象的深拷贝

具体来说,我们将使用 lodashJSON.parse 和 JSON.stringifyslice()Object.assign() 功能介绍 spread operator

在 JavaScript 中传递原始对象的值

在处理原始对象时,会维护目标对象的一般副本。并且在这个驱动器中,即使对副本进行任何修改,原始对象也不会受到影响。

这个过程以 pass by value 命名,默认执行 deep copy

var x = 7;
var y = x;
x = 42;
console.log(x);
console.log(y);

输出:

JavaScript 指针

对象 y 的修改不会影响 x 对象。

JavaScript 中复合对象的引用传递

在复合对象的情况下,引用作为副本传递。因此,对复制对象所做的任何修改都会影响原始对象。

这种方法也称为浅拷贝按引用传递

var x = {num: 42};
var y = x;
y.num = 7;
console.log(x.num);
console.log(y.num);

输出:

JavaScript 指针

在这里,我们有一个对象 y,它获取 x 的副本。但内部图片仅使用对象 x 引用。

因此,当我们更改副本中的内容时,效果将在原始对象上,因为这里的两个对象都指向同一个引用。

为了解决这种浅拷贝的情况,我们有一些命题和工作,不管对象类型(数组或对象)或需要单独注意。

例如,spread operator 适用于数组和对象中的 deep copy。让我们按照以下部分进行清晰的查看。

在 JavaScript 中使用 Spread Operator 进行深度复制

传播运算符是将一个对象传播到另一个对象的约定。这种复制方法是准确的,任何修改都会使对象保持完整或应该被更改。

同样,展开运算符适用于数组和对象。让我们检查以下实例。

var x = [1, 2, 3];
var y = [...x];
y[2] = 5;
console.log(x[2]);
console.log(y[2]);

输出:

JavaScript 指针

对嵌套对象使用扩展运算符会很乏味,因为你必须访问每个级别的。在这种情况下,更简单的解决方案是使用即将推出的方法。

使用 JSON.parse() 和 JSON.stringify() 进行对象的深层复制

每当我们使用一个对象时,我们都会访问触发 keys 的内容。JSON.parse(JSON.stringify(Object)) 使艰苦的工作变得更好。

它对目标对象进行深拷贝,我们还可以修改内容。

var json = {num:{ val: 7}};
var collect = JSON.parse(JSON.stringify(json));
collect.num.val = 42;
console.log(json.num.val);
console.log(collect.num.val);

输出:

JavaScript 指针

在 JavaScript 中使用 Object.assign() 进行对象的深层复制

Object.assign() 方法制作原始对象的准确副本。

以这种方式解决问题,我们需要 2 个参数;一个是一对空白花括号 {},后跟目标对象。让我们检查实例以获得更好的理解。

var x = {'food': 'cheese',
        'sport': 'badminton'};
var y = Object.assign({}, x);
y.food = 'chocolate';
console.log(x.food);
console.log(y.food);

输出:

JavaScript 指针

在 JavaScript 中使用 Object.slice(0) 进行数组的深度复制

没有任何参数或零的方法 slice() 启动可以进行深层复制。这是处理数组的熟悉且最常用的方法之一。

除此之外,你还可以使用 map 复制数组。检查此文档以进行进一步查询。

这些示例将更具说明性。

var x = [1, 3, 4];
var y = x.slice(0);
y[2] = 5;
console.log(x);
console.log(y);

输出:

JavaScript 指针

在 JavaScript 中使用 lodash 进行深度克隆

要使用此解决方案,你需要加载 lodash 4.x 库。我们已经检查了 jsbin 编辑器中的示例。

在这里,你将在库部分找到 lodash 4.x

var x = [1,2,3];
var y = _.cloneDeep(x);
y[1] = 4;
console.log(y[1]);
console.log(x[1]);

输出:

JavaScript 指针