译者注:涉及的前端技术越来越多!原文:10thingstolearnonthewaytobecomeaJavaScriptMaster译者:Fundebug为了保证可读性,本文采用意译而非直译。另外,本文版权归原作者所有,转载仅供学习。既然你对这篇文章感兴趣,我想你应该是一名前端开发人员,也许你有一份好工作,个体户甚至是自由职业者。不知道你的前端技术怎么样。也许您是新手或高级开发人员。如果你想成为JavaScript高手,我在这里列出12个必备知识:1.控制流(ControlFlow)让我们从最基础的开始。当然,也是最重要的知识点。如果你连这一点都不明白,你的编码生活将非常艰难。ifelse:如果你连这个都不知道,你以前是怎么写代码的?switch:当需要处理的case很多的时候(>2),用它是对的。for:不要写重复的代码,用for。forof和forin都非常方便。一个很大的优势是for循环是阻塞的,可以与asyncawait一起使用。高阶条件语句:使用三元运算符或逻辑判断。如果你想保持代码干净,甚至不需要存储中间值,你可以这样做。//ternaryconsole.log(newDate().getHours()<12?"GoodMorning!":"Timeforasiesta");//逻辑运算符constisJsMaster=prompt("AreyouaJavaScriptmaster?")==="true";console.log(isJsMaster&&"精通码农");2.异常处理不管前端还是后端工程师,作为新手,都经常使用console.log或者console.error来处理错误。为了编写健壮的应用程序,您需要改掉到处使用console.log的习惯,构建自己的异常处理程序,然后优雅地处理异常。你可能对如何处理异常很感兴趣,可以看看我写的这篇文章。3.数据模型需要搞清楚如何组织数据(合并或分离),这不仅仅是在数据库中如何定义它的模型,还包括函数参数、定义的变量、对象等。constcalcShape=(width,height,depth,color,angle)=>{...}constcalcShape=({width,height,depth,color,angle})=>{...}4.异步这是一个很重要的特性JavaScript,要么需要从服务器获取数据,要么在服务器端异步处理请求。在几乎所有情况下,您都必须处理异步。如果你不了解async,你可能会遇到非常奇怪的错误,以至于需要花费数小时才能弄清楚。如果你了解异步,但没有完全理解它,你可能会陷入“回调地狱”。今天,最好的方法是使用Promises和asyncawait。5.操作DOM对于开发者来说,通常他们已经学会了jQuery,似乎不需要知道如何直接操作DOM。即使直接使用前端框架,也完全不需要操作DOM。但是,我认为这是理解前端JavaScript的重要组成部分。了解DOM的工作原理以及如何操作DOM元素将使您更清楚地了解网页的工作原理。另外,尽管使用了前端框架,但总有需要直接操作DOM的情况。例如,如果你只是想访问某个元素,你肯定不想将整个jQuery导入到项目中。6.Node.js/Express作为前端开发者,还是需要学习一点Node.js的。最好知道如何用Express快速架设服务器并使用路由功能。作为一种“脚本”语言,JavaScript非常适合定义各种自动化任务,因此了解如何读取文件和操作Buffer可以帮助您构建工作流。7.函数式编程函数式编程和面向对象编程哪个更好的争论已经存在了很长时间。实际上,您可以使用任何一种编程方法来达到相同的目的。在JavaScript中,事情变得简单,您可以选择两种方式。和lodash一样,它从功能的角度提供了很多实用功能。现在甚至很多功能都已经内置了,不用导入外部库,比如map、reduce、filter、forEach、find。8.面向对象编程与函数式编程类似,你也需要熟悉面向对象的JavaScript编程。很长一段时间我都抵制JavaScript中的面向对象,后来发现用对象/类/实例确实更合适。类广泛用于React、Mobx或一些自定义构造函数中。9.前端框架当今最流行的三个框架:React.js、Angular和Vue.js。如果您正在寻找一份前端工作,那么您的简历中至少需要列出其中一项。尽管它们更新很快,但您需要了解它们的总体工作原理。而且,了解底层原理可以让你更好地使用框架来编写应用程序。如果您仍然不确定要买哪辆车,我建议您学习React.js。我已经使用它好几年了,不后悔我的选择。(译者推荐Vue.js,好用,上手快)10.编译(transpilation)/打包不幸的是,这项工作在web开发中占了很大比重。不幸的是,一方面我不能说,它允许我们编写具有最新功能的代码。我说不幸的是因为我们需要时刻关注一些旧版本浏览器不支持的新功能,需要翻译成低版本浏览器解释的代码。业界通用的标准是babel.js,你需要熟悉它。打包可以用大哥Webpack,或者后起之秀parcel。我倾向于使用parcel,它并不完美,但性能良好且易于配置。11.正则表达式不仅适用于JavaScript,但它们确实有用且令人困惑。掌握正则表达式需要一定的时间,不需要把所有的情况都背下来,边查边用。12.测试正如PaulKamma所指出的,测试确实是软件开发中非常重要的一部分。JavaScript也不例外,最好(并且肯定)在发布新功能之前测试好您的代码。在某些情况下,甚至值得手动进行。当然,使用自动化测试工具是可以一劳永逸的。测试包括:单元测试、端到端测试、加载速度测试、安全测试或前端测试(组件是否加载)。市面上已经有很多测试工具,比如enzyme、jasmine、mocha、chai等等。我目前最喜欢的是ava.js。关于FundebugFundebug专注于JavaScript、微信小程序、微信小游戏、支付宝小程序、ReactNative、Node.js和Java在线应用的实时BUG监控。自2016年双十一正式上线以来,Fundebug累计处理了10亿+错误事件,其付费客户包括谷歌、360、金山、人民网等众多品牌公司。欢迎大家免费试用!转载版权声明请注明作者Fundebug及本文地址:[https://blog.fundebug.com/201...
