自学转行成前端工程师，三面拿下字节跳动offer

我是一名前端工程师，通俗地说，就是一只程序猿。

虽然大学专业也的确是IT相关专业，但求学期间划水四年，侥幸未挂科并顺利毕业，找的第一份工做是软件公司的销售类职位，想着多少也算专业相关愉快入职，却不管如何适应不了酒桌上的觥筹交错，工做得痛苦不堪。某天一冲动辞了职，而后由于下一步没有方向开始了漫长的失业生涯。

我已经记不太清楚为何本身当时要选择前端开发这一方向了。不过前端入门确实简单，不须要一点编程知识你就能作出一个漂亮的静态页面，甚至还能作出动画效果，总而言之，很是容易让人有成就感。或许这就是缘由吧。

学习了差很少半年，主要是看网上的视频课程，买了一些学习前端的最新的书籍，刷了不少公司面试题，我开始找工做，而后发现岗位虽然很多，但邀请面试的少之又少。

转行后的第一份工做

第一个面试机会来自一家初创公司，面试以前我紧张到胃不舒服。面试官直截了当地问我一天能作几个页面。我愣住了，回答从未测试过，因此很差说，因而他现场让我作了一个简单的页面看成测试，而后对速度表示大概满意，随即示意我经过了面试。

我对这样的轻率感到大为吃惊，又了解到公司并无其余前端人员，思量之下仍是拒绝了这个机会。

在面试我如今所在的这家公司的时候，总监面试个人时候问：“为何以前一直自学，如今却决定出来找工做？”

我回答：“由于没钱了要过不下去了。”

后来公司老板面试个人时候，问我：“有没有本身学习能力不错的实际证实？”

我想半天回答刚刚总监说我学得还挺快的。

后来我把面试的过程讲给同窗听的时候，他笑得前仰后合。不过好在这场面试的结局是好的——我顺利入职啦。

在这家公司作了大概一年半之久，由于我的职业追求，这家公司没法提供本身专业和职业发展的条件，但愿换一家公司，争取到发展的条件。

此次和以前刚转行找工做不同，投的都是一些大厂，但愿本身之后有更好的发展，固然了啦，大公司工资起点高，福利待遇好，这个是毋庸置疑的。

投了不少公司，字节跳动算是比较心仪的公司，在面试前准备了好久，刷了不少面试题，，能够说准备得十分充分了。

面经部分

一面-70mins

• 屏幕正中间有个元素A, 随着屏幕宽度的增长，
  始终须要知足如下条件：

  • A元素垂直居中于屏幕*；
  • A元素距离屏幕左右边距各10px；
  • A元素里面的文字”A”的font-size:20px；水平垂直居中;
  • A元素的高度始终是A元素宽度的50%; (若是搞不定能够实现为A元素的高度固定为200px;)
  • 请用 html及css 实现

函数中的 arguments 是数组吗？若不是，如何将它转化为真正的数组

请说出如下代码打印的结果

if ([] == false) {console.log(1);};
 if ({} == false ) {console.log(2);};
 if ([]) {console.log(3);};
 if ([1] == [1]) {console.log(4);};

请说出如下代码打印的结果

async function async1() {
 console.log('async1 start');
 await async2();
 console.log('async1 end');
 }
 async function async2() {
 console.log('async2');
 }
 console.log('script start');
 setTimeout(function () {
 console.log('setTimeout');
 }, 0);
 async1();
 new Promise(function (resolve) {
 console.log('promise1');
 resolve();
 }).then(function () {
 console.log('promise2');
 });
 console.log('script end');

实现ES5中Function原型的bind方法， 使得如下程序最后能输出'success'

function Animal(name, color) {
  this.name = name;
  this.color = color;
 }
 Animal.prototype.say = function () {
  return `I'm a ${this.color} ${this.name}`;
 };
 const Cat = Animal.bind(null, 'cat');
 const cat = new Cat('white');
 if (cat.say() === 'I\'m a white cat' && cat instanceof Cat && cat instanceof Animal) {
  console.log('success');
 }

请用算法实现，从给定的无序、不重复的数组data中，取出n个数，使其相加和为sum。并给出算法的时间/空间复杂度 。(不须要找到全部的解，找到一个解便可)

function getResult(data, n, sum) {
 }

• 反问环节

一面结束，次日下午hr打电话约二面。

二面-45mins

代码运行结果

var a = function () { this.b = 3; }
var c = new a();
a.prototype.b = 9;
var b = 7;
a();
console.log(b);
console.log(c.b);

• JS继承如何实现
• repeat 实现，使用JS实现一个repeat方法，调用这个 repeatedFunc("hellworld")，会alert4次 helloworld, 每次间隔3秒

function repeat(func, times, wait) {
}
const repeatFunc = repeat(alert, 4, 3000)

• 代码题 + 逻辑：给定一个整数数组，每一个元素大小都在 1- 100 之间，对这个数组进行排序。范围扩大到32位整数怎么办？（能够敲代码，也能够讲思路）
• hash表结构，解决冲突的办法，hash函数有什么类型
• 开放题：学数据结构或者算法过程当中，有没有什么地方以为很巧妙
• 反问环节

二面结束，当晚hr打电话约三面，那个激动啊，终于过了二面了

三面-50mins

• 模式匹配，
  1234567890 ->1,234,567,890（不是简单的JS函数，是使用正则作的，这边踩坑了）
• 浏览器的缓存策略
• 跨域问题
• 项目的技术难点（讲了第一个‘难点’，大佬说，这好像不是难点吧？）
• JS如何性能监测，如何监测用户页面是否卡顿（不懂，强答，聊了一会大佬说跳过这问题吧）
• 解决hash冲突的办法
• 数组和链表的区别
• 浏览器渲染过程
• 手头offer状况
• 为何选择前端？
• 反问环节

三面有感：前两面都是作题 + 原理的面试状况，三面回归了聊技术的方式。可能由于是大佬面，总感受压力很大，一股本身凉了的感受（多是由于太菜了），每一个问题面试都会一直追问，问到你答不出来为止才换问题。三面总共有两次被面试官说“不聊这个了，咱们换个话题吧”。

三面结束后，真的是慌得一批，复盘完感受每一个问题面试官都不是很满意，感受凉了，焦急得等待结果。恰巧是周五，若是当天等不到结果，那就可能要等到下一周了，果不其然当天没消息。

周六下午等不住了，发短息问了hr。要特别感谢hr谢谢，非工做时间帮我查询结果，告诉我经过了，次日会联系我。（心里其实超级激动）

总结

从转行到如今，差很少两年的时间，虽不能和大佬相比，但也是学了不少东西。我我的在学习的过程当中，习惯简单作作笔记，方便本身复习的时候可以快速理解，如今将本身的笔记分享出来，和你们共同窗习。

我的将这段时间所学的知识，分为三个阶段：

第一阶段：HTML&CSS&JavaScript基础

第二阶段:移动端开发技术

第三阶段:前端经常使用框架

PS

• 推荐学习方式：针对某个知识点，能够先简单过一下个人笔记，若是理解，那是最好，能够帮助快速解决问题；若是由于个人笔记太过简陋不理解，能够关注我之后我还会继续分享。
• 大厂的面试难在，针对一个基础知识点，好比JS的事件循环机制，不会上来就问概念，而是换个角度，从题目入手，看你是否真正掌握。因此对于概念的理解真的很重要。