React useState中数组全等判断为何不符合预期？

问题原因 #

在JavaScript中，数组属于引用类型，===（严格相等运算符）比较的是两个对象的内存引用地址，而非内容是否一致。你代码里的array === [1,2,3]，左边是useState初始化的数组对象，右边是组件每次渲染时新创建的数组对象——这两个对象在内存中是完全独立的，引用地址不同，所以===会返回false，导致输出不符合预期。

解决方案 #

根据你的使用场景，可选择以下几种方法：

1. 字符串序列化比较（适合简单数组）

将数组转为字符串后比较，适用于元素为基本类型（数字、字符串等）且无特殊值（如undefined、函数）的数组：

if (JSON.stringify(array) === JSON.stringify([1, 2, 3])) {
  console.log("Yes");
}

2. 手动遍历比较（通用可靠）

编写工具函数逐个比较数组元素，适用于大多数场景：

function arraysAreEqual(arr1, arr2) {
  if (arr1.length !== arr2.length) return false;
  for (let i = 0; i < arr1.length; i++) {
    if (arr1[i] !== arr2[i]) return false;
  }
  return true;
}

// 调用判断
if (arraysAreEqual(array, [1, 2, 3])) {
  console.log("Yes");
}

3. 复用数组引用（适合固定目标数组）

如果目标数组是固定不变的，可将其定义为组件外的常量，这样useState初始化的数组和判断用的数组会指向同一个内存地址，直接用===即可比较：

import React, { useState } from "react";
import { View } from "react-native";

const FIXED_ARRAY = [1, 2, 3];

function Test(props) {
  const [array, setArray] = useState(FIXED_ARRAY);

  if (array === FIXED_ARRAY) {
    console.log("Yes");
  } else {
    console.log("No, array is something else");
  }

  return <View></View>;
}

export default Test;

内容的提问来源于stack exchange，提问作者sahasrabhuja neuron