React.JS面试题和答案 - [ JavaScript框架面试题 ]

React.JS面试题和答案

React.JS是JavaScript的用户界面构建库。 借助此React.JS,用户甚至可以从小块的隔离数据中非常有效地定义和构建复杂的用户界面。可以构建用户界面的各种组件,例如输入控件,导航组件以及信息组件。

1. React.JS中的参考(Refs)是什么?

参考(Refs)用于管理焦点,选择文本和触发动画。 它还与第三方库集成。 参考(Refs)有助于获取对DOM(文档对象模型)节点的引用。 它们返回引用的节点。 每当需要DOM测量时,我们都可以使用refs。详细答案>>

2. React.JS中render()函数的用途是什么?

render()函数用于更新UI。 为此,您需要创建一个新元素并将其发送到ReactDOM.render()。 React元素是不可变的,一旦创建了元素,就无法更改其属性。 因此,元素就像一个单独的框架,它在某个时刻描绘了UI。 ReactDOM.render()控制您传递的容器节点的内容,如果其中已存在任何DOM元素,则在首次调用时将替换它。详细答案>>

3. ReactJS中箭头函数的用途是什么?

箭头函数对React操作非常重要。 它可以防止这个错误。 箭头函数使得在作为回调传递时更容易预测此错误的行为。 它们不会在其函数体内重新定义它的值。 因此,防止在回调中使用此错误导致的错误。详细答案>>

4. React.JS与Angular.Js和VUE.js有什么区别?

Angular.Js - 由Google开发,angular是一个基于打字稿的JavaScript应用程序框架。它也被称为超级英雄JavaScript MVW框架。它的开发是为了应对创建单页面应用程序的挑战。角度有几种版本,例如Angular 2 +,Angular 2或ng2。 Angular是AngularJS的重写,主要是不兼容的继承者,这意味着AngularJS是最古老的框架。 React.js - React由Facebook于2013年3月开发。它是一个用于构建用户界面的JavaScrip...详细答案>>

5. flux与redux有什么区别?

flux与redux有以下区别 - flux redux Flux是注册到回调的应用程序状态和逻辑的容器。 Redux是JavaScript应用程序的容器。 Flux是一个被修改为适合React的观察者模式。 它提供了一些有趣的功能,例如编写应用程序,在服务器,客户端等不同环境中进行测试。 它是观察者模式的一个奇特的名称,Facebook已经开发了工具来帮助实现这些模式。 在redux中,动作可以是函数或promises。 Flux支持简单JavaScript对象的操作。 Re...详细答案>>

6. React.JS中的受控组件和不受控制的组件是什么?

受控组件更可取使用,因为它更容易在其中实现表单。 在此,表单数据由React组件处理。 受控输入接受值作为props和回调来更改该值。不受控组件是受控组件的替代品。 这里表单数据由DOM本身处理。 在不舒服的组件中,ref可用于从DOM获取表单值。详细答案>>

7. 功能组件和类组件有什么区别?

功能组件是那些返回React元素的组件。 这些只是简单的旧JavaScript函数。 React 0.14为创建简单的无状态组件(称为功能组件)提供了新的捷径。 这些组件使用简单的JavaScript函数。 类组件 - 大多数精通技术的人都更熟悉类组件,因为他们已经走了很长一段时间。 这些组件使用普通的旧java对象以相同的方式创建页面,混合等。 使用React创建类工厂方法,在定义新组件的方法时传递文字。详细答案>>

8. 你对React.Js中的mixin或更高阶组件有什么了解?

高阶组件(HOC)是一个获取组件以及返回组件的函数。 它是React中的一种现代技术,它重用了组件逻辑。 但是,高阶组件本身不是React API的一部分。 这些是React的组成性质所产生的模式。 换句话说,HOC是循环的函数,并将函数应用于数组中的每个元素。详细答案>>

9. 合成事件(SyntheticEvent)是什么?

SyntheticEvent是浏览器本机事件的跨浏览器包装器。 在React中,所有事件处理程序都将传递SyntheticEvent的实例。合成事件的工作方式与浏览器的事件系统相同,唯一的区别是相同的代码将适用于所有浏览器。下面是一个演示如何在react中侦听click事件的简单示例 - import React, { Component } from 'react'; class ShowAlert extends Component { showAlert() { ...详细答案>>

10. React.JS中Dom和虚拟Dom有什么区别?

DOM是文档对象模型(Document Object Model)的首字母缩写。 Dom也称为HTML DOM,因为它是Web开发人员称为HTML的结构化代码的抽象。 Dom和HTML代码是相互关联的,因为HTML的元素被称为DOM的节点。 它定义了一个用户可以创建,更改,修改文档及其中存在的内容的结构。 因此,虽然HTML是文本,但DOM是此文本的内存表示形式。虚拟DOM是抽象的抽象,因为它是从HTML DOM派生的。 它是DOM对象的表示,如轻量级副本。 虚拟DOM不是由React发明的,它只是免费...详细答案>>

11. React.JS的优缺点分别是什么?

Web开发人员使用React.js创建大型网页而无需重新加载整个页面。 它使用数据并可以随时更改。 以下是使用React.js的优点 1 - React使搜索引擎优化(SEO)变得简单。2 -它非常高效,因为它确保了可读性和易维护性。3 -它为Web开发人员提供了非凡的开发人员工具,使Java编码更容易。4 - UI测试用例。 以下是React.js的缺点 1 - 将React js与传统MVC框架集成需要一些主要配置,例如用eract.js替换erb。2 - 对于刚接触Web开发世界的人来说,这是一个...详细答案>>

12. React.js是什么?

React。js是在Facebook开发的基于javascript的UI库,用于创建交互式,有状态和可重用的UI组件。 它是为处理Web和移动应用程序的表示层而创建的最流行的javascript框架之一。

详细答案>>

13. React.Js的优点是什么?

React.js非常高效:React.js创建了自己的虚拟DOM,其中组件实际存在。这种方法为您提供了极大的灵活性和惊人的性能提升。 React.js还计算了DOM中需要进行的更改。 React.js的这个过程避免了昂贵的DOM操作,并以非常客户端的方式进行更新。 它使编写Javascript更容易:React.js使用一种称为JSX的特殊语法,它允许您将HTML与Javascript混合。用户可以在渲染函数中删除一些HTML,而不必连接字符串,这是另一个奇妙的事情。 React.js将这些HTML转换...详细答案>>

14. React.JS中的组件是什么?

React组件允许将UI拆分为独立的,可重用的部分,并单独考虑每个部分。从概念上讲,组件就像JavaScript函数。 它们接受任意输入(称为“道具”)并返回描述屏幕上应显示内容的React元素。 下面是用ES6类编写的大量组件,用于在屏幕上显示欢迎消息。 class Welcome extends React.Component { render() { return <h1>Hello, {this.props.name} </h1>; } } const ...详细答案>>

15. JSX是什么?

JSX是一种类似XML/HTML的语法,它使用React扩展ECMAScript,以便类似XML/HTML的文本可以与JavaScript/React代码共存。 该语法旨在被预处理器(即像Babel这样的转换器)用于将JavaScript文件中的类似HTML的文本转换为JavaScript引擎将解析的标准JavaScript对象。 基本上,通过使用JSX,可以在编写JavaScript代码的同一文件中编写简洁的类似HTML/XML的结构(例如DOM,如树结构),然后Babel会将这些表达式转换为实际的J...详细答案>>

16. 请解释React.JS组件的生命周期?

React.JS组件生命周期每个组件都有几个“生命周期方法”,您可以覆盖这些方法以在流程中的特定时间运行代码。 在发生事件之前调用带有前缀的方法,并在发生事件后立即调用带有前缀的方法。 安装 在创建组件的实例并将其插入DOM时,将调用这些方法: constructor()componentWillMount()render()componentDidMount() 更新 props 或 state 的更改可能导致更新。 当组件重新启动时调用这些方法 - componentWillReceivePr...详细答案>>

17. React.JS的功能特性有哪些?

毫无疑问,今天React.js是最好的JavaScript UI框架之一。 它具有许多功能,可以帮助程序员轻松创建漂亮的应用程序,在下面列出了其中一些 - 它是适应性自由开源来自ES7的装饰器服务器端通信异步函数和生成器通量库解构分配JSX的用处详细答案>>

18. 如何在React.JS中使用事件?

使用事件是React.js非常类似于处理DOM元素上的事件。区别仅在于语法。 事件的名称是React.js总是在camelCase中。使用JSX,可以将函数作为事件处理程序而不是字符串传递。 让我们通过一个例子来理解: // In HTML <button onclick="activateAccount()"> Activate Account </button> //In React <button onClick={activateAccou...详细答案>>

19. JavaScript中的 Flux 是什么?

Flux是一个用于在JavaScript应用程序中创建数据层的应用程序架构。它是在Facebook上与React视图库一起设计的。Flux不是框架或库。 它只是一种新型架构,它补充了React和单向数据流的概念。进一步阅读 https://scotch.io/tutorials/getting-to-know-flux-the-react-js-architecture详细答案>>

20. ReactJS中有哪些无状态组件?

无状态组件是没有任何状态的组件。 当某些东西是无状态时,它会计算它的内部状态,但它永远不会直接改变它。用于创建无状态组件不需要类和此关键字。您可以使用普通函数或Es6箭头函数创建无状态组件。 下面是无反应中无状态组件的示例。 //In Es6 const Pane = (props) => {props.children} ; //In Es5 const Username = ({ username }) => 详细答案>>

21. React.Js中State和props有什么区别?

props是属性的简写。它们非常类似于将参数传递给纯javascript函数。 组件的props从调用组件的父组件传递。 在组件的生命周期中,props不应该将它们视为不可变。在React中,可以使用this.props访问所有props。 示例代码: import React from 'react'; class Welcome extends React.Component { render() { return <h1>Hello {this.props....详细答案>>
注: 此试题仅作为相关知识水平测试,不能作为权威试题和答案。非商业转载注明原文链接即可;商业转载需本站授权同意。