React Hooks 核心原理与实战
王沛
eBay 中国研发中心资深技术专家
10740 人已学习
新⼈⾸单¥59
登录后,你可以任选2讲全文学习
课程目录
已完结/共 25 讲
React Hooks 核心原理与实战
15
15
1.0x
00:00/00:00
登录|注册

答疑解惑02

你好,我是王沛。实战模块是我们这门课的学习重点,我看到不少同学不仅跟上了学习进度,而且还跟着课程,动手写代码,并把其中讲解的思路应用到了自己的实际项目中。理论结合实践,学以致用,这是一种很有效的学习方法。
与此同时,我也看到有同学在留言区提出了很多有价值的问题。所以这节课呢,我会针对你在实战模块提出的一些具有代表性的问题,进行一个集中的答疑。一方面算是对课程内容做一个有针对性地补充,另外一方面也希望能对更多的同学有所启发和帮助。

第 9 讲

题目 1:article?.userId 和 article&&article.userId 的作用是一样的吗?第一次见这种写法,感觉好简洁。
回答:虽然这是一个 JS 的语法问题,但是因为是一个新语法,所以既然有同学问了,就拿出来讲一下。简单来说,“?." 是一个名为 optional chaining 的新语法,是刚刚进入 ECMAScript 的标准。借助于 Babel 我们现在可以放心使用。
article?.userId 和 article && article.userIde 这两种写法功能是基本等价的,就是判断 article 是否存在,如果存在则获取 userId 属性,否则就是 undefined。这样的话可以避免 JS 运行时的报错。唯一的一点区别在于,后者 && 的写法其实如果 article 为 null 或者 undefined 或者 0 等 falsy 的值时,会返回这个 falsy 的值本身,比如 null,undefined 或者 0。虽然这在大多数情况下是不用考虑这种差别的。
确认放弃笔记?
放弃后所记笔记将不保留。
新功能上线,你的历史笔记已初始化为私密笔记,是否一键批量公开?
批量公开的笔记不会为你同步至部落
公开
同步至部落
取消
完成
0/2000
荧光笔
直线
曲线
笔记
复制
AI
  • 深入了解
  • 翻译
    • 英语
    • 中文简体
    • 中文繁体
    • 法语
    • 德语
    • 日语
    • 韩语
    • 俄语
    • 西班牙语
    • 阿拉伯语
  • 解释
  • 总结

本文涵盖了多个技术问题的答疑解惑,包括 JavaScript 的 optional chaining 新语法、全局状态管理、HOC 和 render props 的使用场景,以及使用 Context 和 useReducer 实现全局状态管理等内容。作者强调了实战模块的重要性,并鼓励学生将理论与实践相结合。文章通过解答一些常见问题,详细阐述了技术问题的解决方法和实际应用场景,有助于读者提升技术水平。其中,对于 React 组件的重复渲染问题,作者强调了 useCallback 和 useMemo 的作用,以及对于原生节点的性能影响。此外,文章还涉及了 react-loadable 和 Service Worker 的使用场景,以及在 Service Worker 中使用 Cache Storage 缓存静态资源时的一些限制和注意事项。总的来说,本文内容丰富,涵盖了多个前端开发中常见的技术问题,对于想要深入了解这些技术的读者来说,是一篇值得阅读的文章。

仅可试看部分内容,如需阅读全部内容,请付费购买文章所属专栏
《React Hooks 核心原理与实战》
新⼈⾸单¥59
立即购买
登录 后留言

全部留言(3)

  • 最新
  • 精选
  • 极北之地
    这句话还是没太明白“而对于原生的节点,比如 div, input 这些,它们已经是原子节点了,不再有子节点,所以不存在重复刷新带来的性能损失”😭

    作者回复: 这么说吧 <input onclick="dosomething"/> 这样的原生节点,onclick 每次给一个新值,也只是属性的更新而已。对于 div,因为它的 children 不是 react 去控制的,所以属性变化也就只是属性变化,不会影响 dom diff。

    2021-07-21
    6
  • 1830
    老师麻烦问一下,当触发视图render时,组件不是全部都要重新渲染吗,即使用了useCallback也要渲染呀,为什么说可以减少重复渲染呢

    作者回复: 比如 <Form onChange={onChange}>...</Form> ,这个 Form 组件会根据 onChange 是否变化来决定是否重新 render。useCallback 可以让 onChange 在多次渲染之间不变,避免 Form 组件的重新渲染。

    2021-07-31
  • Geeker
    结束了?
    2021-07-13
    2
收起评论
显示
设置
留言
3
收藏
沉浸
阅读
分享
手机端
快捷键
回顶部