前端javascript初学者,JAVASCRIPT前端开发工程师

提示：扫一扫查出行
【扫一扫了解最新限行尾号】
复制提示

Web前端新手应该知道的JavaScript开发技巧有哪些?

今天小编要跟大家分享的文章是关于Web前端新手应该知道的JavaScript开发技巧有哪些?熟悉Web前端的小伙伴都知道，Javascript

的很多扩展的特性是的它变得更加的犀利，同时也给予程序员机会创建更漂亮并且更让用户喜欢的网站。

尽管很多的开发人员都乐于颂扬javascript，但是仍旧有人看到它的阴暗面。

使用很多javascript代码的Web页面会加载很慢，过多的使用javascript使得网页丑陋和拖沓。很快如何有效地使用

javascript成为一个非常火热的话题。

今天小编就为Web前端新手准备了这篇JavaScript开发技巧，希望能够对你有所帮助，下面我们一起来看一看吧!

1、尽可能的保持代码简洁

可能大家都听到过了N遍这个代码简洁问题了。作为一个开发人员你可能在你的代码开发过程中使用了很多次，但千万不要在js开发中忘记这点。

§尽量在开发模式中添加注释和空格，这样保持代码的可读性

§在发布到产品环境前请将空格和注释都删除，并且尽量缩写变量和方法名

§使用第三方工具帮助你实现压缩javascript。

2、思考后再修改prototypes

添加新的属性到对象prototype中是导致脚本出错的常见原因。

yourObject.prototype.anotherFunction='Hello';

yourObject.prototype.anotherMethod=function(){...}

在上面代码中，所有的变量都会被影响，因为他们都继承于yourObject。这样的使用会导致意想不到的行为。所以建议在使用完后删除类似的修改。

yourObject.prototype.anotherFunction='Hello';

yourObject.prototype.anotherMethod=function(){};

test.anotherMethod();

deleteyourObject.prototype.anotherFunction='Hello';

deleteyourObject.prototype.anotherMethod=function(){};

3、DebugJavascript代码

即使最好的开发人员都会犯错。为了最大化的减少类似错误，请在你的debugger中运行你的代码，确认你没有遇到任何细微的错误。

4、避免Eval

你的JS在没有eval方法的时候也可以很好的工作。eval允许访问javascript编译器。如果一个字符串作为参数传递到

eval，那么它的结果可以被执行。

这会很大的降低代码的性能。尽量避免在产品环境中使用eval。

5、最小化DOM访问

DOM是最复杂的API，会使得代码执行过程变慢。有时候Web页面可能没有加载或者加载不完整。最好避免DOM。

6、在使用javascript类库之前先学习javascript

互联网充斥着很多的javascript类库，很多程序员都往往使用js类库而不理解负面影响。强烈建议你在使用第三方类库之前学习基本的JS

代码，否则，你就准备着倒霉吧。

7、不要用“SetTimeOut”和“Setinterval”方法来作为“Eval”的备选

setTimeOut("document.getID('value')",3000);

在以上代码中document.getID(‘value’)在setTimeOut方法中被作为字符串来处理。这类似于eval

方法，在每个代码执行中来执行一个字符串，因此会降低性能，因此，建议在这些方法中传递一个方法。

setTimeOut(yourFunction,3000);

8、[]比newArray();更好

一个常犯的错误在于使用当需要数组的时候使用一个对象或者该使用对象的时候使用一个数组。但是使用原则很简单：

“当属性名称是小的连续整数，你应该使用数组。否则，使用一个对象”_DouglasCrockford,JavaScript:Good

Parts的作者.

建议：

vara=['1A','2B'];

避免：

vara=newArray();

a[0]="1A";

a[1]="2B";

9、尽量不要多次使用var

在初始每一个变量的时候，程序员都习惯使用var关键字。相反，建议你使用逗号来避免多余的关键字，并且减少代码体积。如下：

varvariableOne='string1',

variableTwo='string2',

variableThree='string3';

10、不要忽略分号“;”

这往往是大家花费数个小时进行debug的原因之一。

我很确信你肯定也在其它的文章中阅读过以上相关的内容，但是大家可能往往都忽略了很多基本的规则。你是不是也曾经忽略过分号。是不是也遇到过eval

关键字问题导致性能问题?

以上就是小编今天为大家分享的关于Web前端新手应该知道的JavaScript

开发技巧有哪些?的文章，希望本篇文章能够对刚刚接触Web前端行业的新手们有所帮助。想要了解更多Web前端知识记得关注北大青鸟Web前端培训官网!

*声明：内容与图片均来源于网络(部分内容有修改)，版权归原作者所有，如来源信息有误或侵犯权益，请联系我们删除或授权事宜。

相关问答

Q1: 帮助Web前端初学者快速掌握JavaScript技术的方法

今天小编要跟大家分享的文章是关于帮助web前端初学者快速掌握JavaScript技术的方法。当你试图学习JavaScript或其他编程语言的时候，你通常会遇到如下挑战：

·一些概念让你感到困惑，特别是如果之前学过其他类型的语言。

·很难找到学习的时间(或者动力)去学习。

·你很容易忘掉之前学到的东西。

·JavaScript工具太多并且经常更新，以至于很难找到学习的切入点。

幸运的是，这些难题最终能够被克服。在这篇文章，将展示六个能够帮助你更快、更开心、更高效地学习JavaScript的六个思维技巧。下面来和小编一起看一看吧！

1、不要对未来的忧虑干扰你现在的学习

有些JavaScript初学者会问刚开始要学习哪种框架，但是如果你还没能熟练使用原生JavaScript，你就不应该问这种问题。因为你会花很多时间研究各种框架而得不到进步。

走出这个陷阱的一个方法是制定一个学习路径图。例如，要成为前端开发，你的路径图可能是下图。在将来你能够使用HTML和CSS制作动态页面。

将上图步骤分开执行，每个时间段只专注于提高一项技能，你将不会把时间浪费在担心后面的技能上。

2、不要让自信骗你进入持续遗忘的陷阱

快速理解一个概念会是JavaScript进步的最大阻碍，下面我将解释。

当你遇到一个知识点，而你好像理解了，你很可能抑制不住内心跳到下一个知识点的冲动。现实可能是你会理解下一个知识点然后继续跳到下一个知识点。但是，很快你会到达一个节点，在这个节点你发现自己已经忘了前面所学，于是你需要回过头复习，你快速瞟了一下之前所学然后又继续学习新的知识。但是现在，你忘记了其他东西。你一直重复这种继续-回顾-继续-回顾模式直到你发现自己完全迷失。你开始沮丧，想要休息，然后当你开始重振旗鼓，却发现自己已经忘掉所有。

幸运的是，我们有两个应对上述问题的方法：

1、一次只学一样东西

2、做练习-实际上是敲代码

当你学习一个新的概念，你要将它实践出来，练习它，与它和善相处，甚至能够将它与其他概念联系到一起。当你学习一个示例，最重要的是你要自己将代码敲出来，这样能帮助你吸收它。另外，一次只学一个东西能够帮助你巩固所学，因为记忆更少的东西更容易。

这个过程看起来貌似比阅读然后快速跳到下一个知识点要花费更长的时间，但是实际上它所花的时间更少，因为这样你就不需要频繁复习之前所学。我在好几个场合后才艰难的领悟到这个道理。

3、使用正确的思维方式练习

很多人认为敲代码是烦人的重复性工作，所以他们通常会跳过这个步骤试着寻找捷径。如果你试图为JavaScript练习寻找捷径，你将会为此花费更多的时间。但是我们如何才能使得敲代码更加的有趣，使得我们愿意去敲代码呢?

试着改变为下面的思维模式：

如果你刚学了一个JavaScript概念，然而你被告知不能使用它，对此你感觉如何?个人来说我会感到有点恼火，特别是为了弄懂它我花费了宝贵的时间。这就像是一个小孩得到了一个新的玩具，但却被限制不能玩它。

当你学习JavaScript的新知识，试着将这个知识点视作一个新玩具，例如新车、一双新鞋、或任何你觉得值得有趣的东西。然后，不要把敲代码当成工作，将敲代码视作你正在玩游戏。你正在使用刚学的技能做一些很酷的事情。给自己惊喜，把成果展示给你的朋友。

带着游戏的思维模式你将学得更快，将记忆的更牢，同时你将体会到更多乐趣。

4、使用Facebook技巧为编程腾时间

人们遇到的一个普遍问题是，他们通常找不到时间去敲代码。通常，这些人会花好几个小时浏览例如Facebook、YouTube、Wikipedia或者Reddit这样的网站。无论你是否符合上述描述，我们都能从中学到一些东西。

我当然有时间只浏览Facebook一会儿，但通常我会在上面待好几个小时浏览往返。这是如何发生的?我认为原因在于，刚开始我并没打算花在这上面花费那么多时间。开始行动是做一件事情最困难的部分，所以将目标设定的足够小能够帮助我们进入状态。如果有人问我是不是打算花几个小时浏览Facebook，我会回答不，因为我没有时间。然而，对于仅仅尝试一下我是能够接受的，这也是我能够沉浸其中的方法。

好消息是，你能够对敲代码运用同样的心理技巧。不要计划花几个小时敲代码，因为你会发现自己没有时间。相反的，告诉自己只敲三分钟代码。这样你就不需要为寻找敲代码的时间烦心。

5、思考的慢你将学得更快

这一条听起来违反直觉，所以下面我将用一个故事来解释。

我的一个朋友又一次对JavaScript的一个特性感到困惑。我让他将他知道的解释给我听，然后告诉我哪儿让他困惑。当它向我解释代码，我发现他在跳步。

“等会儿!”我说道。“慢慢来，然后将这些一步步解释给我听。”

我的朋友直接将整个代码的功能总结给我听。

我再次让他暂停。“你还是在跳步。再解释一次，这次我需要你一步步将每一行代码发生了什么解释给我听。”

这一次，我的朋友能够更好的解释代码是如何运行的。关键在于他花时间去理解每一行代码而不是试图一下理解所有。

在上述这种案例中，思考的更慢实际上让你学得更快。

6、在写复杂代码前先用简单语言写下

如果你要写的代码是复杂并且不常见的，先用简单语言将代码写下。这样，你能够你能够在真正写之前知道自己要做什么。下面是使用这个方法的两个好处：

1、你将更容易更快速的写代码，因为你不需要时刻停下来思考自己将要怎么做。

2、由于你知道代码要干什么，能够更好的排除错误。

总结：

我们已经讲了好几个更快速学习JavaScript的方法，但是你也能将上述方法运用于学习其他东西。下面是上述方法的概括：

1、不要再想将要学什么，沉浸于现在

2、通过把新技能当做玩具使得练习更有趣

3、就像浏览Facebook、YouTube之类的网站一样，在敲代码前告诉自己只敲几分钟，这样你就拥有了敲代码的时间

4、慢下来，小步向前，你将学得更快

以上就是小编今天为大家分享的关于帮助web前端初学者快速掌握JavaScript技术的方法的文章，希望本篇文章能够对正在从事web前端学习的小伙伴们有所帮助，想要了解更多web前端相关知识记得关注北大青鸟web培训官网，最后祝愿小伙伴们工作顺利，成为一名优秀的web前端工程师。

来源：#/shehui/2016/10-24/11717064.html

Q2: 自学前端要如何开始学起？

前端自学者存在的学习误区：

1、所学东西可能已过时

奉为经典的东西可能已经过时，或者已经有了更好的替代者，而你获取信息的渠道有限，消息滞后，导致学习的内容也相对滞后。

2、学习方法盲目。

看书看不懂就找视频类教程学习，觉得教程跟自己的口味不符就另寻他法，因为自己缺少对资源的辨识能力，总是在没有清晰规划学习线路的情况就盲目学习，导致无效学习时间过长而收获寥寥。

3、只有理论，缺乏真实项目锻炼。

对技术的理解停留在理论层次，而缺乏真实企业项目的历练，如果没有相关实习或工作经历，对前端岗位具体的责任划分和工作流程了解不充分。

如何自学前端知识：

自学方法：

1、作为一个初学者，你必须明确系统的学习方案，我建议一定有一个指导的人，全靠自己学，放弃的几率非常大，在你对于web前端还没有任何概念的时候，需要一个人领进门，之后就都靠自己钻研，第一步就是确定web前端都需要哪些内容，并且在多少时间内学完，建议时间6个月保底。

2、视频为主，书为辅。很多初学者在学习前端的时候非常喜欢去买书，但是最后的结果是什么？看来看去什么都不会写，所以在这里给大家提醒，书可以看，但是是在建立于你已经对于某个知识点有了具体操作的执行后，在用书去巩固概念，这样更加利于你对于知识的理解。

3、对于学习技术来讲，掌握一个学习方法是非常重要的，其实对于学习web前端来讲，学习方法确实很多都是相通的，一旦学习方法不对，可能就会造成“方法不对，努力白费”。其实关于这方面还是很多的，我就简单说个例子，有的人边听课边跟着敲代码，这样就不对，听课的时候就专心听，做题的时候就专心做题，这都是过来人的经验，一定要听。根据每个人的不同，可能学习方法也会有所出路，找到适合你自己的学习法方法是学习的前提。

4、不建议自己一个人瞎学，在我了解学习编程的这些人来看，从零基础开始学并且最后成功做这份工作的其实并没有几个，我觉得大部分原因就是因为他们都不了解web前端是干什么的，学什么的，就盲目的买书看，到处找视频看，最后看着看着就放弃了，所以我建议初学者在没有具体概念之前，还是找有经验的人请教一下，聊过之后你就会知道web前端具体是干什么的，该怎么学，这是我个人的小建议，可以不采纳。

学前端的话，书籍是必不可少的：

1、《JavaScript高级程序设计(第3版) 红皮书》，适合有一定编程经验的Web应用开发人员阅读，也可作为高校及社会实用技术培训相关专业课程的教材。

2、《JavaScript权威指南(第6版)》犀牛书，本书不仅适合初学者系统学习，也适合有经验的 JavaScript 开发者随手翻阅。

3、《JavaScript DOM编程艺术 (第2版)》，本书在简洁明快地讲述JavaScript和DOM的基本知识之后，通过几个实例演示了专业水准的网页开发技术，透彻阐述了平稳退化等一批至关重要的 JavaScript编程原则和最佳实践，并全面探讨了HTML5以及jQuery等JavaScript库。

4、《CSS权威指南(第三版)》，不管你是一个有经验的Web开发人员还是一个彻底的初学者，《CSS权威指南(第3版)》都是你的CSS学习源泉。

5、《JavaScript设计模式》，适合JavaScript初学者、前端设计者、JavaScript程序员学习，也可以作为大专院校相关专业师生的学习用书，以及培训学校的教材。

6、《你不知道的JavaScript(上中下卷) 》，本书既适合JavaScript语言初学者了解其精髓，又适合经验丰富的JavaScript开发人员深入学习。

7、《Vue.js权威指南》，该书内容全面，讲解细致，示例丰富，适用于各层次的开发者。

学习路线：

第1阶段：前端页面重构(4周)

内容包含了：(PC端网站布局项目、HTML5+CSS3基础项目、WebApp页面布局项目)

第2阶段：JavaScript高级程序设计(5周)

内容包含：(原生JavaScript交互功能开发项目、面向对象进阶与ES5/ES6应用项目、JavaScript工具库自主研发项目)

第3阶段：PC端全栈项目开发(3周)

内容包含：(jQuery经典交互特效开发、HTTP协议、Ajax进阶与PHP/JAVA开发项目、前端工程化与模块化应用项目、PC端网站开发项目、PC端管理信息系统前端开发项目)

第4阶段：移动端项目开发(6周)