WHAT - React useEffect 依赖的 Object.is

目录

  • 一、背景
  • 二、Object.is 的语法
  • 三、Object.is 的行为
  • 四、总结

一、背景

在 https://react.dev/reference/react/useEffect 中我们了解到:

React will compare each dependency with its previous value using the Object.is comparison.

接下来我们学习一下 Object.is 。Object.is 是 JavaScript 中的一个静态方法,用于比较两个值是否相同。它与 === 运算符的行为略有不同,尤其在处理特殊值(比如 NaN-0)时表现更为准确和可预测。

二、Object.is 的语法

Object.is(value1, value2)
  • value1:第一个要比较的值。
  • value2:第二个要比较的值。

三、Object.is 的行为

  1. 基本用法

    Object.is(1, 1);     // true
    Object.is(1, '1');   // false
    Object.is('foo', 'foo'); // true
    
    • Object.is 类似于严格相等运算符 ===,但是处理一些特殊情况时有所不同。
  2. 处理特殊值

    Object.is(NaN, NaN);   // true
    Object.is(0, -0);      // false
    Object.is(-0, -0);     // true
    
    • NaN 是 JavaScript 中特殊的非数值(Not-a-Number)。
    • -00 被视为不同的值,尽管它们在一般的数值比较中是相等的。
  3. 与严格相等运算符 === 的区别

    NaN === NaN;   // false
    0 === -0;      // true
    -0 === -0;     // true
    
    • === 运算符在比较 NaN-0 时的结果与 Object.is 不同。
  4. 在 React 中的应用

    React 使用 Object.is 来进行依赖项比较。在函数组件的 useEffectuseMemo 钩子中,React 会比较依赖项的前一个值和当前值,以决定是否重新计算或执行相关的效果。

    useEffect(() => {// Effect code
    }, [dependency1, dependency2]);
    
    • 在上述例子中,React 将使用 Object.is 比较 dependency1dependency2 的前一个值和当前值。如果值不同(使用 Object.is 的定义),则重新运行 useEffect 中的代码。

四、总结

Object.is 是 JavaScript 中用于比较两个值是否严格相等的方法,它在处理特殊值(如 NaN-0)时与 === 运算符有所不同。在 React 中,React Hooks 如 useEffectuseMemo 使用 Object.is 来确定依赖项是否发生变化,从而决定是否重新执行相关的效果或计算。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/866603.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

MViT(ICCV 2021, Meta)论文解读

paper:Multiscale Vision Transformers official implementation:https://github.com/facebookresearch/SlowFast 背景和出发点 这篇文章提出了多尺度视觉Transformer(Multiscale Vision Transformers, MViT)的概念&#xff0c…

全网视频下载之IDM下载安装,软破解

全网视频下载之IDM下载安装,软破解 介绍![在这里插入图片描述](https://i-blog.csdnimg.cn/direct/c94f612f7a8845c8a649f74f6b18fd70.png)下载安装配置浏览器Google浏览器Ddge浏览器 界面如何下载不破解如何重复使用总结 介绍 今天给大家分享一个更加简便的全网视…

小型气象站在现代农业中的应用与前景

随着科技的飞速发展,智慧农业已成为现代农业发展的重要趋势。在这一背景下,小型气象站作为智慧农业的重要组成部分,正逐渐展现出其独特的价值和广阔的应用前景。本文将从小型气象站的定义、功能、应用案例以及未来展望等方面,探讨…

git reset HEAD^1

git reset HEAD^1 是一个 Git 命令,用于将当前分支的 HEAD 指针重置到当前提交的父提交。如果你想撤销最近的一次提交,并将更改放回工作目录,你可以使用这个命令。 这里的 HEAD^1 表示当前分支的父提交,如果你想撤销多个提交&…

VBA 解除工作表密码

工作表加密密码如果忘记可以使用如下方法进行破解 1. 破解工作簿中所有工作表密码 在标准模块中贴入下记代码并执行 Option ExplicitSub WsUnlock()Dim ws As WorksheetFor Each ws In Worksheetsws.Protect AllowFiltering:Truews.UnprotectNextEnd Sub 破解单个工作表密码…

【数据结构/C++】位图

这里写自定义目录标题 哈希思想的应用位图位图概念经典面试题位图所开的空间大小STL库中的 bitset 位图 位图实现大框架位运算符<<左移 和 >>右移 移动的方位set()&#xff1a;把x映射的位标记成1set() 接口实现reset&#xff1a;把x映射的位标记成0reset() 接口te…

四种封装 ThreadPoolExecutor 的线程池的使用以及直接使用 ThreadPoolExecutor ,优缺点分析

池化思想&#xff1a;线程池、字符串常量池、数据库连接池 提高资源的利用率 下面是手动创建线程和执行任务过程&#xff0c;可见挺麻烦的&#xff0c;而且线程利用率不高。 手动创建线程对象执行任务执行完毕&#xff0c;释放线程对象 线程池的优点&#xff1a; 提高线程的…

Static关键字的用法详解

Static关键字的用法详解 1、Static修饰内部类2、Static修饰方法3、Static修饰变量4、Static修饰代码块5、总结 &#x1f496;The Begin&#x1f496;点点关注&#xff0c;收藏不迷路&#x1f496; 在Java编程语言中&#xff0c;static是一个关键字&#xff0c;它可以用于多种上…

React+TS前台项目实战(二十三)-- 基于属性自定义数值显示组件Decimal封装

文章目录 前言Decimal组件1. 功能分析2. 代码详细注释3. 使用方式4. 效果展示 总结 前言 今天要封装的Decimal 组件&#xff0c;是通过传入的属性进行定制化显示数值&#xff0c;在渲染时&#xff0c;会根据不同的情况显示整数部分、小数部分和单位&#xff0c;支持自定义样式…

shell脚本awk中使用for循环

今天想使用shell脚本处理一ini文件下的ip地址&#xff0c;也就是INTRANET&#xff0c;前面的ip地址&#xff0c;折腾挺久。文件格式如下&#xff1a; 正确代码&#xff1a; grep -E INTRANET /home/aaaa/bbbb/hostinfo.ini | awk -F , {for(i1; i<NF; i) if($i~"INT…

全国现状建筑数据,选中范围即可查询下载,富含建筑物位置、层数、建筑物功能、名称地址等信息!

今天分享的是一个绘制范围即可下载范围内的建筑数据下载工具&#xff0c;内含高质量建筑数据数据源&#xff0c;助力场地建设规模一目了然。 数据可视化&#xff1a; 建筑物位置、层数、建筑轮廓地图可见&#xff0c;辅助分析。 数据字段&#xff1a; 建筑高度、层数、基地面…

2024年度最佳大型语言模型(LLMs)汇总大全

大型语言模型(LLMs)是人工智能文本处理的主要类型&#xff0c;也现在最流行的人工智能应用形态。ChatGPT是迄今为止最著名的使用LLM的工具&#xff0c;它由OpenAI的GPT模型的特别调整版本提供动力。但还有许多其他聊天机器人和文本生成器&#xff0c;包括从Google Bard和Anthro…

【常用知识点-Java】启动新进程

Author&#xff1a;赵志乾 Date&#xff1a;2024-07-05 Declaration&#xff1a;All Right Reserved&#xff01;&#xff01;&#xff01; 1. 简介 Java内启动一个外部进程&#xff08;操作系统级别的进程&#xff09;&#xff0c;通常使用ProcessBuilder类。其可以方便、灵活…

每天一个数据分析题(四百十一)- 主成分

在实际应用中&#xff0c;若研究单个指标的方差对结果的影响&#xff0c;在做主成分析的时候应该选择使用&#xff08; &#xff09; A. 协方差矩阵 B. 原始变量构成的矩阵 C. 关联矩阵 D. 其余三者皆可 数据分析认证考试介绍&#xff1a;点击进入 题目来源于CDA模拟题库…

加速度传感器信号处理注意事项

1 传感器分类 对于压电式压力传感器而言&#xff0c;输出信号是最重要的选择标准之一。压电式压力传感器与电子电路相连&#xff0c;电子电路将传感器产生的电荷成比例转换为电压。 如果选用外部设备&#xff08;电荷放大器&#xff09;充当电子元件&#xff0c;则称其为电…

Mojolicious配置全解:深入探索Web应用的设置秘诀

Mojolicious配置全解&#xff1a;深入探索Web应用的设置秘诀 Mojolicious是一个功能丰富的Perl Web开发框架&#xff0c;它提供了一种简单而强大的方法来构建和配置Web应用。Mojolicious的配置文件是应用配置的核心&#xff0c;包含了应用的行为和运行时设置。本文将详细解释M…

Spark SQL----内置函数String Functions

Spark SQL----内置函数String Functions String Functions 例子&#xff1a; -- ascii SELECT ascii(222); ---------- |ascii(222)| ---------- | 50| ----------SELECT ascii(2); -------- |ascii(2)| -------- | 50| ---------- base64 SELECT base64(Spark SQ…

JavaScript 正则表达式:标准的KAFKA GROUP_ID 和 TOPIC 的格式限制

KAFKA TOPIC格式&#xff0c;只允许使用字母、数字、英文句点.、下划线_、中划线-、分号;、冒号: 注意&#xff1a;** -前面要加\转义** /^[a-zA-Z0-9_.\-;:]$/KAFKA GROUP_ID格式限制为3-128个字符&#xff0c;只能包含数字、字母、下划线、中划线和点&#xff0c;且至少包含…

【毛发教程】使用 Maya、XGen 和虚幻引擎创建马尾辫发型

Malte Resenberger-Loosmann是国外一名首席艺术家&#xff0c;他负责指导整个艺术部门来制作独立游戏项目中的3D建模。在本文中&#xff0c;Loosmann展示了马尾辫发型背后的工作流程&#xff0c;分享了 Maya 和虚幻引擎中的场景设置&#xff0c;并解释了 GS CurveTools 如何帮助…

SQLSERVER 有哪些关键字不能作为字段需要注意的

今天遇到一个错误&#xff1a; 2024-07-05 08:42:33.150 ERROR 8220 --- [io-17001-exec-1] c.alibaba.druid.filter.stat.StatFilter : merge sql error, dbType sqlserver, druid-1.1.21, sql : SELECT dydm,dymc,byzd1,byzd3,byzd4,in_date,out,out_date FROM dianyuan WHE…