在学习React Native之前你应该学习什么

前端小工
1,090 阅读7分钟

简介

如果你想让你的开发者生涯更上一层楼，你需要在你的工具带里有React和React Native。使用跨平台框架创建移动应用已经成为当今的发展潮流。像React Native这样的跨平台应用框架可以帮助你开发在安卓和iOS设备上运行的本地移动应用。

在本指南中，我将列出你在开始使用React Native之前应该掌握的技术和技能。

什么是React Native？

React Native是一个JavaScript框架，用于构建跨平台、原生渲染的应用程序。它是基于Facebook创建的React库。与React类似，React Native用于构建用户界面组件，但有一个额外的好处。React Native可以在不同的平台上渲染用户界面，而不仅仅是在浏览器上。除了基于网络的应用程序，React Native还可以用来为安卓、iOS、macOS和Windows构建应用程序。

React Native为构建UI组件提供了一套标准的API，从而使开发者能够只写一次代码，并在多个平台上运行。React Native对于有网络开发背景的人来说非常容易学习。

了解React的开发者可以针对React Native支持的任何平台构建应用程序。HTML、CSS和JavaScript是网络的核心技术，学习React需要这些技术。React纯粹是用JavaScript编写的，有一些类似HTML的语法，称为JSX，用于创建UI组件。使用CSS，你可以通过应用各种样式规则来设计用户界面组件。React Native也需要同样的技能，因为它是基于React的。

现在，让我们仔细看看这些技术，以便你能更好地了解在学习React Native之前应该如何准备。

HTML和CSS

HTML和CSS是网页开发的核心技术。HTML是创建网页元素和布局的骨架，而CSS则为这些不同的元素和布局添加样式。掌握HTML和CSS是至关重要的一步，因为这将是你学习以下其他技术（以及一般的网络开发）的基础。

学习HTML和CSS的资源

JavaScript

一旦你对HTML和CSS感到满意，你就可以开始学习JavaScript。JavaScript是一种脚本语言，它允许你在你的网页上添加互动和逻辑。使用JavaScript，你可以 "监听 "按钮点击或输入焦点等事件，并为你的应用程序添加互动性。

同样，在React Native中，你可以监听各种事件，访问本地API，并使用JavaScript编写核心业务逻辑。因此，在学习React Native之前，让自己熟悉JavaScript是至关重要的。

JavaScript的基础知识

你首先应该掌握的是JavaScript的基础知识。这意味着要熟悉语法和基本操作，了解如何声明变量和对象，以及定义和调用函数。你还应该学习如何使用JavaScript的内置方法来处理对象、数组、字符串和日期。

DOM操作

在编写JavaScript时，你最常做的事情之一就是操作DOM。

文档对象模型（DOM）是一个代表当前网页的树状结构。浏览器的DOM API使开发者能够以编程方式访问HTML元素，以添加所需的业务逻辑。

例如，当鼠标指针悬停在一个文本上时，你可以改变它的颜色。

<span id="sampleText">
Hello World
</span>


const text = document.getElementById("sampleText");

text.addEventListener("mouseover", function(){
    text.style.color = 'red'
});

document 对象有不同的方法来访问和增加HTML元素的互动性。你可以在这里查看DOM操作的更多细节。

现代功能（ES6+）

自成立以来，JavaScript已经走过了漫长的道路。每年都在积极添加新的功能，作为一个JavaScript开发者，你需要跟上它们。自2015年以来，引入了许多功能，如箭头函数、对象和数组去结构化，以及const 和let 变量声明，并在与React等库合作时经常使用。

另一个需要学习的重要功能是如何使用Fetch API来获取和发送数据到外部服务。这在大多数网络和移动应用程序中是一个非常常见的要求。

学习JavaScript基础知识和ES6+功能将给你一个坚实的基础，并帮助你更好地理解React Native的核心概念。

到此为止，到目前为止所提到的技术在Web开发中是非常常见的。从这里开始，你可以选择掌握像React这样的JavaScript库，或者像Vue或Angular这样的框架，这时你才能真正深入到JavaScript世界。

然而，在进入框架之前，你必须对HTML、CSS和JavaScript有充分的了解，因为这些是你在开发过程中进一步需要的基本技能。

学习JavaScript的资源

React

React是一个JavaScript库，使开发者能够创建用户界面组件。传统的网页使用HTML和CSS来构建用户界面，但在React中，用户界面是纯粹使用JavaScript构建的。React还以在引擎盖下包含一个虚拟DOM而闻名，它被用来代替直接操作DOM。

在学习React Native之前掌握React将使你的工作变得非常容易。尽管React和React Native用于开发不同平台的应用程序，但它们在语法上非常相似。此外，它们都是基于相同的编程语言--JavaScript。

虚拟DOM

React创建了一个虚拟DOM（VDOM），它是要在网页上呈现的DOM结构的一个对象表示。如果你想更深入地了解React的内部工作方式，你应该学习一下VDOM。虚拟DOM是一个与框架无关的概念，所以它也被用于其他框架，如Vue。

JSX

使用React，你可以建立可重用的UI组件，并在它们之间传递数据。组件是使用一种特殊的JavaScript语法扩展写成的，称为JSX（JavaScript XML）。

JSX看起来类似于HTML语法，而且非常强大，因为它可以处理JavaScript表达式。在JSX中，代替HTML属性的是props ，用于将数据从父组件传递给子组件。

数据处理

组件也可以使用state ，在内部处理他们的数据。props 和state 是React中两个非常重要的概念。清楚地了解React中的数据处理方式是至关重要的，因为这是你会经常做的事情。

React组件

有两种类型的组件--类组件和函数组件。React类组件有不同的生命周期方法，在渲染过程中被调用。React函数组件可以利用钩子来处理不同的状态。这两种组件类型都有其优点和缺点，你需要知道哪一种适合你的使用情况。

进一步学习

一旦掌握了React的基础知识，你就可以深入研究高级主题，如上下文、组件模式、门户和组件测试。此外，你可以尝试不同的第三方库，如Redux，Material UI，或Axios。熟悉npm或yarn包的安装程序，因为你会经常和包打交道。

学习React的最好地方是官方文档。如果你不喜欢阅读，那么你可以在YouTube和Udemy找到很多资源。

像JSX、组件、生命周期方法、钩子和状态管理等主题是使用React Native开发应用程序的核心要素。作为一个React Native开发者，你每天都要处理上述主题，所以你必须在学习React Native之前适应它们。

结语

到现在，我希望你对进入React Native之前需要学习的主题和技术有一个清晰的概念。在本指南中，我们讨论了学习HTML、CSS、JavaScript和React等网络技术如何帮助你学习React Native。我强烈建议你熟悉JavaScript，因为它是React Native中使用的编程语言。有了坚实的基础，你就能在学习中占得先机，也能帮助你更快地调试和排除问题。

为了准备学习React Native，你也可以学习一下Java和Swift或Objective-C语言，因为这些是Android和iOS开发的底层原生编程语言。

只做理论是不够的。一旦你熟悉了语法，就从创建迷你项目开始，比如小费计算器或密码生成器。随着你的实践，你会越发了解和遇到挑战。解决问题的方法越多越好。如果你遇到问题，可以在网上搜索，因为大部分的解决方案都已经有了。

The postWhat you should learn before learning React Nativeappeared first onLogRocket Blog.

avatar
文章
阅读
粉丝