Advertisement

JavaScript怎么才能学得更好?学好JavaScript能做些什么?

阅读量:

既然你深入研究这篇文章来(原意为"认真阅读并深入理解"),说明你是真心想学好JavaScript的。你没有想错,在当今互联网时代想要开发现代网站或web应用(包括互联网创业),必须掌握JavaScript这项技术基础。面对浩如烟海的JavaScript在线学习资源(原意为"丰富的在线学习渠道"),却难以找到一套高效且实用的学习方法去掌握这一门语言的技术基础。

有一点不可忽视的是,在几年前我们必须要掌握一种真正的服务器端编程语言(如PHP、Rails、Java、Python或Perl)来构建可扩展性高、动态性强且基于数据库的Web应用程序;如今只需使用JavaScript就可实现类似功能

我目前在前端开发并创建了一个学习交流群:980500148。大家会一起在里面讨论和分享资源(群主负责管理并定期补充和完善相关资料)。如果感兴趣的话,请加我微信:wdnmd__xxx。我们的团队小助理微信是lyf___1201。学习时间一般在6至8周内。

学习前提:中学水平,无需编程经验

在Reddit上创建了一个学习小组

January 2014, “Learn JavaScript” Study Group on Reddit

为学习者设计了一个系统化且具引导性的学习路径,从基础水平逐步提升至掌握核心技能,彻底掌握JavaScript编程语言的基本概念与实际应用。

不要这样学习JavaScript

与其一开始就沉溺于成山的JavaScript在线教程而不加选择地投入其中 ,这种持续性地沉浸在大量无组织的学习中实在是一种效率极低的方式 。即使花费无数小时研习JavaScript的各种资源 ,若缺乏系统性和分层次的学习策略 ,也难以取得实质性的进步 。特别是在构建网站或开发Web应用时 ,频繁遇到技术瓶颈是一个不可回避的问题 。总体而言 ,这种被动式的学习方式不仅无法提升你的编程思维能力 ,更无法帮助你有效地将编程知识转化为解决实际问题的能力——编程本质上是一种工具性的技能

另外, 有些人可能会建议从著名的JavaScript开发者Douglas Crockford所著的经典书籍《JavaScript语言精粹》开始学习. 尽管Crockford先生对JavaScript有着深入的理解, 并被誉为 JavaScript 领域的顶尖专家(爱因斯坦式的智慧), 但他编写的书籍并不适合作为初学者的入门材料. 然而, 对于更深入的学习路径, 我推荐观看他的视频内容.

此外, 不要仅限于像Codecademy这样的网站来学习JavaScript, 即使了解如何编写成百上千个JavaScript代码片段, 也不足以教会你构建一个完整的Web应用程序. 即使这样, 在后续章节中, 我依然会将Codecademy视为补充学习资源之一.

本课程资源

Reddit用户d0gsbody于4月8日在Reddit上创建了一个学习小组。其他组员也非常活跃且愿意提供帮助。如果愿意的话,请考虑加入这个小组。他们将促使你保持积极性,并协助你更有效地掌握JavaScript。独自调试JavaScript可能会感到有些挑战。链接:Learning JS Properly – Study Group on Reddit

请从这两本书中选择一本阅读:第一本书更适合有一定编程实践经验的读者(尤其是熟悉JavaScript领域);而第二本书则专为完全没有编程基础的新手设计。我强烈推荐第一本书!因为它不仅讲解得很透彻,并且深入浅出地介绍了许多高级JavaScript知识点。不过,请确保你已经掌握了一些基础的Web开发技能——如果有少量编程经验或相关背景知识(不一定专精于JavaScript),那么这本书会是一个不错的选择哦!

纸质版(英文) :Professional JavaScript for Web Developers

纸质版(中文) :JavaScript高级程序设计(第3版)

Kindle版(英文):Professional JavaScript for Web Developers

Kindle版(中文):JavaScript高级程序设计(第3版)

如果你没有编程经验,可以买这本:

纸质版(英文) :JavaScript: The Definitive Guide

纸质版(中文) :JavaScript权威指南(第6版)

Kindle版(英文):JavaScript: The Definitive Guide

Kindle版(中文):JavaScript权威指南(原书第6版)

免费加入Stack Overflow是一个编程领域的问答平台。在这里提问可以获得的答案远超Codecademy。即使你的问题是基础且看似愚蠢的问题也会得到认真对待

无需费用即可注册Codecademy, 这是一个无需安装客户端即可编写代码的网上学习平台, 适合那些希望轻松上手编程的人。

JavaScriptIs性感上的相关博客内容涵盖对象实例、闭包技术、变量作用域及提升机制等主题。

JavaSctipt学习路线

学习整个课程大纲预计会耗时约6至8个星期。掌握完整的JavaScript语言体系(涉及jQuery及其相关技术)。假如无法在六周内完成全部课程(难度较大),请尽量控制在八周以内。随着投入时间的延长,理解和记忆所有知识点的难度也随之提升。

1~2周(简介,数据类型,表达式和操作符)

如果你还不是很了解HTML和CSS,完成Codecademy上的web基础任务。

阅读《JavaScript权威指南》或者《JavaScript高级程序设计》的前言和第1~2章。

至关重要:对于书中的每一个示例代码,请务必亲自在其指定的浏览器环境中运行并加以修改完善,并深入探索(尝试各种功能)。此外还可以利用jsfiddle工具辅助操作但禁止使用Safari浏览器。为了提高效率我推荐使用带有Firebug插件的火狐浏览器来进行代码调试而 browser control panel 就是一个让你能够编写并执行 JavaScript code 的平台。

通过学习Codecademy JavaScript Track的基础课程部分

学习《JavaScript权威指南》第34章的可能性之一是研读《JavaScript高级程序设计》的相应内容。在你的编程生涯中通常不会使用到位操作知识的情况下可以选择跳过这一部分内容

再次强调:请记住,在学习过程中,请定期停下来将书本中的代码输入到浏览器的控制台中(或者使用JSFiddle),进行各种测试,并对代码结构进行一些调整。

研读《JavaScript权威指南》第5章。鉴于此,《JavaScript高级程序设计》暂无阅读安排,则无需深入学习相关内容的原因在于之前已系统覆盖了所需知识

完成Codecademy?JavaScript Track上的2~5部分。

3~4周(对象,数组,函数,DOM,jQuery)

以下三选一:

阅读我的博文JavaScript 对象详解.

阅读《JavaScript权威指南》第6章。

深入学习《JavaScript高级程序设计》第6章内容。特别提示:本章重点在于"理解对象"(Understanding Objects)部分。

这两本书将涵盖更多的具体内容, 但看完我的博客后, 你便无需过分担心这些细节.

1、阅读《JavaScript权威指南》第7~8章或者《JavaScript高级程序设计》第5和7章。

此时,在浏览器控制台花费大量时间编写代码是一个必要的学习过程。你需要通过不断练习掌握基础编程结构如if-else语句、for循环、数组、函数与对象等,并培养独立编写代码的能力。建议你在Codecademy平台完成任务时通常不会遇到困难;如果仍然在Codecademy上遇到困难,则回到浏览器环境中进行额外练习以巩固所学知识。这就好比年轻时詹姆斯在邻居的篮球场上反复练习投篮技巧而不断精进自己的运动技能一样。

反复地进行练习,在每一次微小的进步都累积起来会产生显著的效果。你必须认识到这个策略的价值,并且要把它当作切实可行的方法来对待,在其中全力以赴投入到其中。

Codecademy会造成已掌握的错觉。

Codecademy的主要缺点在于其提示和代码片段可能会让人过于自信地得出答案,在这种情况下人们可能会认为已经掌握了相关知识。或许乍一看会觉得这样就可以解决问题了, 但事实上这会导致代码并非完全自主编写的结果。

到目前为止为止, Codecademy仍然是学习编程的一个非常有帮助的平台.尤其是在理解小型项目及小型应用开发过程中, 通过掌握基础代码结构, 包括if语句、for循环以及函数与变量的概念, 你可以更好地开展开发工作.

1、回到Codecademy完成JavaScript路线。做完6~8部分(数据结构做到Object 2)。

2、完成Codecademy课程中Projects路径下的五个基础练习(Basic Projects)。完成后你会发现无需继续使用Codecademy了。这确实是个好事情,并通过更多的实践能更快地掌握知识,并从而更好地做好独立编程的准备。

  1. 学习《JavaScript权威指南》第13、15、16及19章;或者深入研读《JavaScript高级程序设计》第8至14章(包括第8至第14章)。请注意该书籍未涉及jQuery技术;而你目前在Codecademy上学习的关于jQuery的内容则较为浅显;建议访问官方 jQuery 教程以获取更全面的学习资源:http://try.jquery.com/

你也可以在《JavaScript权威指南》第19章了解更多的jQuery知识。

完成全部的jQuery教程http://try.jquery.com/

JavaScript终极编辑器:WebStorm

在尝试创建第一个项目之前,在你计划以后从事JavaScript开发或者频繁使用JavaScript时,请务必先下载WebStorm的免费试用版。这个课程专门设计了一个学习模块来帮助你掌握WebStorm的基本功能。毫无疑问,在30天内购买后需支付49美元(作为JavaScript开发者),这无疑是你除购买书籍外最明智的投资选择之一。

请确保证本开发环境中已启用JSHint功能。JSHint是一种用于检测JavaScript代码错误及潜在问题的工具,并且是强制要求开发团队遵循最佳实践编写代码的重要辅助工具。特别值得注意的是,在WebStorm中使用JSHint时会实时显示所有潜在问题的位置,并且这种自动化检测机制类似于文字处理程序中的拼写校对功能。通过这一工具的应用,不仅能够快速发现并修正语法错误和其他潜在的问题,在编写过程中还会实时提示开发者遵守最佳实践原则。特别值得一提的是,在实际应用过程中你会发现这一功能极大地方便了日常开发工作,并且能显著提升你的编程水平。

此外,在业内被视为顶尖选择的专业型开发环境中(IDE),广泛应用于开发者的平台能够帮助构建高性能的网络应用(Web应用)。因此该技术对于任何开发者来说都是不可或缺的工具。由于该平台整合了Node.js等主流开发框架(框架)以及版本控制工具(Git)和一系列相关的开发框架(比如React、Vue等),所以即使是顶级的JavaScript开发者也会将其作为常备工具使用。除非未来出现更多替代性的JavaScript IDE工具出现

为了使讨论更加公正, 我提及Sublime Text 2, 这是除WebStorm之外最接近的JavaScript编辑器. 然而, 它没有WebStorm丰富且全面的功能(即便附加了许多插件功能). 在进行小规模修改时, 我会使用Sublime Text 2, 因为它能够支持多种语言, 包括JavaScript. 然而, 我不会用它来搭建复杂的Web应用程序.

第一个项目-动态问答应用

目前而言,你已具备了足以构建一个稳定可靠的, 可持续性的Web应用的能力。请确保在完成我的设计前参考后续内容。如果遇到困难, 请访问Stack Overflow寻求帮助,并反复学习相关课本内容直至彻底理解这些概念。

目前而言,你已具备了足以构建一个稳定可靠的, 可持续性的Web应用的能力。请确保在完成我的设计前参考后续内容。如果遇到困难, 请访问Stack Overflow寻求帮助,并反复学习相关课本内容直至彻底理解这些概念。

接下来将开始开发一个互动式问答平台(同时会采用HTML语言以及CSS样式表技术),其主要功能包括:账号注册与登录流程、问题提交与回答模块、问题分类管理模块、智能评分系统设计与实现以及界面美观性优化方案设计与实现。

// 这里只演示一个问题,你要把所有问题都添加进去

var allQuestions = [

复制代码
       {
    
       question: "Who is Prime Minister of the United Kingdom?",
    
       choices: [
    
          "David Cameron",
    
          "Gordon Brown",
    
          "Winston Churchill",
    
          "Tony Blair"],
    
       correctAnswer: 0
    
       }

];

当用户单击"Next"按钮时, 程序会通过调用document.getElementById或jQuery方法实现地增加下一个问题, 并删除当前的问题内容. 在本版本中只有"Next"按钮作为导航工具.

你可以在本文下方评论求助,在Stack Overflow提问,在那边会有即时且精确的回答

5~6周(正则表达式,Window对象,事件,jQuery)

阅读《JavaScript权威指南》第10,14,17,20章。

或者阅读《JavaScript高级程序设计》第20,23章。

请确保将样例代码输入到浏览器控制台中,并对其进行彻底破坏以进行一系列测试。继续进行这些操作直到彻底弄清楚它的功能和运作机制。观察它能够执行哪些任务。

此时,在运用JavaScript时非常得心应手——仿佛是一位技艺精湛的编程大师即将踏上征程。然而你尚未达到高水平的境界——你需要不断实践所学技能,并持续地学习与精进。

3、升级之前做的问答应用

添加客户端数据验证:保证用户回答了当前问题才能进入下个问题。

添加一个'返回'按钮让用户能回去修改答案;最多只能回到第一个问题;注意,在用户已回答过的问题上激活该按钮(使其处于可用状态);这样就能避免让用户重复解答之前已答过的问题

用jQuery添加动画(淡出当前问题,淡入下个问题)

在IE8和IE9下测试,修改bug,这里应该会有得你忙了。 ;D

把问题导出JSON文件

实现用户的认证功能,并允许用户能够登录系统。将认证数据存储于本地存储(如local storage或HTML5浏览器内置的存储)。

使用cookies记住用户,当用户再次登陆时显示“欢迎用户名回来”。

7周,可延长到8周(类,继承,HTML5)

阅读《JavaScript权威指南》第9,18,21,22章。

或者阅读我的博文JavaScript面向对象必知必会

或许可以参考《JavaScript高级程序设计》中的第6、16、22、24章,并特别关注其中关于创建对象与继承的部分。请注意:这是本课程中最具有技术深度的内容之一,请根据个人情况判断是否需要全部深入阅读。至少需要理解并掌握原型模式、工厂模式以及原型继承机制;至于其他相关概念,则不在本次学习范围内。

1、继续升级你的问答应用:

采用Twitter Bootstrap这一布局方案以提升问答模块的专业视觉呈现。同时作为额外奖励利用其标签控件(译者注:原标题失效已作相应修改)来展示问题内容每个标签下标明具体问题信息。

掌握Handlebars.js技术,并将其应用于问答应用开发。请确保在JavaScript代码中避免任何HTML片段。如今我们的问答应用已达到一个更高的水平。

统计活跃用户的成绩数据,并对其与其他活跃用户的排名进行对比分析。

在完成 Backbone.js 和 Node.js 的学习后,在开发实践中你会运用这两种现代化 JavaScript 框架来重写问答系统的代码架构,并将其转化为一个功能完善的单页面 Web 应用程序。与此同时,在 MongoDB 数据库中存储用户的注册信息与学业成绩。

3、接下来:规划一个项目的框架,并迅速推进项目研发工作。遇到问题时参考 《JavaScript权威指南》或者《JavaScript高级程序设计》这两本权威书籍。另外需要做到的是成为Stack Overflow的技术活跃用户,并且要主动参与讨论区的问题解答与技术交流活动。

继续提升

1、精通backbone.js

2、中高级JavaScript进阶

3、不侧漏精通Node.js

一些鼓励的话

愿你在学业上一帆风顺!愿你的努力永不停息。当你感到沮丧、认为自己愚蠢时(你可能会有这种想法),请记住:其他人也会有类似的经历。

如果新人们刚入门的话,在面对未知的时候可能会感到些许困难。面对未知则充满热情的年轻人则不会有任何顾虑,在自己喜欢的事情上投入大量时间与精力。所有的困难对他们而言不过是一时性的阻碍罢了。

但过了青少年期后你会渴望迅速取得成效?因为那时你没有那么多时间投入到细节工作中去进行长时间学习或研究。然而这些细节是必须要深入理解的,请不要因担忧而沮丧——努力完成课程任务,并找出所有的缺陷直到彻底掌握所有细节为止吧!当达到目标时会认识到付出的努力值得付出,并会发现编程既有趣又令人愉悦——你的投入时间和精力都将获得可观的回报

一个人必须去体验并体悟构建程序所带来的强烈愉悦感。在逐步掌握知识点的同时,并行地将程序架构起来时,在这个过程中你将会感受到对学习进程带来的激励与认同,并带来一种极为美妙的满足感。

当你即将成为光荣的程序员时(You are about to become a respected programmer),你会意识到那些曾经忍受过的艰难困苦都是值得的(are worth it)。因为你的职业前景非常光明(your career outlook is excellent),作为JavaScript开发者(as a JavaScript developer)也是你的优势所在(a strength in your skill set)。与许多像你一样的开发者曾经克服了最棘手的技术挑战(just like you, many other developers have successfully tackled the most challenging technical problems)相比,在面对困难时你需要始终保持坚定和毅力(you must persist through every challenge with determination and resilience)。

当您在学习上取得成就时,请无顾虑地将您的研究成果与我们分享。即使是一个极其微小的项目——小到显微镜都看不到的小工程——我们依然期待您的贡献。

我现在主要从事前端开发工作,并已创建一个名为"980500148"的学习交流群。大家共同参与学习与分享,在群里有专门的群主负责定期更新各类学习资料和面试题文档。如需进一步交流,请加我个人微信[980500148]进行沟通。我的小助理微信为lyf___1201

全部评论 (0)

还没有任何评论哟~