搜索
首页web前端js教程JavaScript高效学习之路总结篇

JavaScript高效学习之路总结篇

Aug 04, 2017 pm 01:31 PM
javascriptjs总结

1.首先我会把Chrome浏览器装好,在dev tools => console里直接练习熟悉基本语法,变量,数据类型,数学运算,字符串运算,条件,循环基本结构,简单函数定义和调用这些,之所以用chrome dev tools,是因为这时候我不想费劲折腾单独的编辑器,也不需要在开文件和文件夹,然后去配一些工具最终才接触到真正的JS编程,我想尽可能直接而少干扰就开始写JS,这是最重要的,我学JS,当然应该尽快写JS

2.熟悉了基本语法以后,我会在devtools => console 里编几个稍微有挑战点的小程序,比如实现fibonaci 数列这种简单的,比如打印一个99乘法表,你也可以自己给自己出几个题,或者网上随机找感兴趣的题目,别人写过没写过不是重点,重点是找点事情做,让自己写代码,别小看这些看起来无聊的程序,在你的熟练度达到可以开始第一个项目之前,这些没有的小程序是最适合练手的,因为它们不牵涉其他方面的知识(比如DOM),所以你不会受到过多干扰,只需要关注用正确的语法写出正确的程序,这个过程会让你更熟悉JS语言本身。

3.我觉得差不多的时候,就可以学习用JS来做web开发了,但是别急,这时候还没准备好新建一个项目,所以我还是会在devtools里,但是侧重是熟悉DOM,我会从简单的window.alert, window.prompt 开始,慢慢地去试验DOM的API如何使用,我会买一本DOM编程的书,放在案头,一章一章往下看,边看边试,慢慢地接触到DOM的常用操作,比如document.getElementById, document.getElementsByClassName, addEventListner, 等等,这些调用里有很重要的概念,比如什么是ID,什么是Class,什么是Event,它们有什么用,JS语言是如何通过API和它们交互的。我会选几个网站的页面,随便对页面的元素进行一些修改,比如用JS改变元素的字体,背景色,或者临时增加事件侦听等等。DOM API的行为产生的效果你能在网页上直接看出来,很直观,也比较有趣,比之前写纯JS程序这些更生动,能激发学习的好奇心,并且DOM是JS程序员的核心知识。

4.通常看完一本DOM编程的书以后,大概地了解了JS在web编程中的用处了。这时候我会给自己选一个项目,比如留言版这种,以HTML5 Boilerplate为模板,开始第一个web前端项目的开发。数据的存储可以直接存放在IndexDB里,所以这时候不需要关心后台操作。我会大概的考虑好要做什么功能,然后用之前学到的JS和DOM操作的知识,好好地实现这些功能。这个项目会花去我大量的时间,所以我告诉自己要保持耐心。碰到问题我就去用搜索引擎找答案,或者去书里找到相应的章节。

5.写完第一个项目以后,我会第一次觉得很有成就感,虽然项目很小,也不复杂。我会找一个老师帮我review一下,听听他的意见和建议,也可以准备一些问题,让他帮忙看接下去可以怎么迭代。这时候我会去学习git的基本操作,github的基本使用,然后把项目push上去,把需要的改动commit进git。

6.在这之前我写的都是原生JS,没有用到库,没有用到框架,这样的好处是我不需要过早地去纠结库和框架本身的概念,因为现在真正重要的是JS语言本身,其实我的编程领域比起最开始已经有了很大的拓展,你看我已经用JS,配合DOM,写出来一些很实际的功能,完成了一个前端项目。

7.这时候我的选择比较多,我可以:继续用原生JS完成一两个类似的项目,比如注册登陆,动态图片展示等等;也可以:尝试改进当前项目的程序设计,做一些代码的改进,这时候可以去看看JS模式这样的书,因为第一个项目的代码结构通常没有特别的程序设计,却章法,这样的书能告诉你更好的JS程序可以如何;我还可以乘势把手上的项目重构成基于jQuery的代码,这样就在对比中学会了jQuery的基础,理解了jQuery的好处;我甚至可以把当前项目代码重构成ES6语法,这样就能在对比中ES6语法的好处。

8.接下来我就会去写更复杂的项目,比如TODOLIST,自己从头到尾实现一个这样的应用,同样以原生JS(ES5)写第一个版本,然后选择是否重构到jQuery或者ES6,如果有兴趣,甚至是TypeScript。继续看JS程序设计方面的书,注意力应该是在程序“设计”,而不是语法细节,大多数时候语法的问题都是可以搜索到的。程序“设计”是分析应用的需求,什么功能,是否需要分模块,模块好不好分,不好分怎么渐进地找出架构的方案,什么样的模块化是比较自然的,如何处理错误,是否需要模板支持,复杂的用例是自己实现还是找第三方的库来集成,等等这些和实际开发零距离的问题。

9.这个项目我还是会放进github,写完以后我就找一个老师(免费付费都没关系),review一下我的实现,让他指出我理解错误的地方,这是宝贵的学习机会。和第一个项目一样,我还是会根据老师的反馈和自己的思考,决定是否继续迭代,以及如何继续改善。到这个时候,我也许会把市面上所有的Javascript的必读书都买来看,看第一书很慢,第二本书不快,但看到第四五本书的时候,就可以很快了,挑选其中自己不了解的章节专门阅读,然后把书里提到的知识,技巧,实践用到之前写过的项目中去。

10我现在已经有了JS(ES5)比较全面的基础,也比较熟练了,至少碰到问题我大概知道方向是什么。我也接触了jQuery,甚至可能已经比较熟悉;ES6也是。我对语言的基本生态有了比较全面而深刻的映像。现在我想来学一个框架,我会去做一点功课,看看自己喜欢哪个框架,选定了以后,我就先做完官方的tutorial,同时清楚一些基本的概念问题。

11.然后我做的,就是把之前的项目(如TODOLIST),用框架重新写一遍,这时候我不会再有觉得很深涩的地方了,因为我有了JS的基础,已经有了一些自己找答案,debug的经验,哪怕框架本身有不清楚的地方,我都能自己通过搜索,或者研究,把答案找出来。哪怕找不出来,也至少有了基本的开发思维,虽然不知道答案,但也有大概的方向,如果我要问别人问题,也能问出更有回答价值的问题来,我已经走上了专业开发的路,不是因为我知道框架的这和那,而是我有了做开发的基本习惯和素养。

12.也许这时候我找到了第一份前端的工作,一段时间以后我发现自己对node后台开发和electron产生了兴趣,我阅读了基本的文档以后,发现其实并不需要怎么学习就可以用这些东西了。因为JS程序的架构,常见结构,模式,主要概念,我已经熟稔于胸,所以只要是在JS这个生态内,不管新出了什么技术,无论是库,框架还是模式,我都能在第一时间找到理解他们的路径,我已经学会了怎么学习,那些东西在JS程序里是重要的,概念是如何组合的,变迁的,所以对我来说,学JS和用JS已经没有什么区别了。

13.然后呢,通常真正循序渐进学过来,语言基础扎实的,到这时候已经不需要人来教了。

我认为有一些观念和操作是和循序渐进相悖的。

1.过早追求“系统”学习,好高骛远,眼高很容易手低,人的精力是有限的,要尊重学习规律,承认自己是普通人,告诫自己不要取巧,不要贪婪,慢慢来

2.觉得读源码是最“本质”的学习,结果是掉进细节的深坑不能自拔

3.过早埋头进“最新”技术,比如框架,在没有良好的语言基础之前学,事倍功半,”最新“技术和核心技术很多时候不是一回事,有了基础和核心,学新技术才是最有效率的,反过来却不成立

4.把编程学习等同于看书积累“知识”,但编程最终是一种技能,不动手什么也学不会,“知道”什么和“会”什么是两回事

5.具体的东西不学,却一开始就试图找到“最佳”学习路径,可能是最大的浪费了,有意义的目标是告诉自己明天干什么,而不是假设自己明天“应该”学会什么

6.过分堆砌学习资料,以为找到的资料越多,罗列越完整,自己学得越快越好,事实恰恰相反,越是罗列,噪声越大,心理压力和挫败感越强,越容易放弃,在一个阶段,一本书,配合少量网络资料足够了,”收藏“是一个不怎么好的习惯,学习的人应该追求知识的消化,而不是堆砌

以上是JavaScript高效学习之路总结篇的详细内容。更多信息请关注PHP中文网其他相关文章!

声明
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn
JavaScript引擎:比较实施JavaScript引擎:比较实施Apr 13, 2025 am 12:05 AM

不同JavaScript引擎在解析和执行JavaScript代码时,效果会有所不同,因为每个引擎的实现原理和优化策略各有差异。1.词法分析:将源码转换为词法单元。2.语法分析:生成抽象语法树。3.优化和编译:通过JIT编译器生成机器码。4.执行:运行机器码。V8引擎通过即时编译和隐藏类优化,SpiderMonkey使用类型推断系统,导致在相同代码上的性能表现不同。

超越浏览器:现实世界中的JavaScript超越浏览器:现实世界中的JavaScriptApr 12, 2025 am 12:06 AM

JavaScript在现实世界中的应用包括服务器端编程、移动应用开发和物联网控制:1.通过Node.js实现服务器端编程,适用于高并发请求处理。2.通过ReactNative进行移动应用开发,支持跨平台部署。3.通过Johnny-Five库用于物联网设备控制,适用于硬件交互。

使用Next.js(后端集成)构建多租户SaaS应用程序使用Next.js(后端集成)构建多租户SaaS应用程序Apr 11, 2025 am 08:23 AM

我使用您的日常技术工具构建了功能性的多租户SaaS应用程序(一个Edtech应用程序),您可以做同样的事情。 首先,什么是多租户SaaS应用程序? 多租户SaaS应用程序可让您从唱歌中为多个客户提供服务

如何使用Next.js(前端集成)构建多租户SaaS应用程序如何使用Next.js(前端集成)构建多租户SaaS应用程序Apr 11, 2025 am 08:22 AM

本文展示了与许可证确保的后端的前端集成,并使用Next.js构建功能性Edtech SaaS应用程序。 前端获取用户权限以控制UI的可见性并确保API要求遵守角色库

JavaScript:探索网络语言的多功能性JavaScript:探索网络语言的多功能性Apr 11, 2025 am 12:01 AM

JavaScript是现代Web开发的核心语言,因其多样性和灵活性而广泛应用。1)前端开发:通过DOM操作和现代框架(如React、Vue.js、Angular)构建动态网页和单页面应用。2)服务器端开发:Node.js利用非阻塞I/O模型处理高并发和实时应用。3)移动和桌面应用开发:通过ReactNative和Electron实现跨平台开发,提高开发效率。

JavaScript的演变:当前的趋势和未来前景JavaScript的演变:当前的趋势和未来前景Apr 10, 2025 am 09:33 AM

JavaScript的最新趋势包括TypeScript的崛起、现代框架和库的流行以及WebAssembly的应用。未来前景涵盖更强大的类型系统、服务器端JavaScript的发展、人工智能和机器学习的扩展以及物联网和边缘计算的潜力。

神秘的JavaScript:它的作用以及为什么重要神秘的JavaScript:它的作用以及为什么重要Apr 09, 2025 am 12:07 AM

JavaScript是现代Web开发的基石,它的主要功能包括事件驱动编程、动态内容生成和异步编程。1)事件驱动编程允许网页根据用户操作动态变化。2)动态内容生成使得页面内容可以根据条件调整。3)异步编程确保用户界面不被阻塞。JavaScript广泛应用于网页交互、单页面应用和服务器端开发,极大地提升了用户体验和跨平台开发的灵活性。

Python还是JavaScript更好?Python还是JavaScript更好?Apr 06, 2025 am 12:14 AM

Python更适合数据科学和机器学习,JavaScript更适合前端和全栈开发。 1.Python以简洁语法和丰富库生态着称,适用于数据分析和Web开发。 2.JavaScript是前端开发核心,Node.js支持服务器端编程,适用于全栈开发。

See all articles

热AI工具

Undresser.AI Undress

Undresser.AI Undress

人工智能驱动的应用程序,用于创建逼真的裸体照片

AI Clothes Remover

AI Clothes Remover

用于从照片中去除衣服的在线人工智能工具。

Undress AI Tool

Undress AI Tool

免费脱衣服图片

Clothoff.io

Clothoff.io

AI脱衣机

AI Hentai Generator

AI Hentai Generator

免费生成ai无尽的。

热门文章

R.E.P.O.能量晶体解释及其做什么(黄色晶体)
3 周前By尊渡假赌尊渡假赌尊渡假赌
R.E.P.O.最佳图形设置
3 周前By尊渡假赌尊渡假赌尊渡假赌
R.E.P.O.如果您听不到任何人,如何修复音频
3 周前By尊渡假赌尊渡假赌尊渡假赌
WWE 2K25:如何解锁Myrise中的所有内容
4 周前By尊渡假赌尊渡假赌尊渡假赌

热工具

螳螂BT

螳螂BT

Mantis是一个易于部署的基于Web的缺陷跟踪工具,用于帮助产品缺陷跟踪。它需要PHP、MySQL和一个Web服务器。请查看我们的演示和托管服务。

记事本++7.3.1

记事本++7.3.1

好用且免费的代码编辑器

MinGW - 适用于 Windows 的极简 GNU

MinGW - 适用于 Windows 的极简 GNU

这个项目正在迁移到osdn.net/projects/mingw的过程中,你可以继续在那里关注我们。MinGW:GNU编译器集合(GCC)的本地Windows移植版本,可自由分发的导入库和用于构建本地Windows应用程序的头文件;包括对MSVC运行时的扩展,以支持C99功能。MinGW的所有软件都可以在64位Windows平台上运行。

PhpStorm Mac 版本

PhpStorm Mac 版本

最新(2018.2.1 )专业的PHP集成开发工具

SublimeText3汉化版

SublimeText3汉化版

中文版,非常好用