react中概念性总结(二)

目录

说说你对react的理解?有哪些特性?

说说Real diff算法是怎么运作的,从tree层到component层到element层分别讲解?

调和阶段setState干了什么?

说说redux的工作流程?

为什么react元素有一个$$type属性?

React有哪些优化性能的手段?

React render方法的原理,在什么时候会触发?

redux中同步action与异步action最大的区别是什么?

说说你对redux中间件的理解?常用的中间件有哪些?实现原理?

说说你对@reduxjs/toolkit的理解?和react-redux有什么区别?

React都有哪些hooks,如何使用?

说说你对受控组件和非受控组件的理解?应用场景?

重绘和回流(重排)是什么,如何避免?

为什么 useState 返回的是数组而不是对象


说说你对react的理解?有哪些特性?

React是一个流行的JavaScript库,用于构建用户界面(UI)。以下是我对React的理解以及它的一些主要特性:

1. 组件化

React是基于组件的库,它鼓励将用户界面分解成多个小组件,每个组件都有自己的状态和生命周期方法。这种组件化的方式使得代码更易于维护和重用。

2. 虚拟DOM

React使用虚拟DOM来提高性能。它会在内存中维护一个虚拟的DOM树,并将实际DOM的更新操作最小化,从而减少了重排和重绘的开销,提高了性能。

3. 单向数据流

React采用了单向数据流的模型,使得数据在应用中的流动更可控。数据从父组件传递给子组件,子组件通过回调函数通知父组件进行状态更新。这有助于构建可预测和易于调试的应用。

4. JSX语法

React使用JSX(JavaScript XML)语法,允许在JavaScript中编写类似HTML的标记,使UI代码更直观和易读。

5. 组件生命周期

React组件具有生命周期方法,允许开发者在组件不同的生命周期阶段执行操作,如组件挂载、更新、卸载等。这有助于处理数据加载、订阅事件、执行清理操作等任务。

6. 声明式编程

React采用声明式编程风格,开发人员只需要描述UI应该如何呈现,而不需要关心底层DOM操作。React会自动处理UI的渲染和更新。

7. 组件复用

React鼓励组件复用,你可以轻松地创建通用组件,然后在应用的不同部分重复使用它们。

8. 生态系统

React拥有庞大的生态系统,有众多第三方库和工具,如React Router用于路由管理、Redux用于状态管理、Material-UI用于UI设计等,这些库可以扩展React的功能。

9. 社区支持

React有一个活跃的社区,提供了大量教程、文档和社区插件,帮助开发人员更容易地学习和使用React。

React的这些特性使其成为一个强大的工具,适用于构建现代、高性能、可维护和可扩展的Web应用程序。它在前端开发中广泛应用,被许多公司和开发者所采用。

说说Real diff算法是怎么运作的,从tree层到component层到element层分别讲解?

Real-DOM Diff算法,通常称为Virtual DOM Diff算法,是React使用的一种高效的算法,用于比较两个虚拟DOM树(Virtual DOM Tree)之间的差异,并最小化对实际DOM的更新,从而提高性能。这个算法分为三个层次:Tree层、Component层、Element层。

  1. Tree层:在Tree层,Real-DOM Diff算法比较两个虚拟DOM树的根节点。它首先检查两个根节点是否具有相同的类型(例如,两者都是div元素),如果类型相同,则进一步比较其属性。如果类型和属性都相同,React会认为这两个根节点是相同的,不需要进行任何更新。如果类型不同或属性不同,React将认为需要替换整个根节点,从而触发实际DOM的更新。

  2. Component层:在Component层,React比较两个虚拟DOM树中的组件(Component)。React会递归地遍历组件的子节点,并比较它们之间的差异。如果两个组件的类型相同,React会继续比较它们的属性和子组件。如果属性相同,但子组件不同,React会递归比较子组件。如果属性不同,React将认为需要更新该组件及其子组件。这样,React会在尽可能深的层次上查找差异,以最小化实际DOM的更新。

  3. Element层:在Element层,React比较两个虚拟DOM树中的叶子元素(Element)。React会比较元素的类型、属性和文本内容。如果这些都相同,React将认为两个元素是相同的,不需要更新。如果有差异,React将更新实际DOM以反映这些差异。

Real-DOM Diff算法通过这三个层次的比较,可以高效地找到需要更新的部分,并最小化实际DOM的变更。它还可以在Diff过程中生成一系列的DOM操作指令(例如增加节点、删除节点、更新节点属性等),然后将这些指令批量执行,从而进一步提高性能。

总的来说,Real-DOM Diff算法是React的核心之一,它使React能够高效地管理和更新DOM,提供了快速响应用户交互的能力,同时尽可能减少了不必要的DOM操作,提高了性能。

调和阶段setState干了什么?

在React中,setState 是用来更新组件的状态(state)的方法之一。当调用 setState 时,React 将触发组件的重新渲染,以反映新的状态。React会将新的状态与旧的状态合并,而不是完全替换它。

在React的生命周期中,setState 调用的时机对于组件的更新非常重要。通常,setState 调用会在组件的更新阶段之后触发,而不会立即生效。React会将多个 setState 调用合并成一个更新,以提高性能。

React 的组件更新过程大致如下:

  1. 组件接收到新的 props 或调用了 setState

  2. React 会计划进行一次更新。

  3. React 在下一个“调和阶段”(Reconciliation Phase)中比较虚拟DOM树的差异,以找出需要更新的部分。

  4. React 更新真实DOM以反映新的虚拟DOM。

  5. 组件的生命周期方法被调用(例如,componentDidUpdate)。

在上述过程中,setState 的调用触发了更新,但实际的DOM更新在下一个调和阶段中完成。

这种异步更新的机制是为了提高性能,因为它可以合并多个状态更新,减少不必要的DOM操作。但需要注意,setState 调用并不会立即改变组件的状态,因此如果你想在状态更新后执行某些操作,应该在 componentDidUpdate 生命周期方法中进行。

说说redux的工作流程?

Redux是一种用于管理JavaScript应用程序状态的库。它的工作流程可以总结为以下几个步骤:

  1. Action创建:应用的各种操作和事件都会被抽象成一个个叫做"action"的普通JavaScript对象。这些对象描述了发生的事件,通常包括一个type属性来表示事件的类型,以及可选的其他数据。

  2. Dispatch:当应用中的某个部分需要更新状态时,它会创建一个相关的action对象,然后将该对象传递给Redux的store。这是通过调用store.dispatch(action)来完成的。

  3. Reducer处理:Redux的store将接收到的action对象传递给一个叫做"reducer"的纯函数。Reducer会根据action的类型来更新应用的状态。它接收先前的状态和action,然后返回一个新的状态。这一过程是纯函数,不会修改原始状态,而是返回一个新的状态副本。

  4. Store更新:一旦Reducer返回了新的状态,Redux的store将更新应用的状态。

  5. 通知订阅者:Redux支持订阅者模式,因此一旦状态发生变化,所有已注册的监听器(或称为订阅者)都会被通知。这使得应用的各个部分可以监听状态的改变,以做出相应的响应。

  6. View更新:React通常与Redux一起使用,以便将状态映射到UI组件上。当状态发生变化时,React会重新渲染相关的组件,从而更新用户界面。

Redux的工作流程强调了"单一数据源"(Single Source of Truth)的理念,即整个应用的状态被存储在一个单一的状态树中,这使得状态的管理变得可预测和可维护。通过分离状态的修改和UI的呈现,Redux提供了一种可维护和可测试的状态管理方法,特别适用于大型和复杂的应用程序。

为什么react元素有一个$$type属性?

React使用$$type属性来表示元素的类型,通常是一个字符串,表示HTML元素的标签名(如divp等)或React组件的类型(如自定义组件)。这有助于React在虚拟DOM的比较过程中快速确定元素的类型,以便进行高效的更新和渲染。

应用程序代码通常不需要访问或使用$$type属性,因为它是React内部的实现细节。开发者应该专注于使用React提供的公共API来创建、更新和渲染元素,而不必担心$$type属性。

在React的官方文档中,$$type属性是私有的,并没有被正式记录在文档中,因此不建议开发者在自己的应用程序代码中使用它。如果你需要获取元素的类型,可以使用type属性或element.type来访问。

React有哪些优化性能的手段?

React提供了多种性能优化的手段,以确保应用程序在大型和复杂的场景下也能保持高性能。以下是一些React性能优化的常见手段:

  1. 使用合成事件:React的合成事件系统能够提高性能,因为它使用事件委托,将事件监听器挂载在顶层容器上,而不是每个DOM元素上。这减少了事件监听器的数量,从而减小了内存和性能开销。

  2. 使用组件级别的shouldComponentUpdate或React.memo:通过shouldComponentUpdate方法或React.memo函数,可以控制组件的更新过程。这允许你避免不必要的重新渲染,只有在状态或属性发生实际变化时才重新渲染组件。

  3. 使用React的虚拟DOM:React使用虚拟DOM来比较前后两个状态树,从而最小化对实际DOM的操作。这减少了DOM操作的次数,提高了性能。

  4. 使用列表和键(Keys):在渲染列表时,使用唯一的键来标识每个列表项,以帮助React识别添加、删除或重新排序的操作。这有助于React更有效地管理列表的更新。

  5. 避免深层次的嵌套:过多的嵌套组件可能会导致性能问题。尽量保持组件层次扁平,只嵌套必要的组件。

  6. 使用React的Context API:Context API允许跨组件层次传递数据,而不必一层层地通过属性传递。这有助于避免不必要的属性传递,提高了代码的可维护性。

  7. 使用懒加载和代码拆分:将应用程序代码拆分成小块,按需加载,以减小初始加载时间。React懒加载的React.lazy()Suspense功能可用于按需加载组件。

  8. 使用生命周期方法或副作用钩子:合理使用componentDidMountcomponentDidUpdatecomponentWillUnmount等生命周期方法,以及useEffect等副作用钩子,以执行异步操作、订阅和取消订阅等操作。

  9. 使用生产模式:在生产环境中,确保使用React的生产模式版本,以去除开发模式下的额外检查和警告,提高性能。

  10. 性能监测和分析工具:使用性能监测工具,如React DevTools、Chrome DevTools的性能面板等,来识别和解决性能问题。

这些是一些通用的React性能优化手段,但具体的优化方法可能取决于应用程序的结构和需求。在实际开发中,可以使用这些方法来提高React应用的性能并确保良好的用户体验。

React render方法的原理,在什么时候会触发?

React的`render`方法是React组件用于渲染UI的核心方法,它定义了组件的输出内容。`render`方法的原理如下:

  1. 定义UI结构:在组件类中定义render方法,该方法返回一个描述组件UI结构的React元素(通常是JSX)。这个UI结构描述了组件的外观和结构。

  2. 虚拟DOM创建:当React组件的状态或属性发生变化时,React会重新调用render方法。这会生成一个新的虚拟DOM树,描述了组件的最新状态和UI结构。

  3. 虚拟DOM比较:React将新的虚拟DOM树与之前的虚拟DOM树进行比较,以确定需要进行哪些实际的DOM更新操作。

  4. DOM更新:React会根据虚拟DOM的差异,进行实际的DOM更新操作,以使DOM树与虚拟DOM树保持一致。

render方法会在以下情况下触发:

  1. 组件挂载:当组件首次挂载到DOM时,render方法会被调用以渲染初始UI。

  2. 组件更新:当组件的状态或属性发生变化时,render方法会被再次调用,以生成新的UI以反映这些变化。

  3. 强制更新:可以使用this.forceUpdate()方法来强制触发render方法,即使没有状态或属性的变化。

  4. 父组件更新:如果一个组件的父组件发生了更新,它的render方法也会被调用,以确保它的UI与父组件的变化保持一致。

需要注意的是,React的render方法是纯函数,它不应该有副作用,也不应该直接修改DOM。它的作用是描述组件的UI结构,而不是实际操作DOM。React负责将虚拟DOM的描述与实际DOM同步。

redux中同步action与异步action最大的区别是什么?

Redux中的同步action和异步action的最大区别在于它们处理动作(actions)的方式和触发时间:

同步Action

  • 同步action是指立即执行的操作,不涉及任何异步操作。

  • 同步action的动作创建函数(action creator)会立即返回一个包含动作类型和数据的action对象,通常使用dispatch函数触发。

  • 同步action用于处理立即执行的操作,例如用户点击按钮、输入框变化等。

  • 由于同步action是立即执行的,所以它们通常用于处理简单的状态变更,不需要等待异步操作的结果。

异步Action

  • 异步action是指涉及异步操作的动作,需要等待异步操作的结果,例如网络请求或定时任务。

  • 异步action的动作创建函数通常会返回一个函数,而不是一个包含动作对象的函数。这个返回的函数通常接受dispatchgetState作为参数,允许在异步操作完成后触发一个或多个同步action。

  • 异步action用于处理需要等待异步操作结果的情况,例如从服务器获取数据后更新应用状态。

总之,同步action用于立即触发状态变更,而异步action用于处理需要等待异步操作结果的情况。在Redux中,通常使用异步action来处理网络请求、定时任务等涉及异步操作的情况,以确保应用程序状态的一致性。同步action通常用于处理用户的交互操作和状态变更,它们不需要等待异步结果。

说说你对redux中间件的理解?常用的中间件有哪些?实现原理?

Redux中间件是一种用于扩展Redux的功能的机制,它允许你在Redux的dispatch过程中添加自定义的逻辑。中间件在Redux应用中的常见用途包括异步操作、日志记录、路由导航、状态持久化等。通过中间件,你可以在action被派发到reducer之前或之后执行一些额外的操作,以满足不同的需求。

Redux中间件的主要原理是基于函数的洋葱模型(Onion Model),它允许你在Redux流程的不同阶段添加自定义逻辑,这些逻辑会按顺序执行。Redux中间件通常由一个函数构成,该函数返回一个函数,这个返回的函数接受store.dispatchstore.getState等参数,然后返回一个新的dispatch函数。这个新的dispatch函数可以拦截、修改、延迟或增强action派发的过程。

常用的Redux中间件有:

  1. redux-thunk:允许你派发函数而不仅仅是普通的action对象,这使得处理异步操作变得容易。当你需要执行异步操作时,可以返回一个函数,该函数接收dispatchgetState作为参数,然后可以在异步操作完成后再次派发action。

  2. redux-saga:基于ES6生成器的中间件,用于处理复杂的异步操作、副作用和并发流。它允许你以声明性的方式管理和监视action的流,处理各种复杂的异步任务。

  3. redux-logger:用于在控制台中记录Redux操作和状态的中间件,用于开发和调试过程。

  4. redux-persist:用于将Redux状态持久化到本地存储,以便应用程序在重新加载时保持状态。

  5. redux-observable:基于RxJS的中间件,用于处理异步操作和副作用。它允许你使用RxJS的强大功能来管理和监视action流。

Redux中间件的实现原理是基于函数的装饰器模式,它通过包装store.dispatch方法,来拦截和处理action。中间件的核心是一个函数,该函数接受store.dispatch作为参数,并返回一个新的函数,这个新函数会在派发action时执行额外的逻辑。这使得中间件可以在不改变Redux核心逻辑的情况下,添加各种自定义功能。

说说你对@reduxjs/toolkit的理解?和react-redux有什么区别?

@reduxjs/toolkit是一个Redux官方推荐的工具集,它的主要目的是简化和加速Redux开发流程,提供了一组工具和约定,以减少样板代码和提高开发效率。下面是我对@reduxjs/toolkit的理解以及它与react-redux之间的区别:

@reduxjs/toolkit的特点和理解

  1. Redux简化@reduxjs/toolkit减少了编写Redux的样板代码的工作,包括定义action和reducer,以及配置store。它提供了一个更简洁的方式来创建和组织Redux相关的代码。

  2. 包含Redux工具@reduxjs/toolkit内置了许多有用的Redux工具,如createSlice用于创建Redux模块、configureStore用于配置Redux store,以及createAsyncThunk用于处理异步操作。

  3. 不需要手动处理不变性@reduxjs/toolkit内部使用了Immer库,允许你编写可变的Redux reducer代码,而不需要手动处理深层复制和不变性。这简化了Reducer的编写。

  4. 默认配置@reduxjs/toolkit为你提供了一个合理的默认配置,减少了配置和样板代码的需要。你可以根据需要自定义配置。

  5. 强调最佳实践@reduxjs/toolkit鼓励使用最佳实践,如组织代码、分割reducers、使用异步action等。

区别

  • @reduxjs/toolkit是Redux的辅助工具集,用于简化和加速Redux开发,但它仍然是Redux的一部分。它并不是独立于Redux的状态管理库。

  • react-redux是React应用程序中与Redux集成的库,它提供了React组件和Redux store之间的连接机制,允许你将Redux store中的状态传递给React组件,以及将Redux action派发给Redux store。react-redux是与React紧密集成的,而@reduxjs/toolkit与Redux本身更相关。

  • @reduxjs/toolkit通常用于简化Redux的配置和开发过程,而react-redux用于在React应用中连接React组件与Redux store。这两者通常一起使用,但它们有不同的目的和关注点。

React都有哪些hooks,如何使用?

1)useState:用于在函数组件中使用状态(state)。它返回一个数组,第一个元素是当前状态的值,第二个元素是更新状态的函数。可以通过调用这个函数来更新状态的值。

2)useEffect:用于在函数组件中执行副作用操作,例如网络请求、订阅事件等。它在组件渲染完成后执行,并且可以通过指定依赖项来控制何时执行或清理副作用。

3)useContext:用于在函数组件中使用上下文(context)。它接收一个上下文对象,并返回该上下文的当前值。

4)useRef:用于在函数组件中创建可变的引用。它返回一个可变的 ref 对象,可以将其与 DOM 元素或其他组件实例关联起来。

5)useMemo:用于在函数组件中进行记忆化计算。它接收一个函数和一个依赖数组,并返回函数的计算结果。只有在依赖项发生变化时,才会重新计算结果。

6)useCallback:用于在函数组件中创建记忆化的回调函数。它接收一个回调函数和一个依赖数组,并返回一个记忆化的回调函数。

7)useReducer:用于在函数组件中管理复杂的状态逻辑。它接收一个 reducer 函数和初始状态,并返回当前状态和 dispatch 函数,用于派发状态更新的操作。

8)useRef:用于在函数组件中创建可变的引用。它返回一个可变的 ref 对象,可以将其与 DOM 元素或其他组件实例关联起来。

说说你对受控组件和非受控组件的理解?应用场景?

受控组件和非受控组件是 React 中两种主要的表单组件设计模式。

受控组件是指受到 React 的控制,表单元素的值从 React 层传递到 DOM 中,并通过回调函数通知 React 进行任何状态的更改,从而保持组件状态和表单元素的状态同步。这样,React 是唯一具有表单中的数据源。要创建受控组件,必须为表单的值添加更改处理程序,并将表单的值绑定到 React 组件的状态。在受控组件中,表单数据始终保留在 React 组件的状态中,因此 React 能够控制表单的状态变化,数据以及更新操作。实现受控组件需要更多的代码,但可以更加准确地控制表单的行为和状态,从而提高应用程序的可维护性和可靠性。

非受控组件则不受 React 的控制,通过维护自己的状态和处理器,从 DOM 读取表单元素的值(可以使用 React 的 ref 属性来获取表单元素的引用)。非受控组件因为不依赖 React 的状态管理,所以通常代码量比受控组件更少,但是也意味着更难以预测或调试组件的状态;同时,非受控组件允许开发者以传统的 HTML 表单方式来完成设计,对于处理简单的表单非常方便,但处理复杂表单需要谨慎,因为需要手动处理表单状态以及实现验证、提交等操作。

一般来说,使用受控组件来处理表单数据,可以更好地控制表单的行为和状态,并通过渲染表单数据的方式使表单可预测、可靠。但是,如果表单较为简单且不需要过于精细的控制,或者由于特定的限制需要使用非受控组件,则可以使用非受控组件。总的来说,对于 React 开发人员而言,了解双方的优缺点并知道何时选择使用哪种类型的组件,对于编写更具条理和性能的代码是极为关键的。

重绘和回流(重排)是什么,如何避免?

重绘和回流是与网页性能和渲染相关的两个概念

重绘指的是当元素样式改变,但不影响其布局的情况下,浏览器重新绘制该元素的过程。例如,改变元素的背景颜色或字体颜色时会触发重绘。

回流指的是当页面布局发生变化导致需要重新计算元素的几何属性(如位置、大小等)并重新布局时的过程。例如,改变元素的宽度、高度、边距等会触发回流。

重绘和回流是耗费性能的操作,因为它们涉及到重新计算元素的样式和布局。大量的重绘和回流会降低网页的性能,导致页面卡顿和加载缓慢。

为了避免频繁的重绘和回流,可以采取以下一些优化措施:

  1. 使用 CSS3 的 transform 和 opacity 属性:这些属性可以使用 GPU 加速,减少重绘和回流的开销。

  2. 避免频繁地改变样式:如果需要对多个样式进行修改,尽量通过添加或删除 CSS 类来实现,而不是直接修改元素的样式。

  3. 在 DOM 元素之外进行操作:将要插入或修改的元素先脱离文档流,进行处理后再插入回文档流,这样可以减少回流次数。

  4. 批量更新样式:如果需要对多个元素进行样式修改,可以将这些修改操作放在一个 JavaScript 函数中,将多次修改合并为一次,减少重绘和回流的次数。

  5. 使用 documentFragment 进行批量 DOM 操作:将需要插入到页面中的元素先添加到 documentFragment 中,然后再一次性插入到页面中,避免频繁的回流。

  6. 使用 CSS3 动画代替 JavaScript 操作:CSS3 动画可以使用 GPU 加速,比使用 JavaScript 实现的动画效果更高效。

总的来说,避免频繁的修改样式和布局,尽量进行批量处理和合并操作,可以有效减少重绘和回流带来的性能问题,提升页面的渲染性能。

为什么 useState 返回的是数组而不是对象

useState 返回的是一个数组而不是对象,是为了保持与 React 的 Hooks API 设计的一致性。

Hooks 是在 React 16.8 版本引入的新特性,它可以让函数组件具有状态和其他 React 功能。为了能够在函数组件中使用状态,useState 是最常用的 Hook 之一。而返回数组的方式是为了简化使用,并且保持与其他 Hooks 的一致性。

返回一个数组有一些优点:
1. 索引的语义清晰:通过使用解构赋值将数组元素分配给具有可读名称的变量,可以直观地读取和修改状态。
2. 数组解构是一种常见的 JavaScript 语法:很多开发者熟悉使用数组进行解构操作,这样更加易于理解和实践。
3. 函数签名简单:useState 接收初始状态作为参数,并返回一个包含当前状态和状态更新函数的数组。这种方式既简洁又直观。

虽然返回数组而不是对象,但我们可以根据需要给数组中的元素取名,以使其具有更具描述性的语义。

需要注意的是,返回数组的方式可能不够直观,特别是当状态较多时,代码的可读性可能会受到一定的影响。在这种情况下,可以考虑使用 useContext 来共享对象状态,或者自定义钩子来实现更复杂的状态管理。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/598167.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

Python split()方法详解:分割字符串

Python 中,除了可以使用一些内建函数获取字符串的相关信息外(例如 len() 函数获取字符串长度),字符串类型本身也拥有一些方法供我们使用。 注意,这里所说的方法,指的是字符串类型 str 本身所提供的&#x…

[每周一更]-(第80期):分析源码flag,配合示例展示用法

Go 语言标准库中的 flag 包提供了一套简单而又强大的命令行参数解析工具。以下是对 flag 包源码的一些关键点的解析: FlagSet 结构体: FlagSet 是 flag 包的核心结构体,用于表示一组命令行参数。它包含了一个存储命令行参数的 map&#xff…

neutron 安全组代码实现(一)

最近在学习neutron 安全组相关逻辑,所以梳理一下neutron关于安全组的具体代码实现,下面是neutron创建安全组时的代码,总体来说所有service的创建流程是一样的 创建安全组 #neutron --debug security-group-create sg-debug-can-deletecurl …

酷开科技 | 酷开系统9.2,开启个性化时代

现代人,总喜欢不走寻常路,以彰显自己的不同。酷开系统的个性化推荐就能满足你的这类需求,既能给你想要的内容,又能给你与众不同的体验! 想听音乐了?打开酷开系统音乐频道,随机播放为你推荐的歌曲…

springboot devtools实现热部署

1.配置devtools依赖 <dependency><groupId>org.springframework.boot</groupId><artifactId>spring-boot-devtools</artifactId><scope>runtime</scope><optional>true</optional></dependency>2.配置maven插件&…

语音遥控器2-语音功能实现

语音语义识别方案我们采用的是思某驰。 调查了一下语音相关代码&#xff0c;不管腾某讯&#xff0c;还是思某驰&#xff0c; 一般都会涉及到以下几个部分的工作&#xff1a; 对接语音识别SDK Sdk对接主要是密钥&#xff0c;认证&#xff0c;消息的处理&#xff1b; 方案采…

【四】CocosCreator-修改引擎源码

看源码的过程中&#xff0c;少不了得修修改改源码&#xff0c;做点实验。果断去找找源码在哪里&#xff0c;然后就可以快乐动手改源码了。 CocosCreator引擎源码主要就是js和原生C两类&#xff0c;分别在引擎目录的resources/engine和resources/cocos2d-x下&#xff0c;如图&am…

WEB 3D技术 three.js 法向量演示性讲解

本文 我们来说法向 法向 又叫 法向量 就是 我们一个三维物体 顶点垂直于面 的方向 向量 他的作用 用来做光反射 根据光照的方向 根据面进行反射 我们上文写的这个代码 import ./style.css import * as THREE from "three"; import { OrbitControls } from "…

springcloud之Feign超时提示Read timed out executing POST

问题描述&#xff1a; Feign接口调用分两层&#xff0c;Ribbon的调用和Hystrix调用&#xff0c;理论上设置Ribbon的时间即可&#xff0c;但是Ribbon的超时时间和Hystrix的超时时间需要结合起来&#xff0c;按照木桶原则最低的就是Feign的超时时间&#xff0c;建议最好配置超时…

R语言频率分布直方图绘制教程

本篇笔记分享R语言绘制直方图的方法&#xff0c;通过多种展示风格对数据进行可视化&#xff0c;主要用到ggplot、ggpubr等包。 什么是直方图&#xff1f; 直方图(Histogram)&#xff0c;又称质量分布图&#xff0c;是一种统计报告图&#xff0c;由一系列高度不等的柱子表示数据…

openCV入门

简介 本文主要通过对啥都会一点研究生系列进行总结&#xff0c;对关键代码进行注释&#xff0c;方便使用以及复习。 1 基础功能 1.1.显示图片 import cv2 # 读取图片 img cv2.imread("Resources/lena.png") # 显示图片 cv2.imshow("Lena Soderberg",img…

【Java集合类篇】HashMap的数据结构是怎样的?

HashMap的数据结构是怎样的? ✔️HashMap的数据结构✔️ 数组✔️ 链表 ✔️HashMap的数据结构 在Java中&#xff0c;保存数据有两种比较简单的数据结构: 数组和链表&#xff08;或红黑树&#xff09;。 HashMap是 Java 中常用的数据结构&#xff0c;它实现了 Map 接口。Has…

STM32 CubeMX产生的程序架构

使用STM32CubeMX产生启动相关代码&#xff0c;配置各种外设。在后续程序开发过程中&#xff0c;有可能使用STM32CubeMX逐步产生使用的代码&#xff0c;为了将其产生的代码和我们程序隔离&#xff0c;一种可行的程序架构如下&#xff1a; 在此架构中&#xff0c;STM32CubeMX产生…

GraphQL和REST API的区别

我的新书《Android App开发入门与实战》已于2020年8月由人民邮电出版社出版&#xff0c;欢迎购买。点击进入详情 GraphQL&#xff08;Graph Query Language&#xff09;和REST&#xff08;Representational State Transfer&#xff09;是两种用于构建和设计API的不同方法。以下…

【设计模式之美】理论一:怎么才算是单一原则、如何取舍单一原则

文章目录 一. 如何判断类的职责是否足够单一&#xff1f;二. 类的职责是否设计得越单一越好&#xff1f; 开始学习一些经典的设计原则&#xff0c;其中包括&#xff0c;SOLID、KISS、YAGNI、DRY、LOD 等。 本文主要学习单一职责原则的相关内容。 单一职责原则的定义&#xff1a…

电脑屏幕一直闪烁怎么解决?三大妙招还你清晰视野

电脑屏幕闪烁一直是困扰用户的一个问题&#xff0c;它会影响到用户的使用体验&#xff0c;甚至可能导致眼睛疲劳和头痛。可是电脑屏幕一直闪烁怎么解决呢&#xff1f;在本文中&#xff0c;我们将介绍三个解决电脑屏幕闪烁的方法&#xff0c;从简单的软件调整到硬件检测&#xf…

亚马逊图片上传后变模糊怎么办?亚马逊图片优化指南—站斧浏览器

亚马逊图片上传后变模糊怎么办&#xff1f; 使用高分辨率图片&#xff1a;亚马逊建议卖家使用至少1000 x 1000像素的高分辨率图片。如果您上传的图片分辨率较低&#xff0c;亚马逊系统可能会将其自动调整为较小的尺寸&#xff0c;导致图片模糊。因此&#xff0c;确保您使用高质…

对JAVA行业的深度思考职业规划

JAVA行业的发展趋势 首先&#xff0c;随着移动互联网的快速发展&#xff0c;移动应用程序的需求也越来越大。在这个领域&#xff0c;Java一直是主要的开发语言之一&#xff0c;特别是在Android平台上。然而&#xff0c;随着谷歌推出了Kotlin语言作为Android开发的首选语言&…

Vue3.0+Echarts (可视化界面)

Vue3.0Echarts &#xff08;可视化界面&#xff09; 1. 简介2. 安装2.1 下载安装Node.js2.2 全局下载项目脚手架2.3 创建项目 1. 简介 2. 安装 2.1 下载安装Node.js 2.2 全局下载项目脚手架 以管理员身份执行 npm install -g vue/cli vue --version2.3 创建项目 vue crea…

读书之unix环境高级编程_简单笔记1(初步)

手头有比较多的技术书籍&#xff0c;弃之可惜&#xff0c;放之惭愧&#xff0c;借助空闲时间&#xff0c;先草读&#xff0c;再demo整理。 unix环境高级编程 草读简单整理&#xff0c;为下一步整理细节技术点做准备&#xff08;仅个人笔记&#xff09;。 基本的文件操作&…