前端当前是否处在一个糟糕的时代？

分手后的思念是犯贱 2022-11-29 11:56 82阅读 0赞

我认为前端现在可以说是最好的时代。因为各种新技术层出不穷，让前端可以做的事情越来越多，同时大大减少那些浏览器兼容性等仅仅只和（陈旧）经验挂钩的 tedious 的工作。

前端工程师的工作正在越来越受重视。前端岗位的趣味性，挑战性也越来越大。从最开始的前后端分离到现在将近 20 年的时间里，前端主要经历了以下的变革：后端生成静态页面 → ajax 前端渐进式加载 → virtual dom → ssr + treeshake ssr 等各种新技术逐渐成熟，让 web 开发变得越来强大，而且可以让前端工程师把主要工作精力放在数据结构、算法等工程相关优化上，从而带来更好的用户体验。

而花在诡异语法、畸形 CSS hack 的时间也越来越少。类似“茴香豆的茴有几种写法”的 JavaScript “无用”知识点也越来越受到摈弃。下面是我在前端开发的短暂长河里几个回忆瞬间，你感受一下前端是不是越来越有活力？

2008  
当年前端大部分时间除了 PS 切图，主要的时间基本都是花在了类似下面这种处理浏览器兼容的事情上。![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L0JPTTQ4NTQ4MA_size_16_color_FFFFFF_t_70_pic_center]  
由于需要各种复杂浏览器兼容性的问题，jQuery 在当时几乎是神一样的存在。另外 cross-domain 则是另一个沉重的话题。各种奇葩方案应运而生，例如我记忆最深刻的是 JSONP 这种个性的跨域解决方案。现在看来简直心惊胆战，由于需要用 eval 来运行后端 GET 返回的函数 + 数据，所以非常容易受到攻击。

在职前端开发，如果你也想学习前端开发技术，可以加入我组建的前端学习交流裙：851 231 348 也可以关注我的
    微信公众号：【前端留学生】自己根据多年来的开发经验总结录制的一套web前端精讲视频和学习方法，
    以及一些前端学习手册，前端面试题，端开发工具，PDF文档书籍教程，无偿分享给大家。需要的话都可以自行来获取下载。

2010

当年比较流行的是以下相关的讨论

徒手写一个兼容主流浏览器的“事件监听器”  
一些简单的正则表达式例如捕获组  
一些奇怪的 JavaScript 编程方法

大家会经常讨论类似 \[‘1’, ‘2’, ‘3’\].map(parseInt) 会得到什么返回。以及下面的这个有趣的问题。

5 Convert float number with a ',' in every 3 digits
    
    Eg: 123456.7 => 123,456.7 or 123456 => 123,456

2012

大概在这年前后 JavaScript OOP 开始大行其道。尤其是以 BackboneJS 为代表的 MVC（VM）前端框架开始流行。平时讨论最多的是 JavaScript Class 的不同实现方式以及各种类的继承。我能记起来的就有 5 种不同的方式。

作者：一个小老虎
    链接：https://www.zhihu.com/question/406996057/answer/1408287350
    来源：知乎
    著作权归作者所有。商业转载请联系作者获得授权，非商业转载请注明出处。
    
    function Parent(){ 
      this.name = 'Tiger'; 
    } 
    // http://stackoverflow.com/questions/310870/use-of-prototype-vs-this-in-javascript 
    Parent.prototype.getName = function(){}; 
    function Child(){ 
      // to inherit parent's 'this' so you can get this.name 
      Parent.call(this);
      this.age = 99; 
    }
    
    Child.prototype = new Parent(); 
    Child.prototype.constructor = Child; 
    
    Child.prototype = Parent.prototype;
    Child.prototype.constructor = Child; 
    
    Child.prototype = Object.create(Parent.prototype); 
    
    function deepCopy(parent){ 
      var child = Array.isArray(parent) ? [] : {}; 
      for(var i in parent) { 
        if(parent.hasOwnProperty(i)) { 
          if(typeof parent[i] === 'object') { 
            child[i] = deepCopy(parent[i]); 
          }else{ 
            child[i] = parent[i]; 
          } 
        } 
      } 
      return child; 
    }

从入门到进阶  
L4 前端工程师考察重点  
高级 JavaScript 核心

2014

这年 React 发布了。虽然当时还不是很火，但在接下来的日子里大家就发现这东西越来越好用。首先可以完全摈弃 jQuery，其次 virtual dom 的发明几乎改写了前端开发的思路。尤其是 JSX 的引入，重新将 CSS 和 JS 结合到一起，虽然第一次开始写的时候觉得非常奇怪，但后来就发现这么做的好处：React 的组件可以做到高度模块化、高度复用，可以封装地非常好，非常方便小组之间的代码共享。

也就是从那年往后的日子，BackboneJS 们的路越来越不好走，用的人越来越少。而 React 这种 Reactive 的函数式编程也开始变得流行。

我也是亲眼见证了这些年前端从 OOP → FP 的趋势，两种截然不同的思想解决同样的问题，感觉非常有趣、也很有挑战。

2020

看完我的这篇介绍，你在看看现在的前端标准就会发现以上我所提到的问题几乎全都没了。ES2020 的标准里已经将上面这些都简化成 API 供你调用。

以前如果要写一个开源的类库放到 Google Code / GitHub 上，大家用的最多的是 IIEF（Immediately Invoked Function Expression）来封装自己的代码以避免全局污染，而现在 ES6 里面仅仅用 import export 就可以完美解决。ES2020 里甚至还提供了对包的动态加载的原生支持，配合 webpack 简直分分钟做到 require.js 所实现的动态加载功能。

所以这一路走来我并不认为前端现在处在一个糟糕的时代，相反应该是蓬勃发展的时代。好处是正如开头提到的工作重心的转移，可以把精力花在处理和业务相关更核心的事物上，而坏处是由于蓬勃发展所带来的部分语言相关“经验”贬值加速，对于资深前端开发展需要不断学习才能在技术栈上做到和主流一致；而对于刚入行的小伙伴们这恰好是一个机会，因为你根本不用关心已经被淘汰的技术，直接从 ES2020 开始学起。

新的前端时代正在来临。

[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L0JPTTQ4NTQ4MA_size_16_color_FFFFFF_t_70_pic_center]: /images/20221124/d0d7fa5e9d2c4b12a6ce6604104cc0e3.png