面试 React 框架八股文十问十答第二期

面试 React 框架八股文十问十答第二期

作者:程序员小白条,个人博客

相信看了本文后,对你的面试是有一定帮助的!关注专栏后就能收到持续更新!

⭐点赞⭐收藏⭐不迷路!⭐

1)redux 的工作流程?

  • 触发一个 action,通过调用 store.dispatch(action) 发起。
  • Redux store 收到 action 后,通过 reducer 函数处理,生成新的 state。
  • 订阅了 store 的组件会收到新的 state,从而更新视图。

2)react-redux 是如何工作的?

  • react-redux 提供了 Provider 组件,它将 Redux store 传递给应用的所有组件。
  • 使用 connect 函数将 React 组件连接到 Redux store,该函数接受两个参数:mapStateToPropsmapDispatchToProps,分别用于将 state 和 action 映射到组件的 props。
  • 连接后的组件可以通过 props 直接访问 Redux store 的 state 和 dispatch 函数。

3)redux 中如何进行异步操作?

  • 可以使用中间件来处理异步操作,最常见的是 redux-thunkredux-saga 等。
  • 使用 redux-thunk,action 可以是一个函数而不仅仅是一个对象。这个函数接受 dispatchgetState 作为参数,允许进行异步操作后再分发其他 action。

4)redux 异步中间件 redux-thunk 的优劣?

  • 优点:
    • 简单易用,容易理解和上手。
    • 良好的社区支持,广泛应用于许多项目。
  • 缺点:
    • 对于复杂的异步流程,可能会导致 action 创建函数嵌套过深,使代码难以维护。
    • 可能不如其他中间件处理一些复杂的异步场景。

5)合成事件是什么?

  • 在 React 中,合成事件是指由 React 负责包装浏览器原生事件对象而创建的事件对象。React 在不同浏览器之间提供了一致的事件处理方式。
  • 这样的设计使得 React 能够屏蔽底层浏览器的差异,提供一致性的事件接口,方便开发者编写跨浏览器的代码。React 的事件系统支持冒泡、捕获、委托等特性,同时也提供了合成事件对象的属性和方法。

6)React Hooks 原理?

  • Hooks 是 React 16.8 引入的特性,允许函数组件内部使用 state、生命周期等 React 特性。它们是函数,可让你在不编写 class 的情况下使用 state 以及其他 React 特性。
  • Hooks 本质上是一些 JavaScript 函数,通过调用 React 提供的特定函数(如 useState, useEffect, useContext 等)来在函数组件中使用 React 的功能。
  • 这些 Hook 函数通过使用 React 内部的特殊机制来跟踪组件的状态和生命周期,并确保在组件重新渲染时状态保持不变。

7)为什么 ReactHooks 中不能有条件判断?

  • Hooks 需要在每次渲染中按照相同的顺序被调用。如果在条件语句中使用 Hook,会导致调用顺序发生变化,违反了 React Hooks 的规则。
  • 这会导致 React 在重新渲染时无法正确地追踪和处理状态的变化,因此条件判断内部使用 Hook 会引发错误。

8)用过哪些 Hook?

  • useState: 用于在函数组件中添加状态。
  • useEffect: 处理副作用,如数据获取、订阅、手动操作 DOM 等。
  • useContext: 获取 React 上下文。
  • useReducer: 可选的 state 管理方案,用于处理复杂的状态逻辑。
  • useCallbackuseMemo: 优化性能,避免不必要的重新渲染。

9)Class 组件 VS Hook

  • Class 组件:使用传统的生命周期方法,包含较多的模板代码和状态管理逻辑,可读性较差。
  • Hook:函数式组件更简洁、易读,通过提供各种 Hook,使得组件逻辑更为清晰,减少样板代码,更方便复用和测试。

10)自定义过哪些 Hook?

  • 自定义 Hook 是指在函数中封装并抽象出可复用的逻辑。我可以帮你列举一些常见的自定义 Hook,比如处理表单逻辑、订阅事件、管理定时器等。

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

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

相关文章

golang中gorm使用

前言 记录下go语言操作mysql数据库,选用gorm,gorm是一个流行的对象关系映射(ORM)库,用于简化与数据库的交互。 接入步骤 安装gorm:首先,你需要使用Go模块来安装gorm。在终端中运行以下命令&…

【Linux】nmap命令:扫描网络中的主机和端口

目录 1.扫描特定IP地址的所有端口: 2.扫描特定IP地址的特定端口: 3.扫描一个IP地址范围的端口: 4.扫描特定端口范围: 5.扫描并显示所有端口的详细信息: 6.扫描并输出XML格式的结果: 7.使用“ping…

Doris 案例篇——长安汽车基于 Doris 的车联网数据分析平台建设实践

Doris 案例篇——长安汽车基于 Doris 的车联网数据分析平台建设实践 随着消费者更安全、更舒适、更便捷的驾驶体验需求不断增长,汽车智能化已成必然趋势。长安汽车智能化研究院作为长安汽车集团有限责任公司旗下的研发机构,专注于汽车智能化技术的创新与研究。为满足各业务部…

数据结构第十一弹---堆

堆 1、堆的概念及结构2、堆的性质3、堆的调整算法3.1、向下调整算法3.2、向上调整算法 4、堆的实现4.1、头文件包含和结构定义4.2、初始化4.3、销毁4.4、插入数据4.5、删除数据 删除堆顶4.6、获取堆顶元素4.7、获取有效数据个数4.8、判断是否为空 5、代码汇总5.1、Heap.h5.2、H…

好用的设备租赁管理软件有哪些?

“我们公司是做设备租赁的,想找一款适合设备租赁的库存管理软件,最好有库存管理,客户信息,设备外调管理,租赁天数管理,设备的借出与归还信息管理与查询。” 总结一下—— 库存管理客户信息管理设备租赁管…

阿里云服务器 使用Certbot申请免费 HTTPS 证书及自动续期

前言 Certbot是一款免费且开源的自动化安全证书管理工具,由电子前沿基金会(EFF)开发和维护,是在Linux、Apache和Nginx服务器上配置和管理SSL/TLS证书的一种机制。Certbot可以自动完成域名的认证并安装证书。 一、 安装软件 1.1…

38.深入MySQL

深入MySQL 索引 索引是关系型数据库中用来提升查询性能最为重要的手段。关系型数据库中的索引就像一本书的目录,我们可以想象一下,如果要从一本书中找出某个知识点,但是这本书没有目录,这将是意见多么可怕的事情!我们…

JVM如何执行synchronized修饰的方法

首先市面上关于synchronized的资料已经很多了,但是大家对于底层的原理实现可能没有什么概念,大多都是死记硬背,所以我想通过实战的方式给大家带来一些不一样的体验。具体体现在哪些方面呢? 更系统。市面上目前虽然资料众多&#x…

【OpenCV学习笔记02】- 图像入门

内容 这里介绍了图像处理的入门操作,,你将学习如何读取图像,如何显示图像以及如何将其保存回去你将学习以下功能:cv.imread(),cv.imshow(),cv.imwrite() 简单使用OpenCV 读取图像 使用cv.imread()函数读…

【程序员干货】开发常用免费接口

全国快递物流地图轨迹查询:【H5物流轨迹、单号识别】通过物流单号和收寄件地址,自动评估物流时效,并在地图中展示包裹运输轨迹。包括顺丰、圆通、申通等主流快递公司。自动识别快递公司及单号,实时查询,稳定高效&#…

WPF 入门教程DispatcherTimer计时器

https://www.zhihu.com/tardis/bd/art/430630047?source_id1001 在 WinForms 中,有一个名为 Timer 的控件,它可以在给定的时间间隔内重复执行一个操作。WPF 也有这种可能性,但我们有DispatcherTimer控件,而不是不可见的控件。它几…

15-链表-环形链表 II

这是链表的第15题,力扣链接。 给定一个链表的头节点 head ,返回链表开始入环的第一个节点。 如果链表无环,则返回 null。 如果链表中有某个节点,可以通过连续跟踪 next 指针再次到达,则链表中存在环。 为了表示给定链…

中科驭数诚邀您参加第二届证券基金行业先进计算技术大会暨2024低时延技术创新实践论坛(上海站)

低时延技术是证券基金期货领域业务系统的核心技术,是打造极速交易系统领先优势的关键,也是证券基金行业关注的前沿技术热点。 继去年圆满举办首届证券基金行业先进计算技术大会之后,在中国计算机学会集成电路设计专委、先进计算产业联盟、证…

在macos上查看当前进程的栈信息

概述 在调试程序时,如cpu莫名的高或低,一个常用的方式就是打印当前进行的调用栈,然后确认各线程的执行函数是否有异常。 在linux系统中可以使用pstack命令,直接打印各线程的栈信息,可惜在macos上没有该命令。一种解决…

25 心形按钮

效果演示 实现了一个心形的心形图案&#xff0c;当用户点击图案时&#xff0c;图案会旋转并缩小&#xff0c;同时背景颜色会变成白色。 Code <div class"love"><input id"switch" type"checkbox"><label class"love-heart&…

049.Python包和模块_虚拟环境超详细讲解

我 的 个 人 主 页&#xff1a;&#x1f449;&#x1f449; 失心疯的个人主页 &#x1f448;&#x1f448; 入 门 教 程 推 荐 &#xff1a;&#x1f449;&#x1f449; Python零基础入门教程合集 &#x1f448;&#x1f448; 虚 拟 环 境 搭 建 &#xff1a;&#x1f449;&…

二叉树的层序遍历经典问题(算法村第六关白银挑战)

基本的层序遍历与变换 二叉树的层序遍历 102. 二叉树的层序遍历 - 力扣&#xff08;LeetCode&#xff09; 给你二叉树的根节点 root &#xff0c;返回其节点值的 层序遍历 。 &#xff08;即逐层地&#xff0c;从左到右访问所有节点&#xff09;。 示例 1&#xff1a; 输入…

Java顺序表(1)

&#x1f435;本篇文章将对顺序表中的方法进行模拟实现 一、线性表 线性表是指在逻辑结构上呈连续的线性结构&#xff0c;而在物理结构上不一定是连续的结构&#xff0c;常见的线性表有&#xff1a;顺序表、链表、栈、队列等 二、顺序表 顺序表一般采用数组来存储数据&#x…

【STM32】| 01——常用外设 | USART

系列文章目录 【STM32】| 01——常用外设 | USART 失败了也挺可爱&#xff0c;成功了就超帅。 文章目录 前言1. 基础理论1.1 并行通信和串行通信1.2 同步通信和异步通信1.3 单工/半双工/全双工1.4 电平信号(RS232/TTL)和差分信号(RS485)1.5 端口(COM) 2. 串口理论2.1 串口物理…

Springboot+RocketMQ通过事务消息优雅的实现订单支付功能

目录 1. 事务消息 1.1 RocketMQ事务消息的原理 1.2 RocketMQ订单支付功能设计 1. 事务消息 RocketMQ的事务消息&#xff0c;是指发送消息事件和其他事件需要同时成功或同时失败。比如银行转账&#xff0c; A银行的某账户要转一万元到B银行的某账户。A银行发送“B银行账户增加…