在JavaScript中,相同的两个对象可能我们却不能这样比较它们来判断它们是否相等。使用双等号(==)或三等号(===)比较两个对象时常常会得到错误的结果。为了正确地比较两个对象,我们需要使用严格相等操作符(strict equality operator)进行比较。严格相等操作符不会将对象转化为原始类型,而是比较对象的引用地址。举个例子:
let obj1 = { name: 'John' };
let obj2 = { name: 'John' };
let obj3 = obj1;
console.log(obj1 == obj2); //false
console.log(obj1 === obj2); //false
console.log(obj1 === obj3); //true
在上面的例子中,obj1和obj2是两个不同的对象,尽管它们的属性相同。因此,使用==或===比较它们会得到false。obj1和obj3是同一个对象,因此使用===比较它们会得到true。
避免比较对象可以使用函数,比如在React中的useEffect()的回调中,我们可能会想要比较当前props和上一个props是否有变化。为了避免比较对象,我们可以使用useRef():
import { useRef, useEffect } from 'react';
function Example(props) {
const prevProps = useRef();
useEffect(() => {
if (prevProps.current) {
console.log('Props changed:', props);
}
prevProps.current = props;
});
return (
Name: {props.name}
Age: {props.age}
);
}
在上面的例子中,我们使用了useRef()来创建一个保存上一个props的引用地址的对象prevProps。在每次组件渲染后,我们可以通过比较prevProps.current和当前的props来检测props是否有变化,从而避免了比较对象。