react-native 知识点

1.React Native相对于原生的ios和Android有哪些优势?

  1. 性能媲美原生APP
  2. 使用JavaScript编码,简单易学
  3. 绝大部分代码安卓和IOS都能共用,复用率90%以上
  4. 采用组件式开发,代码重用性很高,开发效率高
  5. 跟编写网页一般,修改代码后即可自动刷新,不需要慢慢编译,节省很多编译等待时间
  6. 支持APP热更新,更新无需重新安装APP

2.加载bundle的机制

要实现RN的脚本热更新,我们要搞明白RN是如何去加载脚本的。 在编写业务逻辑的时候,我们会有许多个js文件,打包的时候RN会将这些个js文件打包成一个叫index.jsbundle的文件,所有的js代码(包括rn源代码、第三方库、业务逻辑的代码)都在这一个文件里,启动App时会第一时间加载bundle文件,所以脚本热更新要做的事情就是替换掉这个bundle文件。

3.React Native组件的生命周期

生命周期
生命周期 调用次数 能否使用 setSate()
getDefaultProps 1(全局调用一次)
getInitialState 1
componentWillMount >=1 是(但是毫无意义)
componentDidMount 1 是(会导致组件在初始化的时候就触发了更新,渲染了两遍,应该尽量避免)
componentWillReceiveProps >=0
shouldComponentUpdate >=0
componentWillUpdate >=0
componentDidUpdate >=0
componentWillUnmount 1 是(无意义)

4.Redux中同步 action 与异步 action 最大的区别是什么

同步只返回一个普通 action 对象。而异步操作中途会返回一个 promise 函数。当然在 promise 函数处理完毕后也会返回一个普通 action 对象。thunk 中间件就是判断如果返回的是函数,则不传导给 reducer,直到检测到是普通 action 对象,才交由 reducer 处理。

5.redux状态管理的流程

原理图

action是用户触发或程序触发的一个普通对象。 reducer是根据action操作来做出不同的数据响应,返回一个新的state。 store的最终值就是由reducer的值来确定的。(一个store是一个对象, reducer会改变store中的某些值) action -> reducer -> 新store -> 反馈到UI上有所改变。

6.reactJS的props.children.map函数来遍历会收到异常提示,为什么?应该如何遍历?

this.props.children 的值有三种可能:

  1. 当前组件没有子节点,它就是 undefined
  2. 有一个子节点,数据类型是 object
  3. 有多个子节点,数据类型就是 array

所以系统提供React.Children.map()方法安全的遍历子节点对象

7.调用 setState 之后发生了什么?

当调用 setState 时,React会做的第一件事情是将传递给 setState 的对象合并到组件的当前状态。 这将启动一个称为和解(reconciliation)的过程。 和解(reconciliation)的最终目标是以最有效的方式,根据这个新的状态来更新UI。 为此,React将构建一个新的 React 元素树(您可以将其视为 UI 的对象表示)。 一旦有了这个树,为了弄清 UI 如何响应新的状态而改变,React 会将这个新树与上一个元素树相比较( diff )。 通过这样做, React 将会知道发生的确切变化,并且通过了解发生什么变化,只需在绝对必要的情况下进行更新即可最小化 UI 的占用空间。

8.shouldComponentUpdate 的作用是啥以及为何它这么重要?

shouldComponentUpdate 允许我们手动地判断是否要进行组件更新,根据组件的应用场景设置函数的合理返回值能够帮我们避免不必要的更新。

其实这个问题也是跟reconciliation有关系。 “和解( reconciliation )的最终目标是以最有效的方式,根据新的状态更新用户界面”。 如果我们知道我们的用户界面(UI)的某一部分不会改变, 那么没有理由让 React 很麻烦地试图去弄清楚它是否应该渲染。 通过从 shouldComponentUpdate 返回 false, React 将假定当前组件及其所有子组件将保持与当前组件相同

9.props和state相同点和不同点

相同点:

  1. 不管是props还是state的改变,都会引发render的重新渲染
  2. 都能由自身组件的相应初始化函数设定初始值

不同点:

  1. 初始值来源:state的初始值来自于自身的getInitalState(constructor)函数;props来自于父组件或者自身getDefaultProps(若key相同前者可覆盖后者)
  2. 修改方式:state只能在自身组件中setState,不能由父组件修改;props只能由父组件修改,不能在自身组件修改
  3. 对子组件:props是一个父组件传递给子组件的数据流,这个数据流可以一直传递到子孙组件;state代表的是一个组件内部自身的状态,只能在自身组件中存在。

10.React中Element 和 Component 有何区别?

简单地说,一个 React element 描述了你想在屏幕上看到什么。
换个说法就是,一个 React element 是一些 UI 的对象表示。
一个 React Component 是一个函数或一个类,
它可以接受输入并返回一个 React element
(通常是通过 JSX ,它被转化成一个 createElement 调用)。


你可能感兴趣的:(react-native 知识点)