React 基础要点回顾与 JSX 语法剖析

React 框架基础回顾https://www.nowcoder.com/issue/tutorial?zhuanlanId=j572L2&uuid=ad4c96561557439591c01368cbe8144a

React 是一个用于构建用户界面的 JavaScript 库,特别适用于构建单页应用(SPA)。它强调组件的复用和状态管理,使得开发大型应用时更加高效和可维护。

1. React 的核心概念
组件:React 的核心构建块。组件可以是类组件或者函数组件。函数组件通常更简单、性能更好,并广泛使用。

// 函数组件示例
const HelloWorld = () => {
  return <h1>Hello, World!</h1>;
};
JSX:JavaScript 的一种扩展语法。它允许使用类似 HTML 的语法来描述 UI 结构。JSX 会被编译为 JavaScript 的 React.createElement 函数调用。

状态(State):一个组件的状态,它用来存储影响组件渲染的数据。状态可以通过 useState 钩子(在函数组件中)或者 this.state(在类组件中)管理。

属性(Props):组件的输入参数。可以将数据从父组件传递给子组件。

生命周期:React 组件的生命周期事件(如挂载、更新、卸载)允许你在特定时间段做一些事情。类组件可以使用生命周期方法,而函数组件可以使用 useEffect 钩子。
全部评论

相关推荐

04-01 10:06
武汉大学 C++
问问大佬们(1)class&nbsp;ZeroEvenOdd&nbsp;{&nbsp;&nbsp;&nbsp;&nbsp;private&nbsp;int&nbsp;n;&nbsp;&nbsp;&nbsp;&nbsp;ReentrantLock&nbsp;lock&nbsp;=&nbsp;new&nbsp;ReentrantLock(true);&nbsp;&nbsp;&nbsp;&nbsp;private&nbsp;int&nbsp;x&nbsp;=&nbsp;1;&nbsp;&nbsp;&nbsp;&nbsp;private&nbsp;boolean&nbsp;isZero&nbsp;=&nbsp;true;&nbsp;&nbsp;&nbsp;&nbsp;private&nbsp;Condition&nbsp;condition&nbsp;=&nbsp;lock.newCondition();&nbsp;&nbsp;&nbsp;&nbsp;public&nbsp;ZeroEvenOdd(int&nbsp;n)&nbsp;{&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;this.n&nbsp;=&nbsp;n;&nbsp;&nbsp;&nbsp;&nbsp;}&nbsp;&nbsp;&nbsp;&nbsp;//&nbsp;printNumber.accept(x)&nbsp;outputs&nbsp;&amp;quot;x&amp;quot;,&nbsp;where&nbsp;x&nbsp;is&nbsp;an&nbsp;integer.&nbsp;&nbsp;&nbsp;&nbsp;public&nbsp;void&nbsp;zero(IntConsumer&nbsp;printNumber)&nbsp;throws&nbsp;InterruptedException&nbsp;{&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;while(x&nbsp;&lt;=&nbsp;n){&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;lock.lock();&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;if(isZero&amp;amp;&amp;amp;x&nbsp;&lt;=&nbsp;n){&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;printNumber.accept(0);&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;isZero&nbsp;=&nbsp;false;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;condition.signalAll();&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;}else{&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;condition.await();&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;}&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;lock.unlock();&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;}&nbsp;&nbsp;&nbsp;&nbsp;}&nbsp;&nbsp;&nbsp;&nbsp;public&nbsp;void&nbsp;even(IntConsumer&nbsp;printNumber)&nbsp;throws&nbsp;InterruptedException&nbsp;{&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;while(x&nbsp;&lt;=&nbsp;n){&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;lock.lock();&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;if(!isZero&nbsp;&amp;amp;&amp;amp;&nbsp;x%2&nbsp;==&nbsp;0){&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;printNumber.accept(x);&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;x++;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;isZero&nbsp;=&nbsp;true;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;condition.signalAll();&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;}else{&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;condition.await();&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;}&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;lock.unlock();&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;}&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;}&nbsp;&nbsp;&nbsp;&nbsp;public&nbsp;void&nbsp;odd(IntConsumer&nbsp;printNumber)&nbsp;throws&nbsp;InterruptedException&nbsp;{&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;while(x&nbsp;&lt;=&nbsp;n){&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;lock.lock();&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;if(!isZero&nbsp;&amp;amp;&amp;amp;&nbsp;x%2&nbsp;==&nbsp;1){&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;printNumber.accept(x);&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;x++;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;isZero&nbsp;=&nbsp;true;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;condition.signalAll();&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;}else{&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;condition.await();&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;}&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;lock.unlock();&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;}&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;}}(2)class&nbsp;ZeroEvenOdd&nbsp;{&nbsp;&nbsp;&nbsp;&nbsp;private&nbsp;final&nbsp;int&nbsp;n;&nbsp;&nbsp;&nbsp;&nbsp;private&nbsp;int&nbsp;x&nbsp;=&nbsp;1;&nbsp;&nbsp;&nbsp;&nbsp;//&nbsp;true:&nbsp;打印0&nbsp;&nbsp;false:&nbsp;不打印0&nbsp;&nbsp;&nbsp;&nbsp;private&nbsp;boolean&nbsp;isZero&nbsp;=&nbsp;true;&nbsp;&nbsp;&nbsp;&nbsp;public&nbsp;ZeroEvenOdd(int&nbsp;n)&nbsp;{&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;this.n&nbsp;=&nbsp;n;&nbsp;&nbsp;&nbsp;&nbsp;}&nbsp;&nbsp;&nbsp;&nbsp;public&nbsp;void&nbsp;zero(IntConsumer&nbsp;printNumber)&nbsp;throws&nbsp;InterruptedException&nbsp;{&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;while&nbsp;(x&nbsp;&lt;=&nbsp;n)&nbsp;{&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;synchronized&nbsp;(this)&nbsp;{&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;if&nbsp;(isZero)&nbsp;{&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;printNumber.accept(0);&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;isZero&nbsp;=&nbsp;false;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;this.notifyAll();&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;}&nbsp;else&nbsp;{&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;this.wait();&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;}&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;}&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;}&nbsp;&nbsp;&nbsp;&nbsp;}&nbsp;&nbsp;&nbsp;&nbsp;public&nbsp;void&nbsp;even(IntConsumer&nbsp;printNumber)&nbsp;throws&nbsp;InterruptedException&nbsp;{&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;while&nbsp;(x&nbsp;&lt;=&nbsp;n)&nbsp;{&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;synchronized&nbsp;(this)&nbsp;{&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;if&nbsp;(x&nbsp;%&nbsp;2&nbsp;==&nbsp;0&nbsp;&amp;amp;&amp;amp;&nbsp;!isZero)&nbsp;{&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;printNumber.accept(x);&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;isZero&nbsp;=&nbsp;true;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;x++;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;this.notifyAll();&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;}&nbsp;else&nbsp;{&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;this.wait();&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;}&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;}&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;}&nbsp;&nbsp;&nbsp;&nbsp;}&nbsp;&nbsp;&nbsp;&nbsp;public&nbsp;void&nbsp;odd(IntConsumer&nbsp;printNumber)&nbsp;throws&nbsp;InterruptedException&nbsp;{&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;while&nbsp;(x&nbsp;&lt;=&nbsp;n)&nbsp;{&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;synchronized&nbsp;(this)&nbsp;{&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;if&nbsp;(x&nbsp;%&nbsp;2&nbsp;!=&nbsp;0&nbsp;&amp;amp;&amp;amp;&nbsp;!isZero)&nbsp;{&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;printNumber.accept(x);&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;isZero&nbsp;=&nbsp;true;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;x++;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;this.notifyAll();&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;}&nbsp;else&nbsp;{&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;this.wait();&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;}&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;}&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;}&nbsp;&nbsp;&nbsp;&nbsp;}}为什么(1)代码最后可能多输出一个0。(2)代码不会
点赞 评论 收藏
分享
04-08 21:42
已编辑
河海大学 Java
1.面试官自我介绍&nbsp;:&nbsp;美团的直播部门后端2.自我介绍八股:1.redis都什么数据结构?项目当中常用那哪几个?位图在项目中怎么用的?2.布隆过滤器的原理?3.volatile&nbsp;关键词作用?有序性是怎么实现的?4.进程和线程的区别?线程是为了解决进程的什么问题?手撕:字符串大数相加反问:1.base&nbsp;北京&nbsp;2.AI相关&nbsp;3.建议:&nbsp;多巩固基础(看我撕得这么费劲)总结:面试官非常好,和我有说有笑的探讨问题,但是最近都没看算法,简单题居然吭哧吭哧写了二十分钟,面试官在我写题的时候也一直看着屏幕,也没有做其他事就看着我写,方法写错个字母还用指针点了一下帮我排除错误(我哭死)面试官很好但是我太菜,还是要好好去复习不能摆发现自己有个坏习惯,回答问题的时候眼神一直到处飘,而且频率很高,怕被误认为有其他作弊工具,牛友们也要注意一下眼神管理 许愿二面问了我的AI项目,另一个项目一句没问:1.完成度怎么样?能和运行么?跑个栗子看一下罢!2.整体的运作流程3.和Langachain4j对标的还有那些JavaAI框架?4.Manus了解过么?5.举个具体的Tool例子6.解释下Agent是什么概念?和Tool有什么区别7.大模型在Agent中起到了什么作用?过程当中会调用多个大模型么?8.LLM的具体原理?Token是怎么存的?从一个个Token到输出的过程是怎样?9.为什么要存上下文记忆?&nbsp;&nbsp;
点赞 评论 收藏
分享
📍面试公司:鹅👜面试岗位:全栈开发📅面试时间:4.1⏳面试时长:1h30min📖面试问题:1.&nbsp;自我介绍直入主题2.&nbsp;解释Java中ThreadLocal的用途、适用场景及使用时的注意事项3.&nbsp;如果系统中出现内存泄漏,如何分析原因?4.&nbsp;visualVM能具体看到哪里出现内存泄漏吗?5.&nbsp;BIO、NIO?Java中哪些框架或技术会用到NIO?用过吗?6.&nbsp;selector的工作原理?7.&nbsp;selector的缺陷8.&nbsp;epoll介绍一下9.&nbsp;epoll是通过什么方式做到不需要轮询的?&nbsp;10.&nbsp;开放题:随着用户量以及数据量增大,cpu突然飙高,分析思路是什么?11.&nbsp;聚簇索引和非聚簇索引12.&nbsp;MySQL的事务隔离级别有哪些?每个级别局里13.&nbsp;Redis持久化14.&nbsp;缓存三兄弟15.&nbsp;如何用Redis实现分布式锁?可能遇到的问题如何解决(锁未释放、网络中断)?16.&nbsp;GC分类17.&nbsp;JVM内存模型18.&nbsp;volatile特性和实现原理19.&nbsp;介绍一下在项目中负责的内容,遇到的最大的困难以及如何解决20.&nbsp;模型部署(基本上是面试官全程分享,让我多去了解了解,很有好处)21.&nbsp;针对项目,用户量增大,如何优化?反问:为什么是全栈开发?主要业务?真的很感兴趣,可惜了面试轮次?base地?为什么在深圳!!!!一个半小时都过来了,最后一个问题我就知道,白面了🖊笔试问题:POJ&nbsp;3258&nbsp;River&nbsp;Hopscotch🙌面试体验:面试官人真好很好很好很好,我回答的内容如果很乱,他会帮我重新总结一遍,对于我答不出来的问题,直接给出他的理解并让我可以结束后再去看看,全程都比较轻松愉快结束后秒通过,可惜最后反问的时候发现base地不是我想去的地方,于是拒绝了
点赞 评论 收藏
分享
评论
点赞
收藏
分享

创作者周榜

更多
牛客网
牛客企业服务