最近一段时间,又重新涉猎了一些空白领域,比如前端 React 的学习。由于预估不足,当我翻开 React 教程时,看到了一下文字,让我绷不住了。


在学习 React 之前,需要掌握以下基础知识:

  1. HTML
  2. CSS
  3. JavaScript 基础
  4. ES6+ 语法

不仅如此,还需要学习 TypeScript ,着实让我头大。所以采取了快速学习的策略,先从概念入手,然后直接手敲代码,配合 AI 助手,也算是磕磕绊绊走完了基础知识的学习。

在学习 React 的过程里,我想给教程里面一个 input 标签增加一个功能,点击清除原有内容的,用到了下面的代码:

document.getElementById('input-name').value = '';

然后就出 BUG ,怎么也无法继续输入内容了,仿佛每次输入内容之后都会清空一样。所以请教了一个高段位的朋友。

高手不愧是高手,一眼就看出来问题了。首先说了一下代码的问题,然后告诉我应该直接修改输入框的里面赋值变量的值,而不是直接修改 input 输入框的 value 。下面是这个变量的声明语句:

const [newName, setNewName] = useState("");

同时他还强调了,我的哪个语法不符合 React 的核心思想,可以说并不是 React 语法(其实是我问的 AI 助手的结果)。根据教程的项目简单讲解了 React 的一个核心思想: 数据驱动

数据驱动 ,这意味着 UI 是由数据状态驱动的,组件的视图会随着数据的变化自动更新。这一思想使得开发者可以更清晰、更高效地管理和维护复杂的用户界面。比如我想的哪个功能,因为我设置了输出框的内容为 newName ,所以只要我相对内容进行修改,就只需要调用 setNewName 方法即可。不用关心 HTML 哪些标签的内容。这样让功能简洁了很多,代码也具有更强的可读性和可维护性。

经过讲解,我一下子对 React 的设计思想有了模糊的认识,也了解了 React 之所以流行的原因,果然让开发者省去了很多不必要的麻烦,专注于特定功能的开发和维护。

学习新领域知识,难免会遇到问题。搜索网页或者咨询 AI 助手,或许是可以得到答案,但跟高段位的请教,却能得到答案以外的知识。比如我的这次请教,不仅解决了 BUG ,还接受了 React 的设计思想,对于后面的学习起到事半功倍的助推效果。

高段位的选手往往具有对工具和框架更深入的理解,能够从更高层次的角度解释问题,分析原因,提供全面的知识讲解。他们往往拥有较长的实践经验,避免小白在一些坑里面爬不出来,指导学习的路线和进度。

上一次有这种级别的指导,得到了一个宝贵的建议: 你可以考虑一下 Groovy 。熟悉的同学应该能体会到这个建议对我的影响。到现在,受益匪浅。

所以如果对于新手小白来讲,进入一个空白的新领域,想高段位请教是一个非常好的学习提升途径。


↙↙↙阅读原文可查看相关链接,并与作者交流