1. 首页
  2. IT资讯

面试分享:三年经验面试阿里前端失败总结(附面试真题及答案)

前言

大家好,我是来自驾考宝典及掌游天下的WckY,目前离职,正在找新工作。我在掌游天下一直负责h5游戏这块的业务,离职后我在github里创建了一个h5游戏大全,可直接点击 此处 了解。从上周二开始面试至今,期间意外收到杭州阿里的电话面试和在线编程测试。由于我一直没刷过题,包括leetcode,也没怎么复习基础,所以一周面试下来,offer惨不忍睹。但不管怎样,知耻而后勇,接下来我将为大家分享下除了阿里,还有其他公司的面试题。各位记住一定要刷面试题哦!!!

以下是阿里面试过程

第一轮,电话面试+在线编程面试

1.不需要我做自我介绍…

阿里打电话给我时,晚上八点多,我正坐在房间里发呆,电话接通后对方告知我是杭州阿里巴巴花呗借呗部门,然后说会往我的邮箱里发个在线测试链接,里面有两道编程题,大概20分钟做完即可。虽然我很手足无措,但还是赶紧照做了,然后就看到了令我无从下手印象深刻的在线测试题。

2(算法题). 想办法先随机生成100个随机字符串整数扔到一个数组里,比如var arr = ['1','2','3' ….],arr的长度是100,再设计一个算法去重,不允许用new set

我写了八分钟,也纠结了八分钟,最后还是没写出正确的代码。阿里的小哥倒是很温柔,还一步步引导我,再次感谢。面试结束后我找我的作业帮前端朋友聊了下这道题,这是他最后给出的答案。

var arr = Array.from({ length: 100 }).map(() =>     String(Math.floor(Math.random() * 100)) ) var newArr = [];  arr.forEach((val) => {     if (newArr.indexOf(val) < 0) {         newArr.push(val)     } }) console.log('sucess', newArr)

3.实现一个具有简单的观察者模式的类,在类中有on、off、trigger方法。

在向对方确认是让我用原生JS实现on、off、trigger等方法后,我选择了直接放弃。我是真的不会。之后我和我的360在职前端好友聊了下,他说当初去自如面试面试官也要求他手写,不过现在也忘光了……

4(算法题).游戏中的碰撞检测你是如何实现的?碰撞检测有个固定的方法是什么?A星寻路算法具体的原理是?

碰撞检测我说了自己实现的方式,阿里小哥貌似觉得太麻烦了…所以问我是否知道有个简单固定的方法,我当然是不知道。A星一样,我只会照着文档用。

5.Pixi.js和create.js相比,它的优缺点是什么?原因是什么?Phaser听过没,阿里的游戏框架知道叫什么吗?你们掌游天下团队为什么会选择create.js?

为什么选择create.js,当时我leader确实没说,就说大家以后用create.js吧,然后他作为主程,开始了对create.js的二次封装。不过我私下还是仔细调研了不同引擎的区别,并在内部做了分享。主要参考资料:zhuanlan.zhihu.com/p/32392153。

阿里总结

问完基本的技术问题以后,阿里小哥开始向我介绍他们这个岗位大概想招怎样的前端,并耐心给了我点建议。不过除了技术题说实话我完全忘记他之后说的是什么了。一心只想结束对话的我,在挂掉电话之后如释负重。至此阿里面试告一段落,并且我决定,不给阿里其他前端简历了,我实在太菜鸡了。

以下是伴鱼口语、好未来等其他公司的笔试题

1.Event Loop 具体会输出什么

console.log('1'); async function async1(){      console.log('2');      await console.log('3');      console.log('4'); } setTimeout(function(){      console.log('5'); },0); async1(); new Promise(function(resolve){      console.log('6');      resolve(); }).then(function(){      console.log('7'); }); console.log('8');

这段呢?题目出自360笔试题

setTimeout(function(){       console.log(1); })  Promise.resolve(function(){       console.log(2) })  new Promise(function(resolve){       console.log(3);       resolve(); }).then(function(){       console.log(4) }) console.log(5)

360的笔试题是我借贷宝的朋友发给我看的,然后我俩第一步就做错了,各位可以在浏览器和node环境下各跑跑,有不同。

2(算法题).使用 原地排序 将var arr = [2,0,1,0,2,1] 变成var arr = [0,0,1,1,2,2],禁止使用sort和reverse函数

看到原地排序我就懵逼了,没听过。面试官来了以后也没解释到底什么意思,我也忘问了,尴尬。回来一查发现原地其实就是冒泡排序,好家伙我也没背过冒泡排序。

for(var i = 0; i < arr.length - 1; i++){     for(var j = 0; j < arr.length - i - 1 - j;j++){         if(arr[j] > arr[j+1]){         var temp = arr[j];         arr[j] = arr[j+1];          arr[j+1] = temp;     }     } }

3.宏任务微任务的出现是因为什么导致的?又是因为什么,导致了目前的执行顺序?

懵逼中的我…. 你要是问我刚才Event Loop那道题为什么输出那些答案,我能说出来,至于优先级为什么是微任务在前、宏任务在后,我表示沉默….

4.说下你对this指向问题的理解以及四种绑定规则

this是动态变化的,谁调用它,就指向哪里。

  • 默认绑定(严格/非严格模式)严格是undefined;非严格独立函数调用时this指向window。
  • 隐式绑定,当函数引用有上下文对象时,隐式绑定会把函数中的this绑定到这个上下文对象。
var obj = {   name: "wcky",   foo: function() {     console.log(this.name); //wcky   } }; obj.foo();
  • 显示绑定,通过call()或者apply()方法,第一个参数是一个对象。
function foo() {   console.log(this.a); } var obj = {   a: 2 }; foo.call(obj); // 2
  • new绑定,如果有new关键字,this指向new出来的那个对象。

5(算法题). 写一个快速排序吧。

猝!我把冒泡记下了,快排和选择、插入等排序当时走马观花看了一遍,没记下来。

6.箭头函数和function的区别?this指向问题具体分析。通过以下代码,分别输出什么?原因又是为什么?在node.js环境下,结果是否相同?

let a = 1; const obj = {     a: 2,     b: () => {         console.log(this.a);     },     c: function() {         console.log(this.a);     } } obj.b(); obj.c(); console.log(this.a); var a = 1; const obj = {     a: 2,     b: () => {         console.log(this.a);     },     c: function() {         console.log(this.a);     } } obj.b(); obj.c(); console.log(this.a);
  • 首先,第一段代码输出的分别是undefined、2、undefined,在node.js下相同。而第二段代码,输出的分别是1、2、1,但在node.js下,仍然是undefined、2、undefined。
  • 具体原因,第一段代码中,let默认不挂在到window下,所以是undefined、2、undefined。第二段代码,原因各位可以想想为什么在node.js下仍然是undefined、2、undefined。

6.2 加强版this的判断

var a = 1; var obj = {     a: 2,     c: function() {         console.log(this.a);     },     b: () => {         console.log(this.a);     } } obj.c(); obj.b(); console.log(this.a); var foo = obj.c; console.log('111',foo());

答案又是什么呢?分别是2、1、1、undefined。如果我直接foo(),结果又是什么呢?答案当然是1了。

7(递归) a1 = 1,a2 = 2,a3 = a1 + a2,a4 = 4,a5 = a3 + a4,a6 = 6 …. 用递归求an。

这道题并不难,确实稍微想一下就可以做出来,不过我当时不假思索,不知道为什么只想到用递归求1 X 2 X 3 X4 X 5 X n这个思路,然后就放弃了,是我的错。

function f (n) {     if (n === 1) {         return 1     } else if (n % 2 === 0) {         return n     } else if (n % 2 === 1) {         return f(n-1) + f(n-2)     } }

8.对于强制缓存和协商缓存的了解?对应的英文名是什么?

cache-control和last-modified expired e-tag

9.以下代码输出什么,为什么?

var arrData = [1,2,3,4,5,6]; for (var i = 0; i < arrData.length; i++) {     setTimeout(function(){         console.log(arrData[i]);     }, 0); }

如果想正常打印出1,2,3,4,5,6,该怎么处理。

10.随机遍历数组。一个长度为n的数组,每次随机挑选一个元素,尽可能快地遍历到全部元素,最终返回一个新的数组。

我用的是二分查找,我以为这样可以,但面试官告诉我不对,我是唯一一个没有做正确的人…

11(算法题) 消息队列实现。实现一个消息队列,满足如下功能:

  • 可以添加任务,任务包括任务数据,任务触发的北京时间点。
  • 在任务到达触发时间点,触发执行任务。

看到这题我也直接放弃了,猝….

12.使用promise对象实现axios的基本功能,例如传入url、data、type等,换言之Ajax操作。

面试分享:三年经验面试阿里前端失败总结(附面试真题及答案)

13.聊聊promise.all()原理。

14.使用flex布局实现头部吸顶,底部吸底,中间可滚动布局,必须使用flex布局。

面试官非得让我用flex实现,来判断我的flex熟练度,服了。最重要的是给父元素设置display: flex;flex-direction: column即可。

15.左边固定,右边自适应的布局,有哪些方式实现?各自的原理又是什么?重点讲清楚原理

16.说说你对原型、原型对象、原型链、prototype和_proto_的理解。

17.判断数据类型,大概有几种方式,区别是什么?精确判断数组,又有哪些方式?

结语

暂时先写这些吧,有时间接着更新,这几天面试其实挺心力交瘁的,还打击人。而我还得接着约面试,巩固基础知识点(背概念)和刷点编程题。想要跳槽的朋友要想清楚了,尤其是年底了,好工作确实不好找。最后,祝大家早日升职加薪,祝自己早日入职新公司干活了。

原作者姓名:WcKY
原出处:segmentfault
原文链接:人类身份验证 – SegmentFault

原文始发于:面试分享:三年经验面试阿里前端失败总结(附面试真题及答案)

主题测试文章,只做测试使用。发布者:玩家L-,转转请注明出处:http://www.cxybcw.com/22555.html

联系我们

13687733322

在线咨询:点击这里给我发消息

邮件:1877088071@qq.com

工作时间:周一至周五,9:30-18:30,节假日休息

QR code