JavaScript给初学者的印象总是那么的“杂而乱”,相信很多初学者都在找轻松学习JavaScript的途径。

我试着总结自己学习多年JavaScript的经验,希望能给后来的学习者探索出一条“轻松学习JavaScript之路”。

JavaScript给人那种感觉的原因多半是因为它如下的特点:

A:本身知识很抽象、晦涩难懂,如:闭包、内置对象、DOM。

B:本身内容很多,如函数库,对象库就一大堆。

C:混合多种编程思想。

它里面不但牵涉面向过程编程思想,又有面向对象编程思想,同时,它的面向对象还和别的编程语言(如:C++,JAVA,PHP)不大一样。

就好像又是新的一样,让你对曾经学的面向对象产生了怀疑......

D:辛苦学习后又看似和实际应用脱节。

通常学了很久的js基础之后,变量、函数、对象你也都略知一二,但一到公司开发项目的时候,却又难以下手。

因为公司在开发实际项目的时候通常都是直接用它的衍生库,如:jquery,angular,、boostrap,amaze,layui,ueditor等,而这些库又多如牛毛,同时还有自己的难点。

让你都不知道该学哪个好,甚至都怀疑自己学的是不是js了,好像有多个版本的js一样,总是学不完......

那么,怎么才能在js领域内学的轻松甚至游刃有余呢?我总结了一些实战意义的js学习经验:

首先要紧紧抓住他的地位

时刻都不能忘记,否则很容易犯“一叶障目不见泰山”的错误。

不要学了很久就知道js是编程语言,就是写代码、而且特点就是乱七八糟就完了,那样是学不好js的。

要时时抓住它的地位,确切的说是它在整个WEB中的地位:它属于前端的核心,主要用来操控和重新调整DOM,通过修改DOM结构,从而来达到修改页面效果的目的。

要用这个中心思想去指导后续的一切js的学习,并且形成条件反射。

要有一条清晰的学习路线

学习路线如下:

A:js基础部分,如:定义变量、函数、数组、字符串等的处理,内置函数、内置对象等。

B:js面向过程编程思想,封装出各个函数,试着用这些去做一些常见的小功能,如:选项卡,自定义多选按钮,自定义播放器,3D幻灯片;

C:js面向对象编程思想,试着去封装一些你自己的对象,提供出有意义的接口出来;

D:学了上述的内容,然后学常用的库,这里必须学jquery;

E:学基于Jquery之上的常见插件,如:bootstrap,Layer,富文本编辑器等。

F:综合应用上面的多种库写实际项目的模板,多写几套。

注意学习的方法

学习方法总结如下:

A:多买几本国外的js书籍,不要购买那种20天精通之类的书。

否则你是很难学通的,更怕的是:本来你买本好书自学3个月可能学会的,它们硬是能折腾你两年......

书籍推荐(仅供参考)

《JavaScript DOM编程艺术》

《JavaScript权威指南》

《javaScript DOM高级程序设计》

《JavaScript设计模式》

《锋利的jquery》

争取把书上的功能都自己练习多次,不是一次。书读百篇,其义自见。

B:从多角度去学习和领悟

充分调动你所学的东西,从多角度的去做某一功能,如:以前你是从面向过程角度做的,

现在改为从面向对象的角度再来做,或者继续做成可以直接使用的插件,提供属性、方法等出来。争取让你做的这个功能逐渐能使用到实际项目中来。

这样的好处:既综合应用了你的所学,又能有实际意义。

C:一定不要好高骛远

不要放过哪怕很小的动手机会,如做一个选项卡。

千万不要认为有了类似的甚至更好的插件就不需要自己写了,知识是别人的,不是你的,你即使会用了也对你的技术技能水平没有任何提升。

你要多问自己,如果要我来做,我该怎么做?

D:脚踏实地的同时,也不要脱离实际

多看现在网上已经出现的效果好的功能,让它去激发你的学习热情,尽量去学着模拟,调动你的知识去和实际相结合。

E:多写总结

这种总结不但包括源代码、显示效果截图,还应该很容易犯的错误和对应的解决方法以及最后一两句精简的结论性语句。

对自己写的总结不是写完了就了事了,要多回顾,多改进,多精简。到做项目的时候,应该是看里面的一两句话就知道是讲什么了,而不要再去看长篇大论了。

F:构建知识导图

这个可以让你越学越清晰,你可以按你喜欢的任何形式去做,只要自己印象深刻就行。

注意:知识导图也应该是经常修改、修正,让它更合理、更清晰。

学习注意事项

我目前是在职前端开发,如果你现在也想学习前端开发技术,在入门学习前端的过程当中有遇见任何关于学习方法,学习路线,学习效率等方面的问题,你都可以申请加入我的前端学习交流裙:前面:600 中间:610 最后:151 里面聚集了一些正在自学前端的初学者,裙文件里面也有我做前端技术这段时间整理的一些前端学习手册,前端面试题,前端开发工具,PDF文档书籍教程,需要的话都可以自行来获取下载。

A:充分利用一切手段

很多人总感觉时间紧,没有大块的时间学习。我要说你不会学了,你不应该只是抱怨,而是要利用一切手段去学习,要知道,不一定只有看书才叫学习。

当你冷静的坐在某个地方,思考了一下,总结了一下,你也都叫学习,但凡有灵感,就可以记录下来,比如:记录在手机上,等方便了再记录在专门的地方。这都叫学习。

B:贵在坚持

要沉的下心。没有一蹴而就的成功,否则那也不是成功,只能叫“侥幸”。

不但要老老实实的把每个功能都试着去实现,而且要精益求精的不断去修正,这个过程是漫长的,也是考验一个人是否是人才的标准。

C:注意培养信心

此时的你,不适合一来就看很复杂很炫的网页效果的源代码,也不适合一来就学jquery,angular,vue,bootstrap这些东西。

这些内容包含了很多深奥的知识在里面,在没有任何基础的情况下直接学这些,会严重打击你的自信心。

而此时你是弱小的,你需要的是培养信心,而不是反过来,否则结局很可能是“夭折”,离学有所成也就遥遥无期了。

D:多跟学的好的过来人学习

站在巨人的肩上,才能看的更远。

E:不要浪费在工具的不停选择上

js的编辑工具很多,如果无从下手,建议使用:sublime,或者使用Hbuilder;很多公司里的技术人员都用这些,你直接用这个也减少了和别人之间的沟通问题。

我也是用这个,感觉很好。

最后总结

感觉js学起来“杂而乱”的原因是因为你太“聪明”了,一开始就管的太宽,利害得失也计算的太精细。

要求太完美则心里承受能力下降,很容易出现“障”。此时,你应该“笨”一些,不要考利那么长远,“傻人有傻福”,只要做好今天就够了。

一些不合理的学习方法和心态也让你迷失了自我:如:心浮气躁、眼高手低、好高骛远,这些都会让你在“乱七八糟”的js面前深陷迷雾、不能自拔。

此时,你应该重新定位自己的位置,重新去认识js,放下包袱,方能轻松上阵。把杯子先倒空,才能灌新水......

其实,js是前端的核心。影响越来越深的互联网+会渴求越来越多的js人才,只有经历过真正刻骨铭心的学习经历,才能造就出赢得未来的真正精英。

对于初学者,如何轻松学习JavaScript?相关推荐

  1. 轻松学习JavaScript十一:JavaScript基本类型(包含类型转换)和引用类型

    一值的类型 早在介绍JS的数据类型的时候就提到过基本类型和引用类型,不过在说两种类型之前,我们先来了解一下变量的 值的类型.在ECMAScript中,变量可以存在两种类型的值,即原始值和引用值. (1 ...

  2. 【JavaScript】巧用思维导图轻松学习JavaScript的后续来了

    巧用思维导图轻松学习JavaScript的后续来了 作用域--预解析以及代码执行 JavaScript的对象 内置对象 Math对象 日期对象 京东倒计时 前期更新了JavaScript 但是内容还没 ...

  3. 分针网——怎么轻松学习JavaScript

    js给初学者的印象总是那么的"杂而乱",相信很多初学者都在找轻松学习js的途径. 我试着总结自己学习多年js的经验,希望能给后来的学习者探索出一条"轻松学习js之路&qu ...

  4. 嵌套 思维导图_看我怎么用思维导图,来轻松学习JavaScript,值得收藏

    JS的入门到真实项目的实践 js的历史由来js书写的位置js的基本语句js的变量以及变量命名规范数据类型 (面试)运算符循环数组函数作用域预解析完结 前面更新了h5的相关知识,接下来学习js,根据上面 ...

  5. 【JavaScript】巧用思维导图来轻松学习JavaScript

    js的入门到真实项目的实践 js的历史由来 js书写的位置 js的基本语句 js的变量以及变量命名规范 数据类型 (面试) 运算符 循环 数组 函数 作用域 预解析 完结 前面更新了h5的相关知识,接 ...

  6. 轻松学习JavaScript十七:JavaScript的BOM学习(二)

            JavaScript计时事件 通过使用JavaScript中的BOM对象中的window对象的两个方法就是setTimeout()方法和claerTimeout()方法,我们 有能力作 ...

  7. 轻松学习JavaScript二十七:DOM编程学习之事件模型

    在介绍事件模型之前,我们先来看什么是事件和什么是event对象. 一事件介绍 JavaScript事件是由访问Web页面的用户引起的一系列操作,使我们有能力创建动态页面,事件是可以被 JavaScri ...

  8. 轻松学习JavaScript二十二:DOM编程学习之节点操作

    DOM编程不仅仅可以查找三种节点,也可以操作节点,那就是创建,插入,删除,替换和复制节点.先来看节点 操作方法:        还是借用一贯的HTML代码: <!DOCTYPE html PUB ...

  9. 轻松学习JavaScript二十:DOM编程学习之获取节点

    我们这里所说的获取节点包含元素节点,属性节点和文本节点.通常,通过DOM我们就能够操作HTML元素.为 了做到这件事情,您必须首先找到该元素.W3C提供了比较方便简单的定位节点的方法和属性,以便我们快 ...

最新文章

  1. H5地理定位获取用户当前位置、城市
  2. 自定义控件的子控件支持设计模式
  3. 子程序与中断程序的异同_【干货】plc怎样理解中断功能,其作用是什么?
  4. 代码艺术~优雅的编程字体及对字体的感觉
  5. 杭电 1284 钱币兑换问题【完全背包求方案总数】
  6. 数据可视化【十三】地区分布图
  7. python编程入门-Python编程:从入门到实践 PDF 中文扫描版
  8. Controller之间传递数据:协议传值
  9. Unix网络编程学习笔记
  10. WPA之一次第三方软件导致的白屏问题分析
  11. i3 10105F参数配置 i3 10105F怎么样
  12. ICC II setupfloorplan
  13. i技术会 | 爱奇艺品牌广告算法探索和实践
  14. java实现生成SVG格式的二维码
  15. CHB-MIT波士顿儿童医院癫痫EEG脑电数据处理(二)
  16. python爬取微博评论点赞数_Python selenium爬取微博数据代码实例
  17. 数据中台应用原型下载-深圳市政府数据开放平台低保真原型设计-Axure9
  18. 从android恢复到iphone,iPhone换到安卓机有多难适应?看看是怎么恢复过来的!
  19. 米筐量化如何安装使用?
  20. 《视频解密》中文版(第四版) 第六章 数字视频接口(第三部分)

热门文章

  1. 极客c语言课程设计,c语言课程设计之实习报告共5天完整.doc
  2. python 有限域函数库_深入比特币之有限域运算
  3. 网站的php主题怎么删掉,简介如何去除WordPress主题版权保护的方法 | 垃圾站
  4. 1019 General Palindromic Number
  5. Spring(10)——bean作用范围(二)—自定义scope
  6. PHP -- Traits新特性
  7. LINQ-to-SQL那点事~耳目一新的partial class 和 partial method
  8. 浅谈Scala 2.8的包对象(package object)
  9. TCP/IP常用端口说明
  10. Ubuntu 汉字显示一半的修复