js给初学者的印象总是那么的“杂而乱”,相信很多初学者都在找轻松学习js的途径。
 
我试着总结自己学习多年js的经验,希望能给后来的学习者探索出一条“轻松学习js之路”。
 
js给人那种感觉的原因多半是因为它如下的特点:
 
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:构建知识导图
 
这个可以让你越学越清晰,比如:http://www.phpkhbd.com/sky.html,你可以按你喜欢的任何形式去做,只要自己印象深刻就行。
 
注意:知识导图也应该是经常修改、修正,让它更合理、更清晰。
 
注意事项

 
A:充分利用一切手段
 
很多人总感觉时间紧,没有大块的时间学习。我要说你不会学了,你不应该只是抱怨,而是要利用一切手段去学习,要知道,不一定只有看书才叫学习。
 
当你冷静的坐在某个地方,思考了一下,总结了一下,你也都叫学习,但凡有灵感,就可以记录下来,比如:记录在手机上,等方便了再记录在专门的地方。这都叫学习。
 
B:贵在坚持
 
要沉的下心。没有一蹴而就的成功,否则那也不是成功,只能叫“侥幸”。
 
不但要老老实实的把每个功能都试着去实现,而且要精益求精的不断去修正,这个过程是漫长的,也是考验一个人是否是人才的标准。
 
C:注意培养信心
 
此时的你,不适合一来就看很复杂很炫的网页效果的源代码,也不适合一来就学jquery,angular,vue,bootstrap这些东西。
 
这些内容包含了很多深奥的知识在里面,在没有任何基础的情况下直接学这些,会严重打击你的自信心。
 
而此时你是弱小的,你需要的是培养信心,而不是反过来,否则结局很可能是“夭折”,离学有所成也就遥遥无期了。
 
D:多跟学的好的过来人学习
 
站在巨人的肩上,才能看的更远。
 
E:不要浪费在工具的不停选择上
 
js的编辑工具很多,如果无从下手,建议使用:sublime,或者使用Hbuilder;很多公司里的技术人员都用这些,你直接用这个也减少了和别人之间的沟通问题。
 
我也是用这个,感觉很好。
 
总结

 
感觉js学起来“杂而乱”的原因是因为你太“聪明”了,一开始就管的太宽,利害得失也计算的太精细。
 
要求太完美则心里承受能力下降,很容易出现“障”。此时,你应该“笨”一些,不要考利那么长远,“傻人有傻福”,只要做好今天就够了。
 
一些不合理的学习方法和心态也让你迷失了自我:如:心浮气躁、眼高手低、好高骛远,这些都会让你在“乱七八糟”的js面前深陷迷雾、不能自拔。
 
此时,你应该重新定位自己的位置,重新去认识js,放下包袱,方能轻松上阵。把杯子先倒空,才能灌新水……
 
其实,js是前端的核心。影响越来越深的互联网+会渴求越来越多的js人才,只有经历过真正刻骨铭心的学习经历,才能造就出赢得未来的真正精英。
 
 
本文转载自分针网

分针网—每日分享: 怎么轻松学习JavaScript的更多相关文章

  1. 分针网—每日分享:HTML解析原理

    标准的web前端工程师需要知道 ◎浏览器(或者相应播放器)的渲染/重绘原理   这我得加把劲了.我还真的说的不是很清楚,我就G下,结果不是很多,找到了有一个,就记下来了...   以下部分来自hand ...

  2. 分针网——每日分享: jquery选择器的用法

    jQuery选择器是jQuery库的一大特色,用这些选择器不但可以省去繁琐的JavaScript 书写方式,还可以节省时间和效率,正是有这些jQuery选择器,才让我们更容易的操作JavaScript ...

  3. 分针网—IT教育:调皮的JavaScript

    JavaScript是一门有趣的语言,不仅有趣而且调皮,不同的内核的浏览器在解析的时候表现会有些差异,今天主要是抛砖引玉,和大家一起讨论一些在实际开发中比较常见但同时可能并没有过于在意的JavaScr ...

  4. 分针网—IT教育:作为PHP开发人员容易忽视的几个重点

    无论是学习什么样的一个开发.ASP开发.java开发.当学习还不是很久的时候,一般都是不知道它们的精华是在哪里,而现在很多的php程序员也是不知道PHP的精华所在,为什么perl在当年在商界如此的出名 ...

  5. 分针网—IT教育:使用CSS3制作导航条和毛玻璃效果

    导航条对于每一个Web前端攻城狮来说并不陌生,但是毛玻璃可能会相对陌生一些.简单的说,毛玻璃其实就是让图片或者背景使用相应的方法进行模糊处理.这种效果对用户来说是十分具有视觉冲击力的.本次分享的主题: ...

  6. 分针网—IT教育: jquery选择器的用法

    jQuery选择器是jQuery库的一大特色,用这些选择器不但可以省去繁琐的JavaScript 书写方式,还可以节省时间和效率,正是有这些jQuery选择器,才让我们更容易的操作JavaScript ...

  7. 分针网—IT教育: Html / CSS常见问题的解决方案

    1. 解决Safari下input光标过大   2. 设置浮层   3. CSS绘制三角形   4. 清除浮动   1) 浮动元素父级添加样式   2) 父元素后添加伪元素     3) 同样可以使用 ...

  8. 轻松学习 JavaScript——第 6 部分:JavaScript 箭头函数

    JavaScript箭头函数是ECMAScript 6中引入的编写函数表达式的一种简便方法.通常,在JavaScript中,可以通过两种方式创建函数: 函数语句. 函数表达式. 可以如下所示创建函数语 ...

  9. 轻松学习JavaScript十八:DOM编程学习之DOM简单介绍

    一DOM概述 DOM(文档对象模型)是HTML和XML的应用程序接口(API).DOM将把整个页面规划成由节点层级构成的文档. DOM描绘了一个层次化的节点树,执行开发者加入,移除和改动页面的某一部分 ...

随机推荐

  1. IDEA使用心得-----懒得截图了,但是大家应该看得懂

    1.界面设置,有白色和 黑色风格两种,我个人喜欢黑色风格,护眼最重要的是看着帅. 设置方法:FILE--Settings--Editor--Colors&Fonts--Scheme name ...

  2. @RequestParam--SpringMVC 注解系列文章(一)

    概述 RequestParam 注解是使用 SpringMVC 开发过程中,比较常用的一个注解,用于映射请求参数. 代码 package rex.springmvc.handlers; import ...

  3. 基于Intranet的零件库管理信息系统设计--part02

    昨天建了第一个子表,今天继续. 按照这个一个一个来: 轴承参数查询如下(来源:轴承查询型号网) 照这个来大概就是这么几个属性: 轴承主键,轴承名称,新型号,旧型号,内径,外径,宽度,Cr,Cor(话说 ...

  4. 【一】Swift 3.0 新浪微博项目实战 -整体框架搭建

    最近要接手swift,所以找了个视频跟着做一下实战项目,在此记录一下过程和心得 框架搭建和目录拆分 关键词:MVVM 架构,桥接文件 桥接文件用于引入OC的头文件,Swift就可以正常使用(宏除外). ...

  5. java集合体系

    Collection接口: 1.单列集合类的根接口. 2.定义了可用于操作List.Set的方法--增删改查: 3.继承自Iterable<E>接口,该接口中提供了iterator() 方 ...

  6. 【2017-03-31】JS-DOM操作:操作属性、彩虹导航栏、定时器、操作内容、创建元素并添加、操作相关元素

    一.操作属性 1.什么是属性: <div class="div" id="div1" style="" ></div> ...

  7. Wireless Intranet Captive Portal

    Wireless Intranet Captive Portal 配置AAA服务Radius认证 radius-server key 0 radius radius-server authentica ...

  8. Java基础学习(三)—面向对象(上)

    一.理解面向对象       面向对象是一种思想,是基于面向过程而言的,就是说面向对象是将功能等通过对象来实现,将功能封装进对象之中,让对象去实现具体的细节:这种思想是将数据作为第一位,而方法或者说是 ...

  9. Spring-data-redis操作redis知识汇总

    什么是spring-data-redis spring-data-redis是spring-data模块的一部分,专门用来支持在spring管理项目对redis的操作,使用java操作redis最常用 ...

  10. Java中boolean类型占用多少个字节

    为什么要问这个问题,首先在Java中定义的八种基本数据类型中,除了其它七种类型都有明确的内存占用字节数外,就boolean类型没有给出具体的占用字节数,因为对虚拟机来说根本就不存在 boolean 这 ...