理解React vs React Native 理解React和React Native

我们人类会对很多事情感到困惑。困惑可能是基于事物的不同特点而产生的。与不同事物混淆的最常见方法就是它们的名称。

人们首先会了解一个新事物的名称。无论是另一个人、动物、产品、软件等等，他们都会通过名称搜索，然后了解不同的特点、应用、历史等等。

为什么会是这样呢？

是的，人们经常对术语(名称) React 和 React Native感到困惑。如果非技术人员看到名称 React 和 React Native，他们在大多数情况下会认为Reactive Native是React的扩展。即使一些技术人员在这些领域没有任何知识，他们也可能以同样的方式思考。

那些东西到底是什么？为什么人们经常对它们感到困惑，而不是其他东西？

React和React Native是两个框架。这些名称看起来相似，中间添加了一个额外的单词。所以，人们经常因为一瞥到它们的名称而感到困惑。如果你有同样的困惑，那么你来到了解开它们背后的谜题的正确地方。

让我们找出答案。

React

React是一个用于构建单页Web应用程序的JavaScript库。它是用于Web的构建用户界面(前端)最流行的库之一。我们甚至可以说它是目前最受欢迎的库。它由Facebook创建和维护。它也被称为ReactJS。

由于我对React有经验，我可以说它非常美观且易于学习和构建。它是一个库。因此，我们可以通过利用其特性按照自己的意愿构建任何我们想要的东西。在使用React开发应用程序时，没有严格的规则需要遵循。因此，我们将拥有自由。

React有很多很酷的特性。让我们来看看它们。

#1. 组件

在React中，一切都是组件。它就像Web应用程序的构建模块。我们可以通过组合小组件来形成大组件。每个组件都有自己的状态和控制。组件控制用户界面，并根据其状态决定向用户显示什么。

组件是React中的一切。它们是可重用的。只需编写一次，然后在任何地方使用。

我们需要非常小心地编写组件。当我们的应用程序增长时，这将使得维护变得容易。如果我们在一个组件中编写了大量代码，最终它将成为我们维护的负担。React组件应该小而精炼。它们既可以是开发者的天堂，也可以是地狱。

#2. 虚拟DOM

你应该曾经在按钮内部看到过类似加载器的东西。在社交媒体平台上，当你按下按钮时，点赞的数量会立即增加。在Web的早期，我们必须重新加载整个页面才能获取信息。但是现在只需要更新需要更新的部分，其他部分将不受影响。这是怎么回事？

正如我们之前所看到的，React中的一切都是组件。浏览器为Web应用程序的元素维护DOM结构。当Web应用程序的一部分需要更新时，我们必须使用DOM操作进行更新。React以高效的方式执行相同的操作。

React为其所有组件创建一个虚拟DOM( DOM的副本)。为了更新Web应用程序中的某些内容，React将真实DOM与虚拟DOM进行比较。如果有任何更改，React就会触发组件的更新。

#3. 单向数据流

如果没有数据流，我们无法将大量组件划分为较小的组件。组件之间必须有一些数据流动的方式。

React允许我们在单个方向上将数据从一个组件传递到另一个组件。数据从父组件流向子组件。子组件无法更新数据。无法将数据发送回父组件，因为数据流是单向的。

你可能会觉得它不是多向数据流。但是，单向数据流使我们对多向数据流有更多的控制。

概述

还有许多其他功能，如JSX、条件渲染等；它们是次要的。我们已经了解了React library的主要功能。在使用React构建应用程序时，我们几乎可以构建任何类型的Web应用程序。React社区非常庞大。你可以找到很多用于React的包。

React Native

React Native是一个用于开发跨平台移动应用程序的框架。它也是由Facebook创建和维护的。

你们中的大多数人可能会对上述陈述感到惊讶。

我们能用一个框架为Android和IOS开发应用程序吗？

如果你没有关注科技界的最新动态，那么你可能不会知道。是的，我们可以使用React Native创建跨平台（Android和IOS）应用程序。还存在其他用于跨平台应用程序开发的框架。

React Native是同类框架中最受欢迎的之一。它并不是因为JavaScript在原生应用程序中的限制而成为最受欢迎的框架。但是，在开发领域中它独具光彩。即使像Facebook、Instagram、Flipkart等大公司也在使用它。这并不意味着你应该使用它。这意味着我们可以使用React Native构建跨平台的生产级应用程序。

在上一段中，我使用了一个称为原生应用程序的词组。它们是什么？这不是一种新类型的应用程序。原生应用程序是专门为特定平台创建的应用程序。Android手机的Android应用程序，iPhone手机的IOS应用程序，Windows应用程序的Windows应用程序等等。

React Native中的原生是什么意思？React Native根据我们的意愿为Android和IOS创建了一个适合两者的原生应用程序。使用React Native开发的应用程序与Android Studio（用于Android）和IOS类似。

也许创作者因此将其命名为React Native。这不是事实。

谈到React Native的功能，有一堆等待我们的功能。让我们看看其中一些主要功能。

#1. 跨平台

我们可以使用单个代码库同时为Android和IOS创建移动应用程序。这为公司节省了大量的时间和金钱。

#2. 热加载或实时重新加载

如果你有React或React Native应用程序的经验，那么你可能已经知道这个功能。当我们改变代码时，该功能将使用新的更新重新加载整个应用程序。我们不必每次改变代码时都按重新加载按钮。更新代码并查看更改。就是这样。除非有错误，否则我们不必等待任何东西。

对你来说，这可能是一个次要功能。但是，如果你是从没有框架的Android开发转来的，你就会理解在React Native中这个功能的价值。

#3. UI库和社区

React Native中有许多内置的原生组件。我们可以直接使用它们，无需任何额外的设置或安装。原生组件在各自的平台上看起来很原生。React Native应用程序的UI与IOS原生UI以及Android原生UI相匹配。React Native具有类似于React的组件。

而当谈到社区时。它非常庞大并且不断增长。当你陷入困境时，你可以从社区中轻松获得帮助。

概述

您可以在互联网上找到React Native的许多其他功能。如果您要进行移动应用开发，也可以探索它们。前端开发人员还可以使用React Native开发原生应用程序。它使跨平台移动应用程序的开发变得容易。

React与React Native的区别

React和React Native在某些方面是相似的，也有一些不同。让我们来看看它们。

就React和React Native的应用而言，它们彼此之间完全不同。但就原理而言，它们看起来是相似的。React和React Native都有组件。它们在各自的开发中遵循相同的原则。

它们都使用JavaScript语言进行开发。让我们看一个在这两个框架中的简单的Hello, World应用程序。

React

import React, { Component } from 'react';
import './App.css';
 
class App extends Component {
  render() {
    return (
      
        Hello, Wolrd!
      
    );
  }
}
 
export default App;

React Native

import React from 'react';
import { Text, View } from 'react-native';

const App = () => {
  return (
    
      Hello, world!
    
  )
}
export default App;

如您所见，它们都使用React包。由于它们使用一种称为JSX的特殊标记语言，因此两个应用程序的语法看起来相似。但就渲染部分而言，它们使用了不同的东西。React使用虚拟DOM，而React Native使用原生API进行UI渲染。

对于React应用程序的语句管理，有一些外部包，如Redux、MobX等。这些包也可以在React Native应用程序中使用。

React和React Native都使用JavaScript。因此，我们几乎可以在两者中使用每个JavaScript包。这为它们的包库添加了许多包。

React和React Native彼此相关，但用途不同。

总结

React和React Native在最终产品和应用程序平台方面有所不同。但是，在各自应用的开发中，它们遵循相似的原则。如果您可以学习其中一个框架，React或React Native，那么您可以加快学习另一个框架的速度。但是，React的知识对于React Native应用程序的开发是必需的。但对此还不够。我们需要更多了解原生应用程序的开发，因为React Native的支持有限。

希望它最终会在未来得到全面支持。

如果您想开始学习Web或mobile applications development，那么选择React或React Native将对您未来有很大的好处。但这不是强制的。

如果您know JavaScript，学习React的概念将变得轻而易举。官方文档将是您开始学习React或React Native的重要资源。

祝您学习愉快 🙂

理解React vs React Native 理解React和React Native