论坛风格切换切换到宽版
发帖 回复
返回列表
12
  提醒:不能用迅雷等P2P下载,否则下载失败标(二级)的板块,需二级才能下载,没二级不要购买,下载不了
  • 1918阅读
  • 16回复

[其他]回顾自己三次失败的面试经历 [复制链接]

上一主题 下一主题
离线shuszhao
 

性别:
帅哥
发帖
17956
金币
36199
提示:会员销售的附件,下载积分 = 版块积分 + 销售积分       只看楼主 倒序阅读 使用道具 0楼 发表于: 2017-11-16
bdrE2m  
)CXlPbhY?  
k}LIMkEa4a  
前言 UP#@gxF  
Zbo4{.#  
时间的齿轮已经来到了2017年的11月份,距离2018年仅仅还剩下不到两个月的时间。站在这个时间点上,我对自己之前三次失败的面试经历做了一次深度回顾。 %DuPM6 6r  
可能很多小伙伴会问,为什么要去回顾失败的面试经历呢? 0A} X hX  
因为在互联网+时代,成功的案例可以借鉴,但是不可复制;失败的案例可以引以为戒,但是不可重蹈覆辙。你按照成功者的步骤一步一步走,最后不一定会成功;但如果你按照失败者的步骤一步一步走,结局注定会失败。 2I:P}!  
我在这里写出当年我失败的经历,算是对自己做一个总结,也是为了提醒后来者,一入前端深似海,坑多坑少自己踩,避免走上闰土哥的老路。 ]ZLF=  
所以,接下来,正文从这开始~ W[jg+|  
*twGIX  
qkfof{z  
@<K<"`~H  
/l `zZ>  
说起第一次失败的面试经历,是在我13年刚刚毕业的时候。那时我正在海投简历,认真找工作。当初应聘的是一家规模不算大的小公司,进去之后,面试官看都没看我一眼,给我丢下一句话就忙他的去了。 #X] *kxQ<  
他原话的意思是说,让我用jQuery写个轮播图效果,给我提供的条件是,一台没有联网的笔记本电脑,和本地下载好的jQuery的API文档。 7sVM[lr<  
当时刚从培训班学出来的我,html和css基础还算扎实,但对jquery的api熟练程度还是有所欠缺的。因为之前在培训班学习切静态页面的时候,碰到轮播图效果一般都会用网上别人写好的插件。但我还是硬着头皮去尝试着写了写。 _;}$/  
过了几分钟后,我静态页面的布局写出来了,但是jquery的轮播效果还是没整出来。当时的我,知道通过的胜算几乎为零,但还是尽力争取了一下,跟面试官说,我U盘里有我自己的作品,你要不要看一下。面试官此时还是目不转睛的盯着他的笔记本屏幕,边看边说,你自己带来的作品,是不是自己写的也不一定,面试题最能说明问题等,听他巴拉巴拉说了一堆。 :h@V,m Z  
结果可想而知,我被面试官刷下来了。  W2` 3 p  
回去之后,我便开始研究,如何用jquery去实现轮播图的效果。在这里,我简单地说下,当时很多购物网站(比如说淘宝京东)都会添加商品的图片轮播效果。轮播图作为一个公司首页最重要的推广方式,由于其相对于静态页面的动态滚动,使其更容易吸引客户的眼球。 WvU[9ME^)  
现在想想,轮播图的原理其实十分简单。它是利用人眼的视觉差,通过移动每张图片的left值,产生一种动态滚动的效果。废话不多讲,直接上代码: b GSj?t9/  
I=DVMG|  
记住,写任何JQ交互效果,都是先构建好布局,然后才开始JQ处理,DOM操作。 o?]Q&,tO  
在这里,节点的构建其实没什么好讲的,CSS样式也很简单,这里就不贴出代码了。简单说下,每个li下图片的显示与隐藏,都是通过它的display属性来设定。左右切换则是采用图片li浮动,父层元素ul的宽度为总图片宽度(也就是li 的宽度乘以li的个数),ui相对外层父元素绝对定位,并设定为超出的部分要隐藏。然后当想切换到某个index 的图片时,则采用修改ul的left值来实现。比如显示第一张图片初始定位left值为0,要想显示第二张图则将left值修改为-400px即可。 |X{j^JP 5  
页面已经构建完毕,接下来就是JQ的操作。我们直接贴出代码: 9>{ml&$  
)d[n-Si  
5kqI  
在这段代码中,我们先是用变量存储了当前索引值和图片总数,然后定义了一个定时器seInterval函数,里面的逻辑是,如果当前index值小于图片总数减一,就让它自增++;如果大于的话,就让当前index值初始化为0。 ) `{jPK*`  
然后为左右箭头添加了hover和click事件,在这里调用了两个函数,一个是重置定时器函数autoChangeAgain(),一个是图片切换处理函数changeTo()。当点击左右箭头或者是自动轮播的时候,我们都会调用animate()函数,通过修改left 值产生动态滚动的效果。最后就是给li控制按钮(小圆点或者是小长条)绑定事件处理函数,当鼠标移入清除定时器,反之则启动定时器。 G;gsDn1t  
大概的原理便是如此,所以说,轮播图最简单也最困难,图要张张轮着播,还要丝滑无缝隙。自此,我才明白了,面试官为何会让应聘者二话不说,先来写一个轮播图效果,因为麻雀虽小,五脏俱全,这里面涉及到了很多知识点,如果你能写出来,证明你对JQ的API的熟练程度还是可以的,而且也有一定的逻辑性。起码从侧面反映出,你是一个合格的初级前端攻城狮。 '&Ur(axs  
f['I4 /o  
/'oo;e  
T6y~iNd<  
gZHgL7@  
我的第二段失败的面试经历,说起来也挺巧,还是跟JS轮播图有关。不过这次换成了用原生JavaScript来编写。照样,我还是因为没有写出来而被pass掉了。后来想想,其实,逻辑和JQ是一样的,只不过是换成了JS。还是先直接贴出代码: p#c41_?'e  
&NF$_*\E  
o4: e1  
~xzr8 P  
!ak760*A  
7 @\i5  
看看这JS的代码量,还是有些冗杂,不过思路还是模仿JQ的实现思路。换汤不换药,代码里备注已经很详细了,这里就不一一阐述了。 uznqq}  
很显然,这次面试的难度已经提升了一个台阶,考察的是面试者对原生JS的熟练程度,以及逻辑性。相对的,这次的面试岗位的薪水也是相对要高点。如果这个能写出来的话,我觉得你的JS正在进阶,而你也正在进阶为一个专业的JSer。此时,距离中级前端攻城狮就不远了。 T T 3 6Y  
86LE )z  
i^WY/ OhL  
NxJnU<g-  
bD)"Jy  
俗话说,无巧不成书。关于我第三次面试失败的经历,依然是与JS轮播图有关。不过这次面试,却给我留下了一个比较深刻的印象。 m p_7$#{l  
WBKf)A^S  
这是我去年的一次面试,给我发面试邀请的公司是思特奇(这也算是在电信行业名声在外的互联网大厂了,如果有不了解的可以上百度百科)。思特奇在太原高新区的办公地点可以说是很高大上,整整一层都是技术开发人员,一排排A面亮着银色苹果logo的MacBook Pro甚是晃眼,给人一种浓厚的程序猿文化。 ;Q3[} ]su  
这次的机试题,还是那个绕不过去的JS轮播图的实现,不过这次却是让我用面向对象的思想去实现,据说这是技术总监临时的想法,这也是我后来才知晓的。当然了,我这次面试的薪水又拔高了一个台阶。 !4v>|tq!  
基于面向对象的轮播图,看似比面向过程要繁琐了很多,而且对于一个轮播图来说,也没必要。但面试官想要考察的是应聘者对于面向对象编程的熟练程度,看看你的前端编程能力是否达到了他们公司业务开发的水平。 aF/DFaiYv  
很显然,这次的机试题打了我个措手不及。 V+D<626o  
正如后来我拜读的JS红皮书里第六章写的,面向对象的程序设计,首先要创建一个Object实例,定义一个Slider构造器。然后在Slider的prototype原型上定义各种方法,这样做的好处是可以很方便的实现轮播图的效果,减少代码的冗余,同时避免了变量命名的冲突问题。 L'Iw9RAJ  
现在需要我们先来捋一下思路,分析一下构造器里需要的属性: 0.m-}  
初始化所有的样式操作 XFTqt]  
显示在对应的容器操作 DhxS@/  
鼠标进入事件 RKzO$T  
自动播放事件 _{):w~zi  
在这些基本的事件中,我们需要注意调用的顺序,如创建在初始化之前,我们可以把一些通用的属性放到原型链中来编写,这样的好处是减少了变量空间的占用和多次访问属性的结果。 xA^E+f:W_  
过程中遇到的问题: 8@ f!,!Wn  
1.其中的this指代问题:这里的解决办法是在鼠标进入之前的函数中缓存一下var that = this。 这样就可以访问属性了。 iWWtL  
2.图片轮播判断:向左点击的时候, 如果当前的索引值大于零,让它执行自减操作,如果不大于0 就让他等于对应图片长度-1; XD8Cf!  
向右点击的时候,当前的索引值小于它对应的轮播图片的长度-1,执行自加1操作,超过图片轮播长度时,索引值等于0。 ?(zCv9Pg  
这次基于对象的代码就不给大家贴出来了,留给你们做个实践。当然,这次思特奇面试之旅,最后也是以失败告终,这也是我离进大厂最近的一次。 U6|T<bsOl  
m{$+  
)cL(()N  
后记 S~r75] "  
[$K8y&\L  
分享了这么多面试经历,其实,我最想跟大家分享的是,无论你想走多远,你都需要不断的走下去。前端最精华的部分便是原生的JS,也只有JS是前端开发中算得上编程的一门语言,这也是我们前端工程师技术分层的重要指标,也能体现出你的代码能力,开发水平。所以,不是说你会多少个gulp、grunt、webpack这样的构建打包工具,会多少个angular、react、vue等框架的脚手架搭建,会多少个sass less stylus等这样的css预处理器,会多少个npm bower cnpm等这样的包管理器你就牛逼,永远记住,JavaScript才是我们前端工程师的核心竞争力! {a\! 1~  
希望这片文章的推送,能直抵你的内心。 *]/iL#  
Yt=)=n  


评价一下你浏览此帖子的感受

精彩

感动

搞笑

开心

愤怒

一般

差劲
离线bingbill21

性别:
帅哥
发帖
618
金币
800
提示:会员销售的附件,下载积分 = 版块积分 + 销售积分       只看该作者 1楼 发表于: 2017-12-31
瞧瞧


离线youneversay

性别:
人妖
发帖
860
金币
386
提示:会员销售的附件,下载积分 = 版块积分 + 销售积分       只看该作者 2楼 发表于: 2018-01-22
谢谢分享


离线天涯哥

性别:
帅哥
发帖
2173
金币
2040
提示:会员销售的附件,下载积分 = 版块积分 + 销售积分       只看该作者 3楼 发表于: 2019-03-25
    



性别:
帅哥
发帖
4644
金币
3421
提示:会员销售的附件,下载积分 = 版块积分 + 销售积分       只看该作者 4楼 发表于: 2019-08-23


离线曼珠沙华

性别:
帅哥
发帖
284
金币
294
提示:会员销售的附件,下载积分 = 版块积分 + 销售积分       只看该作者 5楼 发表于: 2019-08-27
    


离线zzwolf

性别:
帅哥
发帖
71
金币
85
提示:会员销售的附件,下载积分 = 版块积分 + 销售积分       只看该作者 6楼 发表于: 2019-08-27
  


离线江湖行

性别:
人妖
发帖
3
金币
3
提示:会员销售的附件,下载积分 = 版块积分 + 销售积分       只看该作者 7楼 发表于: 2019-08-29
实际工作经验欠缺导致的,刚学出来,适合去实习,而不是马上实战


在线nj20044

性别:
帅哥
发帖
6709
金币
7429
提示:会员销售的附件,下载积分 = 版块积分 + 销售积分       只看该作者 8楼 发表于: 2019-09-18


离线sqyfzx

性别:
人妖
发帖
189
金币
120
提示:会员销售的附件,下载积分 = 版块积分 + 销售积分       只看该作者 9楼 发表于: 2022-09-07
水贴吧吞吞吐吐


在线kingweison

性别:
人妖
发帖
4370
金币
2575
提示:会员销售的附件,下载积分 = 版块积分 + 销售积分       只看该作者 10楼 发表于: 2023-07-18
    


离线sanmu

性别:
人妖
发帖
682
金币
496
提示:会员销售的附件,下载积分 = 版块积分 + 销售积分       只看该作者 11楼 发表于: 2023-07-21
我如果面试失败一样会想为啥失败。时间一长就忘记了。


离线dw123

性别:
人妖
发帖
71
金币
36
提示:会员销售的附件,下载积分 = 版块积分 + 销售积分       只看该作者 12楼 发表于: 2023-07-22


离线dw123

性别:
人妖
发帖
71
金币
36
提示:会员销售的附件,下载积分 = 版块积分 + 销售积分       只看该作者 13楼 发表于: 2023-07-25
{BT/P!  


离线sanmu

性别:
人妖
发帖
682
金币
496
提示:会员销售的附件,下载积分 = 版块积分 + 销售积分       只看该作者 14楼 发表于: 2023-07-29
失败原因,找到合适的方法,努力的人运气不会太差。


快速回复
限150 字节
 
上一个 下一个