Js object change

let appState = {
    title: {
        text: "React.js ",
        color: "red",
    },
    content: {
        text: "React.js ",
        color: "blue"
    }
}
const oldState = appState
console.log(appState)
appState.title.text = "React.js ";
console.log(oldState !== appState) //false
console.log(oldState != appState) //false

updated the contents of the object, the comparison of the two objects is still the same, such as the printed result, I do not know how to understand?

Javascript
Jan.25,2022

const oldState = appState;
when assigning a value to a variable, the parser must determine whether the value is primitive type value or reference type .
is accessed by value for basic types, that is, it is assigned and passed by copying with the value.
reference types are accessed by reference, that is, values are assigned and passed through reference replication. When you manipulate an object, you actually manipulate a reference to the object in , not the actual object.
so when you change appState, oldState also changes. The comparison of
objects is different from the primitive type value. Even if two objects are exactly the same, such as two identical arrays, they are not equal. Two variables are equal only if they point to the same object.

difference between shallow and deep copies
const oldState = {.appstate}
console.log (appState)
appState.title.text ='"React.js Book";
console.log (oldState! = = appState) / / false
console.log (oldState! = appState) / / false

is not really a comparison of two objects, but a comparison of references
ECMAScirpt has five basic types (number,string,boolean,null,undefined) and one reference type (object)
if you 

var obj1 = {},obj2 = {};  obj1 == obj2 false
 var n = 1, m = n; n PP ; n2m1

basic type assignment creates a new value on the variable, m is a copy of n
. When a variable assigns a value of a reference type to another variable, unlike the basic type, this worthy copy is a pointer to an object stored in heap memory, and both oldState and appState point to the same memory address
reference type takes up more space. So the
is often misused as a copy with a pointer and a variable, but after this "copy", the original value will be affected, so the shallow copy traverses with for in, and the deep copy for in + recursive copy deep

.

this is a problem of reference type and basic type. If you want the result to be different, it is recommended to write a deep copy

. 
//p
//cc[],c{}{}
function deepCopy(p,c){
var c = c || {};
for(var i in p){
if(typeof p[i] === "object"){
c[i] = (p[i].constructor === Array)?[]:{};
deepCopy(p[i],c[i])
}else{
c[i] = p[i]
 }
}
return c;
}

Previous: How to remove the bootstrap table plus sign

Next: Vue-cli 3.x how to delete console.log information in a production environment

css mysql arrays josn react html typescript webpack npm sass R objective-c .net sql-server jquery python-3.x angularjs django angular excel regex iphone ajax linux xml pandas vba spring database wordpress string wpf xcode windows bash postgresql oracle multithreading eclipse list firebase algorithm macos forms image scala visual-studio azure bootstrap spring-boot react-native python-2.7 docker performance function winforms matlab powershell apache dataframe api sqlite numpy rest shell selenium flutter dart maven loops qt swing android-studio csv express file class tensorflow sorting codeigniter perl
MySQL Query : SELECT * FROM `codeshelper`.`v9_news` WHERE status=99 AND catid='6' ORDER BY rand() LIMIT 5
MySQL Error : Disk full (/tmp/#sql-temptable-64f5-1eb6377-25b5.MAI); waiting for someone to free some space... (errno: 28 "No space left on device")
MySQL Errno : 1021
Message : Disk full (/tmp/#sql-temptable-64f5-1eb6377-25b5.MAI); waiting for someone to free some space... (errno: 28 "No space left on device")
Need Help?