mirror of
https://github.com/LCTT/TranslateProject.git
synced 2024-12-26 21:30:55 +08:00
translated
This commit is contained in:
geekpi
parent
cac991e8f0
commit
29eb5b69df
@ -1,74 +0,0 @@
|
|||||||
[#]: subject: "How much JavaScript do you need to know before learning ReactJS?"
|
|
||||||
[#]: via: "https://opensource.com/article/22/7/learn-javascript-before-reactjs"
|
|
||||||
[#]: author: "Sachin Samal https://opensource.com/users/sacsam005"
|
|
||||||
[#]: collector: "lkxed"
|
|
||||||
[#]: translator: "geekpi"
|
|
||||||
[#]: reviewer: " "
|
|
||||||
[#]: publisher: " "
|
|
||||||
[#]: url: " "
|
|
||||||
|
|
||||||
How much JavaScript do you need to know before learning ReactJS?
|
|
||||||
======
|
|
||||||
The main idea is to be good in JavaScript so you can reduce the complexity of your ReactJS journey.
|
|
||||||
|
|
||||||
React is a UI framework built on top of HTML, CSS, and JavaScript, where JavaScript (JS) is responsible for most of the logic. If you have knowledge of variables, data types, array functions, callbacks, scopes, string methods, loops, and other JS DOM manipulation-related topics, these will tremendously speed up the pace of learning ReactJS.
|
|
||||||
|
|
||||||
Your concept of modern JavaScript will dictate the pace of how soon you can get going with ReactJS. You don't need to be a JavaScript expert to start your ReactJS journey, but just as knowledge of ingredients is a must for any chef hoping to master cooking, the same is true for learning ReactJS. It's a modern JavaScript UI library, so you need to know some JavaScript. The question is, how much?
|
|
||||||
|
|
||||||
### Example explanation
|
|
||||||
|
|
||||||
Suppose I'm asked to write an essay about a "cow" in English, but that I know nothing about the language. In this case, for me to successfully complete the task, I should not only have an idea about the topic but also the specified language.
|
|
||||||
|
|
||||||
Assuming that I acquire some knowledge about the topic (a cow), how can I calculate the amount of English I need to know to be able to write about the proscribed topic? What if I have to write an essay on some other complex topics in English?
|
|
||||||
|
|
||||||
It’s difficult to figure that out, isn’t it? I don’t know what things I'm going to write about the topic, but it could be anything. So to get started, I have to have a proper knowledge of the English language, but it doesn't end there.
|
|
||||||
|
|
||||||
### Extreme reality
|
|
||||||
|
|
||||||
The same is true for the amount of JavaScript required before getting started with ReactJS. According to my example scenario, ReactJS is the topic "cow" while JavaScript is the English language. It's important to have a strong grasp of JavaScript to be successful in ReactJS. One is very unlikely to master ReactJS professionally without having the proper foundation of JavaScript. No matter how much knowledge I might have about the topic, I won’t be able to express myself properly if I don't know the fundamentals of the language.
|
|
||||||
|
|
||||||
### How much is enough?
|
|
||||||
|
|
||||||
In my experience, when you start your ReactJS journey, you should already be familiar with:
|
|
||||||
|
|
||||||
* variables
|
|
||||||
* data types
|
|
||||||
* string methods
|
|
||||||
* loops
|
|
||||||
* conditionals
|
|
||||||
|
|
||||||
You should be familiar with these specifically in JavaScript. But these are just the bare minimum prerequisites. When you try to create a simple React app, you'll inevitably need to handle events. So, the concept of normal functions, function expressions, statements, arrow function, the difference between an arrow function and a regular function, and the lexical scoping of `this` keyword in both types of function is really important.
|
|
||||||
|
|
||||||
But the question is, what if I have to create a complex app using ReactJS?
|
|
||||||
|
|
||||||
### Get inspired
|
|
||||||
|
|
||||||
Handling events, spread operators, destructuring, named imports, and default imports in JavaScript will help you understand the working mechanism of React code.
|
|
||||||
|
|
||||||
Most importantly, you must understand the core concepts behind JavaScript itself. JavaScript is asynchronous by design. Don't be surprised when code appearing at the bottom of a file executes before code at the top of the file does. Constructs like promises, callbacks, async-await, map, filter, and reduce, are the most common methods and concepts in ReactJS, especially when developing complex applications.
|
|
||||||
|
|
||||||
The main idea is to be good in JavaScript so you can reduce the complexity of your ReactJS journey.
|
|
||||||
|
|
||||||
### Getting good
|
|
||||||
|
|
||||||
It's easy for me to say what you need to know, but it's something else entirely for you to go learn it. Practicing a lot of JavaScript is essential, but you might be surprised that I don't think it means you necessarily have to wait until you master it. There are certain concepts that are important beforehand, but there's a lot you can learn as you go. Part of practicing is learning, so you get started with JavaScript and even with some of the basics of React, as long as you move at a comfortable pace and understand that doing your "homework" is a requirement before you attempt anything serious.
|
|
||||||
|
|
||||||
### Get started with JavaScript now
|
|
||||||
|
|
||||||
Don't bother waiting until you cover all aspects of JavaScript. That's never going to happen. If you do that, you'll get trapped in that forever-loop of learning JavaScript. And you all know how constantly evolving and rapidly changing the tech field is. If you want to start learning JavaScript, try reading Mandy Kendall's introductory article [Learn JavaScript by writing a guessing game][2]. It's a great way to get started quickly, and once you see what's possible I think you're likely to find it difficult to stop.
|
|
||||||
|
|
||||||
--------------------------------------------------------------------------------
|
|
||||||
|
|
||||||
via: https://opensource.com/article/22/7/learn-javascript-before-reactjs
|
|
||||||
|
|
||||||
作者：[Sachin Samal][a]
|
|
||||||
选题：[lkxed][b]
|
|
||||||
译者：[译者ID](https://github.com/译者ID)
|
|
||||||
校对：[校对者ID](https://github.com/校对者ID)
|
|
||||||
|
|
||||||
本文由 [LCTT](https://github.com/LCTT/TranslateProject) 原创编译，[Linux中国](https://linux.cn/) 荣誉推出
|
|
||||||
|
|
||||||
[a]: https://opensource.com/users/sacsam005
|
|
||||||
[b]: https://github.com/lkxed
|
|
||||||
[1]: https://opensource.com/sites/default/files/lead-images/OSDC_women_computing_5.png
|
|
||||||
[2]: https://opensource.com/article/21/1/learn-javascript
|
|
||||||
@ -0,0 +1,75 @@
|
|||||||
|
[#]: subject: "How much JavaScript do you need to know before learning ReactJS?"
|
||||||
|
[#]: via: "https://opensource.com/article/22/7/learn-javascript-before-reactjs"
|
||||||
|
[#]: author: "Sachin Samal https://opensource.com/users/sacsam005"
|
||||||
|
[#]: collector: "lkxed"
|
||||||
|
[#]: translator: "geekpi"
|
||||||
|
[#]: reviewer: " "
|
||||||
|
[#]: publisher: " "
|
||||||
|
[#]: url: " "
|
||||||
|
|
||||||
|
学习 ReactJS 之前，你需要了解多少 JavaScript？
|
||||||
|
======
|
||||||
|
主要的想法是精通 JavaScript，这样你就可以减少 ReactJS 之旅的复杂性。
|
||||||
|
|
||||||
|
React 是一个建立在 HTML、CSS 和 JavaScript 之上的 UI 框架，其中 JavaScript（JS）负责大部分的逻辑。如果你对变量、数据类型、数组函数、回调、作用域、字符串方法、循环和其他 JS DOM 操作相关的主题有一定了解，这些将极大地加快学习 ReactJS 的步伐。
|
||||||
|
|
||||||
|
你对现代 JavaScript 的概念将决定你能多快地掌握 ReactJS 的步伐。你不需要成为一个 JavaScript 专家来开始你的 ReactJS 之旅，但就像对食材的了解是任何希望掌握烹饪的厨师所必须的一样，学习 ReactJS 也是如此。它是一个现代的 JavaScript UI 库，所以你需要了解一些 JavaScript。问题是，需要多少？
|
||||||
|
|
||||||
|
### 示例解释
|
||||||
|
|
||||||
|
假设我被要求用英语写一篇关于“牛”的文章，但我对这种语言一无所知。在这种情况下，为了让我成功地完成任务，我不仅要对主题有概念，还要对指定的语言有概念。
|
||||||
|
|
||||||
|
假设我获得了一些关于主题（牛）的知识，我如何计算我需要知道多少英语才能写出规定的主题？如果我必须用英语写一篇关于其他复杂话题的文章呢？
|
||||||
|
|
||||||
|
这很难搞清楚，不是吗？我不知道我要写关于这个话题的什么东西，但它可能是任何东西。所以要想开始，我必须要有适当的英语知识，但这还没有结束。
|
||||||
|
|
||||||
|
### 极端现实
|
||||||
|
|
||||||
|
在开始使用 ReactJS 之前，所需的 JavaScript 数量也是如此。根据我的例子情景，ReactJS 是话题“牛”，而 JavaScript 是英语。要想在 ReactJS 中获得成功，对 JavaScript 的掌握很重要。如果没有适当的 JavaScript 基础，一个人是很难专业地掌握 ReactJS 的。无论我对这个主题有多少知识，如果我不知道语言的基础，我就不能正确地表达自己。
|
||||||
|
|
||||||
|
### 多少才算够？
|
||||||
|
|
||||||
|
根据我的经验，当你开始你的 ReactJS 之旅时，你应该已经熟悉了：
|
||||||
|
|
||||||
|
* 变量
|
||||||
|
* 数据类型
|
||||||
|
* 字符串方法
|
||||||
|
* 循环
|
||||||
|
* 条件式
|
||||||
|
|
||||||
|
你应该对这些具体的 JavaScript 熟悉。但这些只是最基本的先决条件。当你试图创建一个简单的 React 应用时，你将不可避免地需要处理事件。所以，普通函数、函数表达式、语句、箭头函数的概念，箭头函数和普通函数的区别，以及两类函数中 `this` 关键字的词义范围，这确实很重要。
|
||||||
|
|
||||||
|
但问题是，如果我必须使用 ReactJS 创建一个复杂的应用怎么办？
|
||||||
|
|
||||||
|
### 获得启发
|
||||||
|
|
||||||
|
在 JavaScript 中处理事件、传播操作符、解构、命名导入和默认导入将帮助你理解 React 代码的工作机制。
|
||||||
|
|
||||||
|
最重要的是，你必须了解 JavaScript 本身背后的核心概念。JavaScript 在设计上是异步的。当出现在文件底部的代码在文件顶部的代码之前执行时，不要惊讶。像 promise、callback、async-await、map、filter 和 reduce 这样的结构，是 ReactJS 中最常见的方法和概念，尤其是在开发复杂的应用时。
|
||||||
|
|
||||||
|
The main idea is to be good in JavaScript so you can reduce the complexity of your ReactJS journey.
|
||||||
|
主要的想法是精通 JavaScript，这样你可以减少 ReactJS 之旅的复杂性。
|
||||||
|
|
||||||
|
### 越来越好
|
||||||
|
|
||||||
|
我很容易说出你需要知道的东西，但你去学习它完全是另一回事。大量练习 JavaScript 是必不可少的，但你可能会感到惊讶，我认为这并不意味着你必须等到掌握它。有些概念事先很重要，但你可以在学习过程中学到很多东西。练习的一部分是学习，所以你可以开始使用 JavaScript，甚至是 React 的一些基础知识，只要你以舒适的速度移动并理解在你尝试任何严肃的事情之前做你的“家庭作业”是一个要求。
|
||||||
|
|
||||||
|
### 立即开始使用 JavaScript
|
||||||
|
|
||||||
|
不要费心等到你涵盖了 JavaScript 的所有方面。那永远不会发生。如果这样做，你将陷入学习 JavaScript 的永远循环中。你们都知道技术领域是如何不断发展和迅速变化的。如果你想开始学习 JavaScript，请尝试阅读 Mandy Kendall 的介绍性文章[通过编写猜谜游戏学习 JavaScript][2]。这是一种快速入门的好方法，当你看到了可能的情况，我认为你可能会发现很难停下来。
|
||||||
|
|
||||||
|
--------------------------------------------------------------------------------
|
||||||
|
|
||||||
|
via: https://opensource.com/article/22/7/learn-javascript-before-reactjs
|
||||||
|
|
||||||
|
作者：[Sachin Samal][a]
|
||||||
|
选题：[lkxed][b]
|
||||||
|
译者：[geekpi](https://github.com/geekpi)
|
||||||
|
校对：[校对者ID](https://github.com/校对者ID)
|
||||||
|
|
||||||
|
本文由 [LCTT](https://github.com/LCTT/TranslateProject) 原创编译，[Linux中国](https://linux.cn/) 荣誉推出
|
||||||
|
|
||||||
|
[a]: https://opensource.com/users/sacsam005
|
||||||
|
[b]: https://github.com/lkxed
|
||||||
|
[1]: https://opensource.com/sites/default/files/lead-images/OSDC_women_computing_5.png
|
||||||
|
[2]: https://opensource.com/article/21/1/learn-javascript
|
||||||
Loading…
Reference in New Issue
Block a user