node常见面试题库 1、检测系统中node版本号的指令是？node -v2、如何退出node执行环境（REPL环境）？ctrl+c c3、node如何创建服务器，写出代码？var http=require(‘http’);
var server=http.createServer(function(req,res,next){
//业务逻辑 })
server.listen(
转载
2023-10-07 13:46:27
102阅读
对 React 的理解、特性
React 是靠数据驱动视图改变的一种框架，它的核心驱动方法就是用其提供的 setState 方法设置 state 中的数据从而驱动存放在内存中的虚拟 DOM 树的更新
更新方法就是通过 React 的 Diff 算法比较旧虚拟 DOM 树和新虚拟 DOM 树之间的 Change ，然后批处理这些改变。
遵循组件设计模式、声明式编程范式和函数式编程概念，以使前端应
react 事件机制 React并不是将click事件绑定到了div的真实DOM上，而是在document处监听了所有的事件， 当事件发生并且冒泡到document处的时候，React将事件内容封装并交由真正的处理函数运行。 这样的方式不仅仅减少了内存的消耗，还能在组件挂在销毁时统一订阅和移除事件。 ...
转载
2021-09-27 12:01:00
244阅读
2评论
模拟dom，状态发生变化时，先在js对象上计算和比较，找出最小差异，然后将这些差异批量更新到真实dom。数据请求，事件监听，避免阻塞渲染，提升用户体验。初始渲染，更新成本。
tsx转换成真实DOM过程
TypeScript 编译阶段：
.tsx 文件包含了 TypeScript 类型注解和 JSX 语法，首先通过 TypeScript 编译器（如tsc或者配合Babel的@babel/preset-typescript插件）进行编译。
TypeScript 编译器负责检查类型注解的正确性，并且把包含类型信息的 TypeScript+JSX 代码转换为普通的 JavaS
React refs 的理解
React 中的 ref 是一种在组件之间直接访问 DOM 节点或在函数组件中访问类组件实例的能力。React 的 ref 底层原理涉及以下几个关键点：
创建和分配 Refs：
React 提供了几种创建 ref 的方式，如 React.createRef()（适用于类组件）、useRef() Hook（适用于函数组件）以及 forwardRef()（用于在函数组件之
组件之间如何通信
父组件向子组件通信：父组件通过 props 向子组件传递需要的信息。
子组件向父组件通信：: props+回调的方式。
跨级组件的通信方式？
Context API：
React的Context API提供了一种在组件树中共享数据的方法，而无需手动通过每个级别的props传递。你可以创建一个Context对象，并使用<MyContext.Provider>在组件树中的
setState 方法在 React 中调用后，直到页面重新渲染之间经历了一系列的步骤。以下是这个过程的详细解释：
状态合并：
当调用 setState 时，React 不会立即改变组件的状态，而是将传入的新状态对象与当前状态进行合并。合并通常是浅层合并，这意味着如果新状态包含深层次的对象属性更改，那么只有第一层属性会合并，深层对象的更改可能不会生效，除非显式替换整个深层对象。
异步处理：
Rea
React 事件代理原理
事件绑定在顶级容器：React 在组件的最外层容器（比如在ReactDOM.render()方法挂载的DOM节点上）绑定一个单一的事件监听器，而不是为每个子组件分别绑定。
合成事件系统：React 创建了自己的合成事件（SyntheticEvent），它是对浏览器原生事件的一层抽象，无论底层浏览器如何，合成事件的行为都是一致的。当用户交互发生时，相应的原生事件会冒泡到顶层
触发 React 重新渲染
状态变化（State Update）：
当组件内部调用 setState() 方法更新状态时，React会触发该组件及其后代组件的重新渲染流程，除非 shouldComponentUpdate()、getDerivedStateFromProps() 或者 useEffect() Hook 中指定了特殊的优化条件。
Props变化（Props Change）：
当父组件
react 中怎么实现重定向
重定向（Redirect）在Web开发中指的是将用户的请求从一个URL转向另一个URL的行为，通常是当用户访问某个页面时，服务器或前端框架决定将用户引导至另一个页面。
使用<Redirect>组件（适用于React Router v4及更高版本）： 在一个路由配置或组件内部使用<Redirect>组件，当组件渲染时，它会立刻执行重定向。
编程式
React面试题总结内容主要包括基础知识，React 组件，React Redux，React 路由。 基本知识 1. 区分Real DOM和Virtual DOM Real DOM Virtual DOM 更新缓慢。 更新更快。 可以直接更新 HTML。 无法直接更新 HTML。 如果元素更新，则 ...
转载
2021-07-21 16:12:00
224阅读
2评论
参考：https://www.kancloud.cn/freya001/interview/1228068 001.React 中 setState 什么时候是同步的，什么时候是异步的？
转载
2021-06-28 14:09:52
154阅读
React上注册的事件最终会绑定在document这个DOM上，而不是React组件对应的DOM（减少内存开销就是因为所有的事heticEventrender(){return (
原创
2024-07-02 13:50:11
63阅读
React 性能优化的手段
React 中进行性能优化的手段可以从多个维度进行分类，以下是一些关键类别及其对应的优化策略：
组件优化
使用PureComponent或React.memo：对于仅根据props和state改变才重新渲染的组件，使用React.PureComponent或者对其包装一层React.memo，它们都能通过浅比较props来避免不必要的重新渲染。
shouldComp
diff的原理
React中的diff算法是其核心优化策略之一，用于比较新旧两个虚拟DOM树之间的差异，并找出最小化的DOM操作集以更新真实DOM。以下是React中diff算法的大致步骤概述：
树结构比较:
React并不会简单地递归遍历整颗新旧虚拟DOM树进行全量比较，而是采用分层比较的思想，仅比较同层级的节点。
它首先会比较树的根节点，如果根节点不同，则直接替换整个根节点对应的真实DOM元素
对React Hooks的理解
hooks的出现，使函数组件的功能得到了扩充，拥有了类组件相似的功能，在我们日常使用中，使用hooks能够解决大多数问题，并且还拥有代码复用机制，因此优先考虑hooks
解决老的函数式组件在React Hook出现之前，函数式组件（也称为无状态组件）的主要特点与优缺点如下：
早期函数式组件优点：
简洁性：函数式组件代码结构简单，易于阅读和理解，因为它仅负责接收pro
高阶组件
React 中的高阶组件（Higher-Order Component，简称 HOC）是一种高级的React组件抽象概念，它本质上是一个函数，此函数接受一个React组件作为参数，并返回一个新的封装过的React组件。高阶组件主要用于代码复用、逻辑抽象和交叉关注点的处理，比如权限控制、数据预取、主题样式切换等场景。
什么是高阶组件：
在函数式编程的概念中，高阶函数是指接受函数作为输入或者
性能优化在哪个生命周期？原理？
React 中进行性能优化的关键生命周期方法是 shouldComponentUpdate(nextProps, nextState)，这是在类组件中可用的一个生命周期方法。另外，在函数组件中，可以通过 React.memo 或者 useMemo、useCallback Hooks 来实现相似的效果。
shouldComponentUpdate(nextProps,
1. React-Router的实现原理是什么
基于 hash 的路由：通过监听hashchange事件，感知 hash 的变化
改变 hash 可以直接通过 location.hash=xxx
基于 H5 history 路由：
改变 url 可以通过 history.pushState 和 resplaceState 等，会将URL压入堆栈，同时能够应用 history.go() 等 API
