问题描述
我已经声明了以下对象:
const restaurant = {
openingHours: {
thu: {
open: 12,close: 22,},fri: {
open: 11,close: 23,saturday: {
open: 0,// Open 24 hours
close: 24,}
};
然后我将openingHours对象破坏成一个新的变量名friday:
const { fri: friday } = restaurant.openingHours;
friday.open = 5;
最后我检查了更改是否影响原始餐厅财产:
console.log(restaurant.openingHours.fri.open,friday.open); // prints 5 5
我不明白为什么它会将 restaurant.openingHours.fri.open 的值更改为 5?
let originalAge =5;
let newAge = originalAge;
newAge =6;
console.log(originalAge) // will print 5,So what is the difference here?
解决方法
因为“friday”是一个对象并作为引用传递,而 originalAge 是一个原始值(数字/字符串/布尔值...)。
你可以试试这个:
const { fri } = restaurant.openingHours;
const friday = { ...fri };
这将创建一个星期五的浅拷贝(如果所有第一级值都是基元,则将创建一个真正的副本)
,您已经通过解构运算符提取了对内部对象 fir
的引用。
它仍然指向 openingHours
要解除绑定,您可以使用以下代码段:
const friday = Object.assign({},restaurant.openingHours.fri);
https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/assign - 阅读有关分配方法的更多信息。
,以下解构语法:
const { fri: friday } = restaurant.openingHours;
...脱糖:
const friday = restaurant.openingHours.fri;
以上都将变量 friday
设置为对对象的引用:
{
open: 11,close: 23,}
由于上述对象在您的 restaurant.openingHours.fri
对象中也是相同的引用,因此 friday
和 restaurant.openingHours.fri
都将引用内存中的相同对象。因此,当您这样做时:
friday.open = 5;
您正在更改内存中的一个对象,friday
和 restaurant.openingHours.fri
都指向该对象。
但是,在您的示例中,您使用的是按值复制的原语(即:5)。所以它们不会在你的记忆中共享(所以改变一个不会改变另一个)。
您可以通过更新解构语法以使用 rest syntax 来复制 .fri
对象的一种方法:
const { fri: {...friday} } = restaurant.openingHours;
const restaurant = {
openingHours: {
thu: {
open: 12,close: 22,},fri: {
open: 11,saturday: {
open: 0,// Open 24 hours
close: 24,}
};
const { fri: {...friday} } = restaurant.openingHours;
friday.open = 5;
console.log(friday,restaurant.openingHours.fri);