• 【摘星星计划】day16-dayxx：react基础

    学习记录，如有不正之处，请帮指正🤝，万分感谢！

    1、 react是什么？ react设计思想？react组件生命周期是怎样的？

    react是一个用于构建用户界面的JavaScript库，它可以通过组件化的方式构建快速响应的大型Web应用程序，它使用声明式（告诉程序需要什么效果）编写页面；跨平台（web，Android...）。
MVC（Model View Controller）?

react设计思想：UI=render(data)，数据操作DOM，响应式编程

react组件生命周期：
  三个状态：
    ·挂载 mounting：已插入真实DOM
                  constructor() 构造函数
                  getDerivedStateFromProps()
                  render()
                  componentDidMount()
    ·更新 updating：正在被重新渲染
                  getDerivedStateFromProps()
                  shouldComponentUpdate()
                  render()
                  getSnapshotBeforeUpdate()
                  componentDidUpdate()
    ·卸载 unmounting：已移除真实DOM
                  conmponentWillUnmount()
  阶段：
    初始化，更新，销毁，错误处理
    图解：https://blog.csdn.net/weixin_45374484/article/details/104456589

    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    • 8
    • 9
    • 10
    • 11
    • 12
    • 13
    • 14
    • 15
    • 16
    • 17
    • 18
    • 19
    • 20
    • 21
    • 22
    • 23

    2、 使用框架开发对比原生开发 有何优势？

    框架：framework
优势：框架会有统一的规范、官方文档、社区等，能较快地帮助解决问题，也能让团队协作较好，提高开发效率；
     框架经过市场的考验，稳定性较好，技术人员容易上手快；
     很多框架是免费的，成本低

    • 1
    • 2
    • 3
    • 4

    3、 什么是jsx? 写个jsx的样例

    jsx = JavaScript+XML，使用小驼峰命名（因为语法是更接近JavaScript，而不是HTML），在js中可以写html
jsx是js的语法扩展
jsx语法：html语言直接写在js语言之中，不加任何引号
例子：
（1）
  ReactDOM.render(
    <div>
    <h1>hello world</h1>
    <p data-myattribute = "xxxx">hi</p>   ➡添加自定义属性需要使用 data- 前缀
    </div>
    ,
    document.getElementById('example')
  );
（2）放在外面，一个单独的文件
    ReactDOM.render(
      <h1>Hello world</h1>,
      document.getElementById('example')
    );
  在html中引入：
    <body>
      <div id="example"></div>
      <script type="text/babel" src="helloworld.js"></script>
    </body>

    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    • 8
    • 9
    • 10
    • 11
    • 12
    • 13
    • 14
    • 15
    • 16
    • 17
    • 18
    • 19
    • 20
    • 21
    • 22
    • 23

    4、什么是单向数据流？

    单向：朝一个方向。
单向数据流：数据朝一个方向流动，从上到下。当数据有变化时，它影响其下游

    • 1
    • 2

    5、react 组件之间的通信方式？

    在这里插入代码片

    • 1

    6、react中 state与props的区别？ 什么是state, 什么是props? 如何修改state或props？state或props变化会引发哪些生命周期执行？

    在这里插入代码片

    • 1

    7、react key有什么作用？补充详情

    在这里插入代码片

    • 1

    8、什么是类组件？什么是函数式组件？ react hooks是什么？

    在这里插入代码片

    • 1

    9、hooks 有哪些优点？解决了哪些问题？

    hooks，钩子/函数
hooks状态管理的解决方案之一，它将组件中关联的部分分成更小的
     函数式编程，每个功能都写在函数中，清晰，
     代码复用
     像useEffect代替了生命周期函数，useState可以初始化状态，useContext接受上下文...

    • 1
    • 2
    • 3
    • 4
    • 5

    10、什么是redux? redux思想？解决了哪些问题？除了redux还有哪些解决方案？

    在这里插入代码片

    • 1

    11、函数组件如何获取自身的执行状态？ 如是否更新， 是否挂载完成，如何知道自己被销毁了？

    在这里插入代码片

    • 1

    12、生命周期的正确执行顺序（类组件）？

    在这里插入代码片

    • 1

    13、SPA 是什么？MPA 是什么？SPA 的路由原理？

    在这里插入代码片

    • 1
  • 相关阅读:
    [libevent：构建高性能事件驱动应用的利器]
    LeetCode刷题day24||回溯算法理论基础&&77. 组合--回溯
    java计算机毕业设计数据分析星辰网智能手机销售网站源码+mysql数据库+系统+lw文档+部署
    【Python小程序】浮点矩阵加减法
    【Java 基础篇】Java同步代码块解决数据安全
    CSS之margin塌陷
    Rancher 离线安装 longhorn 存储类
    echarts双轴刻度线y轴刻度线对齐
    java毕业设计日租房管理系统源码+lw文档+mybatis+系统+mysql数据库+调试
    【Rust日报】2022-10-30 如何修补 Rust 中即将出现的 OpenSSL 漏洞
  • 原文地址：https://blog.csdn.net/weixin_45820190/article/details/125483896