Web前端入行门槛低,很多人在成为前端工程师后很容易进入工作的舒适区,认为该熟悉的业务已熟悉了,然后就是重复用轮子,这样很容易让自己的成长处于原地打转以及低水平重复的状态。

想要不被行业抛弃,就要努力提升自己。下面小编就分享Web前端程序员应该如何进阶提升自己:

一、入门

能够解决一些问题的水平。有一定的基础(比如最常见的HTML标签及其属性、事件、方法;最常见的CSS属性;基础的JavaScript编程能力),能够完成一些简单的Web前端研发需求。

举个例子:删除一字符串中指定的字符。

varstr="www.baidu.com/?page";str=str.replace('?page',"");alert(str);str=str.substring(0,str.indexOf("/"));alert(str);

首先不要苛责代码的对错严谨,毕竟每个程序员都有这样的一个过程;其次,这两段代码在这个实例里没有什么大过错,可能会有瑕疵,但能够解决问题(删除指定的字符),这就是这个级别的特征。

再举个例子:

// 计算系统当前是星期几var str = "";var week = new Date().getDay();if (week == 0) { str = "今天是星期日";} else if (week == 1) { str = "今天是星期一";} else if (week == 2) { str = "今天是星期二";} else if (week == 3) { str = "今天是星期三";} else if (week == 4) { str = "今天是星期四";} else if (week == 5) { str = "今天是星期五";} else if (week == 6) { str = "今天是星期六";}// 或者更好一些var str1 = "今天是星期";var week = new Date().getDay();switch (week) { case 0 : str1 += "日"; break; case 1 : str1 += "一"; break; case 2 : str1 += "二"; break; case 3 : str1 += "三"; break; case 4 : str1 += "四"; break; case 5 : str1 += "五"; break; case 6 : str1 += "六"; break;}alert(str);alert(str1);

入门”阶段是每个程序员的必经之路,只要“入门”,你就上路了。所谓“师傅领进门,修行靠个人”,有了这个“入门”的基础,自己就可以摸索着前进了。

二、进阶之路

将JavaScript、HTML、CSS之类的编码帮助手册里的每个方法/属性都通读几遍!只有将基础打好,以后的路才能走的顺畅。参考这些帮助文档,力争写出无瑕疵的代码。

这些编码文档小编建议不仅是在入门提高期看,在你以后每个阶段破阶的时候都应该看看,最基础的东西往往也是最给力的东西,有时能够给你带来意想不到的收获。

三、登堂

能够正确地解决问题。不管你是通过搜索网络,或者通过改造某些成品代码(jQuery/Dojo/Ext/YUI)案例,只要能够无错地完成需求。

同样以上面的那段“字符串剪裁”代码为例:

var str="www.baidu.com/?page";str=str.replace(/?page/,"");alert(str);

对比“入门级”的代码,不管是从代码量、代码效率、代码优美性、代码思路来说,“登堂”级的这个日期处理代码都要优秀很多。

四、成长之路

这个阶段虽然能够给出正确的解题方案,但是不一定是最优秀的方案。如何才能得到最优秀的方案呢?首先就是积累各种能够解决需求的方案,然后再验证每个方案,在这些方案中选择最好的一种。因此该阶段的进阶之路就是“行万里路,看万卷书”,积累各个需求的各个解决方案。

你可以扎身在专业论坛(蓝色理想、无忧、CSDN)里,通读所有的FAQ及帖子;你可以打开搜索引擎,穷举所有的搜索结果。自己建立测试环境一一验证这些代码:去揣摩每段代码的意图,去比较每段代码之间的差异。这两条路可以让你快速完成原始积累,当你再面对大多数需求时能够说这些问题我以前做过,那你就水到渠成地晋阶了。

五、进阶之路

此阶段进阶之路就是:切勿心浮气躁;你不再被需求牵着走,而是你牵着需求走。注重细节,注意那些当前需求里没有明文给出的细节:代码性能的差异、运行平台(浏览器)的差异、需求的隐性扩展、代码的向后兼容等等。

虽然Web前端并不难,但想要学精学好,并不容易。

Web前端3.0时代,“程序猿”如何“渡劫升仙”的更多相关文章

  1. web前端3.0时代,“程序猿”如何“渡劫升仙”?

    世界上目前已经有超过18亿的网站.其中只有不到2亿的网站是活跃的.且每天都有几千个新网站不断被创造出来. 2017年成果显著,网络上出现了像Vue这样的新JavaScript框架:基于用户体验流程的开 ...

  2. web前端从0开始--1

    博主以前没接触过web前端,最近刚开始学习. 在学习的同时,希望能不断整理总结.于是便有了此博客. 博主技术浅薄,并且第一次写此类博客,希望各位大牛能多多保函. 好了废话不多说了,开始正文. web前 ...

  3. web前端绘制0.5像素的几种方法

    最近完成了公司安排的移动web触屏开发,期间涉及到在移动设备上显示线条,最开始采用PC常用的css board属性来显示1个像素的线条,但是发现在移动设备上并不美观,参考淘宝.京东的触屏发现它们均是采 ...

  4. 献给那些每次调试时都要启动很多WEB项目的苦逼程序猿

    当一个解决方案包含多个WEB项目的时候,只要按F5调试,其它用不着的WEB项目也会自动添加到托盘里.很多新手都不知道如何解决这个问题,我也是刚知道. 在网上找了很多资料看到有2种解决方法: 1.把WE ...

  5. Web前端_微信小程序实战开发

    微信小程序开发实战教程 一.微信小程序 它是一种混合开发的方式. 是安装在微信中的程序(一个程序最多2M空间). 1.1 注册 1  2 点击立即注册:进入下方页面 3  4 点击小程序进入表单填写页 ...

  6. 整理六百篇web前端知识混总

    9个有用的和免费的工具来支持动态网页开发 8个基本的引导工具的网页设计师 11款CSS3动画工具的开发 2016年某前端群题目答案参考 9最好的JavaScript压缩工具 创建响应式布局的10款优秀 ...

  7. 程序猿职业生涯中的 Norris 常数

    我的朋友Clift Norris发现了一个基本常数.我称之为Norris常数,一个未经培训的程序猿在他或她遇到瓶颈之前能写出的平均代码量.Clift预计这个值是1500行. 超过这个数以后,代码会变得 ...

  8. Web前端MVC框架的意义分析

    前言: Web前端开发是Web技术发展中的一个重要组成部分,在传统的前端开发中由于外界因素的影响导致其开发形式呈现出简单化的特点,即以页面为主体来展示界面中的信息.然而随着科学技术的不断进步,Web前 ...

  9. 玩转CSS3,嗨翻WEB前端,CSS3伪类元素详解/深入浅出[原创][5+3时代]

    在我的上一篇博客中, 很多园友提出说对css3"画图"不是很理解, 在跟他们私聊了一段时间以后,加上自己在开始自学css3的时候的疑惑,我觉得大家之所以不是很理解主要是因为对伪元素 ...

随机推荐

  1. BUAAOO第一单元的总结

    ---恢复内容开始--- Homework1 简单多项式求导 程序架构 由于对java的生疏和不了解,第一次作业很羞愧的只用了一个类. 1.在输入之后调用Polyformat函数检查输入的格式,A检索 ...

  2. python复习购物车程序

    个人学习总结: 无他,唯手熟尔!多敲多练才是王道 python 第三课 元组的灵活运用&字符串的诸多操作 Program01 '''时间 2018年2月12日12:15:28目的 购物车程序 ...

  3. 性能测试LR学习笔录 -2

    LoadRunner基本测试流程: 制定性能测试计划(部分)  -> 创建测试脚本 -> 编译.运行测试脚本 -> 创建场景 - > 运行.监控场景.收集数据  -> 生 ...

  4. IIs实验,中间件漏洞

    实验一.IIS实验 1.修改端口   开始→管理工具→Internet 信息服务(IIS)管理器,属性,将端口改为 8080 如图: 2.    IP 地址绑定 前面步骤同第一题一样,将 Ip 改为本 ...

  5. Angular4.0中常用指令

    Angular 4.0 1. 指令:*ngFor 循环带索引的两种方法: <tr *ngFor="let item of listWorkingDetails index as i&q ...

  6. js中 setTimeout延时0毫秒的作用

    经常看到setTimeout延时0ms的javascript代码,感到很迷惑,难道延时0ms和不延时不是一个道理吗?后来通过查资料以及实验得出以下两个作用,可能还有作用我还不知道,希望得知的朋友在后面 ...

  7. 配置3层交换机VLAN间通信

    SW2 Switch>en Switch#conf t Enter configuration commands, one per line. End with CNTL/Z. Switch(c ...

  8. Flash Alternativa 3D引擎-基础理论

    自由行走的花 网站设计,flash网站设计与动画制作,web,as3 2010-12-31 14:29 [转]Flash Alternativa 3D引擎-基础理论 <本文转载自:http:// ...

  9. yarn安装

    Yarn是Facebook提供的替代npm的工具,可以加速node模块的下载.React Native的命令行工具用于执行创建.初始化.更新项目.运行打包服务(packager)等任务. 先安装nod ...

  10. ubuntu 16.04 编译安装 amule (开启GUI)

    安装依赖 $ -dev libgeoip-dev zlib1g-dev libupnp-dev libboost-all-dev libwxbase3.-dev libwxgtk3.-dev buil ...