写给应届生的前端面试经验总结

发表于

我是一名 2021 届本科生，未来的方向是互联网前端开发。从 2019 年年底开始，我陆陆续续参加了 5 家公司的近 30 场面试，并最终与阿里巴巴签约。 虽然我经历的面试次数不算太多，但是足够让我形成一定的面试经验。在这篇文章中，我会将这些经验沉淀下来，总结出我认为适用于大部分同学的方法。 在这篇文章中，我将围绕以下的几块阐述： 提升简历亮点 复习整理已有知识 项目经验 调整面试心态 提升简历亮点 很多互联网企业的招聘者每年需要面对成千上万的应届生简历，在如此繁重的工作下他们往往会比较疲惫，因此如果简历写得枯燥乏味或泛泛而谈，即使自身素养和技术实力都比较强，也很有可能无济于事。因此，我们必须思考如何使我们的简历在众多简历中脱颖而出。我在编写简历时请教过的一些学长和几位面试官，他们对我的简历提供了一些建议，我十分受用： 养成良好的简历排版习惯 中文和英文之间、数字两端需要有空格 英文标点之后需要空格，标点之前禁止空格 每行最好不要超过 48 个汉字或单词 英文名称需要规范大小写 例子： Not Good： 基于typeScript+react+ant-design…

从 0 开始实现一个「学院派」微前端方案

发表于 ，标签： 微前端 架构

前言 2016 年 11 月，ThoughtWorks 在技术雷达（Technology Radar）中首次提出了微前端（Micro Frontends）的概念，将后端微服务化的思想引入前端。此后，在前端社区中，出现了很多优秀的开源解决方案，例如 SingleSPA、Qiankun、IceStark 等。 微前端的实施方式有很多种，具体可以参考 Phodal 的文章。关于这些实现方式和微前端诞生的意义、解决的业务痛点，在这里就不再赘述了。 本文将以一个在校大学生的视角，基于我在学校社团里为数不多的中后台开发实战经验，从 0 开始实现一个「学院派」微前端方案，抛砖引玉地提供我对于微前端技术落地的思考和思路。 设计思路和实现 从目前开源社区的现状来看，SingleSPA 是一个发展历史比较悠久的微前端解决方案，拥有完善的社区支持和维护力量。 SingleSPA 架构中有主应用和子应用两种角色，主应用作为应用的框架运行时环境，动态地配置子应用，通过监听全局路由事件完成子应用的加载、卸载以及其他生命周期的管理。在子应用被挂载完成后，路由便由被挂载的子应用接管。…

构建规范的前端工作流与生态体系

发表于 ，标签： 技术思考 前端 团队协作

一个前端项目，可以只由一个人来完成。那么这时，这一个人就是整个前端团队的规范，而规范的制定则显得无关紧要。但现实往往并非如此。一个成熟的线上项目中往往需要一个前端团队完成技术选型、需求分析、开发、测试、集成、部署等流程。而一个好的前端团队，其强大不仅体现在对技术的使用上，同时也体现在是否有一套完备的工作流（Work Flow）用于规范在团队协作中的个人行为和团队宏观行为，以及一套基础设施用于支撑工作流和业务属性。 这篇文章是在笔者观察到工作室中存在的一些问题后针对这些问题提出的解决方案、参与构建的基础设施项目以及对工作室未来基础设施添加的构想的一次记录。 存在的问题 笔者在三年前加入了工作室，工作室的前端技术栈在当时其实是很先进的。然而，当笔者真正接手项目时，却发现工作室在团队协作和工作规范方面的问题其实比较大。单从前端方面来说，存在问题包括但不限于： 量身定制的脚手架 在工作室的前端项目中，我们通常都是使用特定的脚手架生成项目目录结构。例如，Vue 项目使用 Vue CLI，React 项目使用 Create React App，而有的项目则是由前端自主配置 Webpack 等构建工具。 这样做虽然都能达到工程化开发并上线的结果，但与此同时它带来的问题也是显而易见的：即使目前各大框架官方的脚手架已经十分先进了，但是它们并不能保证符合每个项目的业务属性。也就是说，…

2019 年度总结

发表于 ，标签： 年度总结

现在，2020 年也快过去四分之一了。按照惯例，每年的一月或者二月就该写一篇年度总结了。然而，2020 年一开始确实发生了很多事情，因此一直拖到现在。索性就把 2019 全年和 2020 前三个月的感想一同写进这篇文章里吧。 我是从 2017 年开始写年度总结的，也就是说，我每写一篇年度总结，就意味着我离毕业的那一年又近了一年。这是我的第三篇年度总结，距离我毕业还有一年多的时间了。作为从进入大学开始就盼着早点毕业出去工作的我，当然非常开心。但同时，也有一丝丝的焦虑。 总的来说，我的 2019 年，是一个被不安和躁动充斥着的一年。 回顾 技术 学习和沉淀 从接触到前端开始，我就一直没有停下学习的脚步。当然，学了这么久的前端，我自己感觉我的水平似乎依然在原地踏步走。虽然做了很多项目，但是我总觉得我的基础似乎不那么扎实。与此同时，我发现了一个比较令我担忧的问题：这一年我似乎很少写文章了。要说形成写文章的习惯，还要感谢子健学长当年的引导。这的确是一个非常好的习惯，但在 2019 年却出现了断层的迹象。…

Promise/A+ 规范：诞生与原理初探

发表于 ，标签： Javascript 异步 ECMAScript 6/7/8

在 Philip Roberts 眼中，JavaScript 是一门单线程、异步、非阻塞、解释型脚本语言。我们在享受 JavaScript 异步编程带来的便捷的同时，也在为如何处理异步（或处理异步带来的冗杂的代码）而苦恼。但是，作为一门富有活力的编程语言，JavaScript 也在不断地完善自己的标准与规范，为众多 JavaScript 开发者解决这些苦恼。当我们在谈论如何处理异步时，我们可能会立刻想起回调函数（Callback Functions）。我们可以通过这种神奇的机制完成对每一个异步操作结果的处理。然而，随着我们的代码越来越复杂，异步操作也越来越多，而原始的回调方式暴露出的问题也越来越明显。 好在，Promise 的到来为我们解决了一部分问题。那么究竟是什么使 Promise 具有如此魅力，使得它一度被称为“下一代”异步编程方案呢？我们将在本文中从源码和底层原理层面探讨这些问题。在阅读这篇文章前，我们需要掌握以下内容： JavaScript 事件循环机制 异步编程的基本概念 JavaScript 中回调函数的概念 Promise 规范以及基本使用方式…

面向对象的 JavaScript：封装、继承与多态

发表于 ，标签： Javascript

在现代编程语言中，我们经常提及面向对象编程（Object-Oriented Programming，OOP）。所谓的面向对象，其实是一种具有对象概念的程序编程典范，同时也是一种程序开发的抽象方针。与函数式编程（Functional Programming，FP）不同，面向对象编程希望把所有的事物都认为是一个对象，而对象可以通过实例化一个类或继承一个对象而获得（函数式编程认为一切皆函数，一个确定的输入对应一个确定的输出，并且不会产生副作用）。 面向对象通常可以采用两种方式实现：prototype 或 class。JavaScript 中对象的实现显然属于前者，而后者的代表性语言有 Java、C++、TypeScript（TypeScript 同时支持这两种方式） 等。 本篇文章将会简单地梳理 JavaScript 中的相关问题。读完本文，您应该能了解到包括但不限于以下内容：类与对象、对象创建的几种模式、对象继承的几种模式、对象方法的重写和重载在 JavaScript 中的实现。 前置知识 如何理解类和对象 类是一类事物的抽象概括，它可能包含数据的类型和对数据的处理方法。对象是某个类的实例化。一个生动的例子也许可以帮助我们加深对它们的理解：生物学家会将地球上的生物划分为界、门、…

异步的 JavaScript：浅析浏览器事件循环

发表于 ，标签： 事件循环 Javascript 异步

JavaScript 采用严格单线程的工作方式。这意味着 JavaScript 没有创建多个子线程进行异步任务的功能。但事实往往并非如此简单。在使用 JavaScript 开发时，我们也许会发现 JavaScript 的确能够实现异步。这背后的原因，与 JavaScript 采用的事件处理机制有关。这种机制被称为“事件循环”。在详尽阐释事件循环是什么之前，笔者希望您明白为什么 JavaScript 要采用单线程工作。 我们为何需要理解浏览器事件循环 浏览器事件循环是非常底层的知识。尽管我们在工作中并不是必须了解它。但是，要知道 JavaScript 是一种以事件驱动的语言——如果观察仔细的话，您一定能在您的代码中发现事件处理程序的存在，无论您是有意识地还是无意识地。因此，理解浏览器事件循环的工作原理似乎就显得十分必要，因为只有了解浏览器如何处理各种事件和任务，我们才能更好、更完美地使用事件驱动的方式编写更高质量的代码。 JavaScript 为何采用单线程 自互联网被发明以来，随着逐年增加的互联网用户的涌入，单纯的 HTML 和 CSS 已经无法满足用户日益复杂的需求。因此，当年的网景公司（Netscape Communications…

基于 Webpack 4 多入口生成模板用于服务端渲染的方案及实战

发表于 ，标签： Webpack 服务端渲染

法律声明 警告：本作品遵循 署名-非商业性使用-禁止演绎3.0 未本地化版本（CC BY-NC-ND 3.0） 协议发布。你应该明白与本文有关的一切行为都应该遵循此协议。 这是什么？ 背景 现代化的前端项目中很多都使用了客户端渲染（Client-side Rendering, CSR）的单页面应用（Single Page Application, SPA）。在大多数情况下，它们都应该通过加载 JavaScript 脚本在浏览器中执行以将页面的大部分视图渲染出来，以及获取页面所需要的数据。单页面应用有着许多非常显著的优势，如它们（单页面应用）依赖的公共资源通常仅需加载一次。数据都是通过异步的 JavaScript 与 XML 技术（Asynchoronous JavaScript and XML, Ajax）加载的，异步性能往往非常高。在路由切换时，仅需刷新和（或）更改页面的一部分，而不需要重新加载整个页面以达到切换路由的目的，因此路由的切换在单页面应用中显得比较流畅自然。…