JavaScript 原始值与引用值

当前位置:

JavaScript 中有两种类型的值：原始值和引用值。

原始值是不可变的，如Undefined、Null、Boolean、Number、String和Symbol。当将一个原始值赋值给另一个变量时，实际上是将该值的一个副本赋值给变量。

引用值是可变的，如对象和数组。当将一个引用值赋值给另一个变量时，实际上是将该值的内存地址赋值给变量，因此两个变量会指向同一个值。

对于原始值来说，如果将其赋值给另一个变量，改变该变量的值不会影响到其他变量。例如：

let a = 5;
let b = a;
b = 10;
console.log(a); // 5
console.log(b); // 10

对于引用值来说，如果将其赋值给另一个变量，改变该变量的值会影响到其他变量。例如：

let a = [1, 2, 3];
let b = a;
b.push(4);
console.log(a); // [1, 2, 3, 4]
console.log(b); // [1, 2, 3, 4]

如果需要深拷贝一个引用值，可以使用 JavaScript 的深拷贝函数，例如 JSON.parse(JSON.stringify(obj))

另外还需要注意，如果是改变对象属性的值时，还是会相互影响的

let a = {num:1}
let b = a
b.num = 2
console.log(a.num) // 2
console.log(b.num) // 2

对于对象属性的修改，如果想要避免相互影响，可以使用浅拷贝的方式来赋值，即使用 Object.assign() 或者扩展运算符（...）来赋值。例如：

let a = {num:1};
let b = Object.assign({}, a); // 或者 let b = {...a};
b.num = 2;
console.log(a.num); // 1
console.log(b.num); // 2

这样就可以避免相互影响了。

如果对象属性中还有对象，使用浅拷贝只能复制一层属性，如果要深拷贝可以使用深拷贝库，如 lodash 的 _.cloneDeep() 函数。

如果是原始类型的数据，在比较的时候是基于值的比较，而对于引用类型的数据，是基于地址的比较。

例如：

let a = 5;
let b = 5;
console.log(a === b); // true

let c = [1, 2, 3];
let d = [1, 2, 3];
console.log(c === d); // false

如果需要比较两个对象是否相等，可以使用 lodash 的 _.isEqual() 函数来进行比较。

还有另外一种方法就是使用 JSON.stringify() 将两个对象转化成字符串，再比较字符串是否相等，但是需要注意的是如果对象中有函数或者循环引用的情况时会抛出错误。

总结一下，在JavaScript中，原始值和引用值是有区别的，在赋值、修改、比较时需要注意。

栏目列表