UDN-企业互联网技术人气社区

板块导航

浏览  : 1062
回复  : 1

[资源] 女生做web前端开发之学习前端学习7天之“旅"

[复制链接]
王许柔的头像 楼主
发表于 2016-6-23 14:35:34 | 显示全部楼层 |阅读模式
  4月9号

  收到360的笔试通知过了,然后需要完成前端星计划的项目,花了3天时间,把项目做完了,然后交了,感觉自己做的不是很好,农历和阴历之间的转化算法不清楚,所以这一块的功能就没有做,虽然在网上看到过这部分的代码,但还是没有copy上去本来不抱希望的,然后15号的晚上,接到360奇舞团波波老师的电话,通知让去北京培训,培训完后,进行最后一轮筛选,有点犹豫要不要过去,因为,如果最后没有选上,时间,金钱,精力都白白浪费了。事实证明这种想法是错的,真的没有白去

  本来我也是打算要去北京的,因为接到三个面试都是在北京的,所以准备16号去北京一起面了,然后接到波波老师的通知,便将票改签到19号去北京。

  4月20号

  19号晚上出发,然后20号达到北京,相对其他全国各地的同学,我来的很早,因为21号和HR约了面试,对于这三个面试,可能是已经有offer保底的了,我不是很担心,经验教训,千万不要不要这么想,这个一会和大家详聊。到达北京后,一位师兄去接的我,真的非常非常感谢师兄,人好而且代码技术很厉害,哈哈!师兄把家让给我住,自己去和别人挤去了,感动ing,然后20号就睡过去了,坐车坐的昏天暗地。

  4月21号

  早上七点钟起床,做了两个小时的公交,达到望京soho,和HR约的是11点,不想说soho真的很高大上,这里面的大小公司很多,然后我到达16楼,找到了Darel敢玩公司,开始了面试之旅,HR找了个面试官,看起来萎靡不振,无精打采的,我估计是累的,程序员的宿命。拿着我的简历,看着简历,不说话,我就主动和他说。

  1:你githubl里面放了些什么项目?

  2:谈到css动画效果?我给他看我做的项目,涉及到无缝滚动的效果,面试官觉得我这种做法不优化问我有木有其它方法,我不太清楚,然后他给我讲了。。。。。。

  3:面试官很直接,问我带电脑没有,我说带了,他说开代码。。。。。

  4:问我margin能不能为负数的问题?面试官让我敲代码,我就开敲了,(这个是自己给自己埋坑了,有的话不该说就不要说)

  5:面试官问我,了不了解公司?为什么想来公司?对前端的就业前景怎么样?--好像答的不够理想。这个问题还是得找下中规中距的答案。。。。。

  6:在敲代码的过程中,为了不冷场,我努力的找面试官说话,事实证明,我是错的,面试官好像很不喜欢别人问他问题,不该问的不要问,等到面试官让你问他问题的时候再问

  差不多聊了半个多小时,我才知道,他们公司只有他一个人做前端,加上做Andriod和Ios,研发部加起来一共6个人,他要负责移动端和pc端。我的天,难怪无精打采,小公司就是小公司,总人员加起来30多个人。后来,就没有后来了,当天晚上问了HR,挂了。。。。。

  这个面试的反思就是:和面试官聊天,不要太嘻嘻哈哈,正式专注,否则给人的印象可能就是不踏实,不务实。

  面完Darel敢玩公司后,吃个饭,我就坐上公交坐了2个小时,去面下午的人人的面试。

  首先是,HR拿给我一份笔试题,4页的原生JS,不过都是基础题目,我感觉不难,写完差不多花了一个小时,然后HR就找了个程序员面我。

  一面:程序员

  1:看我简历,简历上附有作品和项目网址,然后他针对性的问了一些问题,看我博客和一些作品。

  2:拿着他的APPLE电脑,叫我回答一些前端的问题,比如浮动,清除浮动;null和undefined的区别;setTimeout的原理,这个给我代码,问我输出的值是多少;还有URL加密和解密的问题;跨域问题等等

  问的不是很难,但笔试题目我有的回答错了,但我还是很冷静的分析。差不多聊了40分钟吧,面试官说,OK我这边没问题,你等下,我去帮你叫下O面(前端主管面)

  二面:前端主管面

  我感觉他问的也不是很难。只想说,这个前端主管的眼神好坚定,我和他一直对视着,他问我问题的时候,也一直看着我。然而,我就和他对视着,哈哈哈。

  1:json和jsonp以及AJAX的区别?

  2:如何解决跨域问题?我自己给自己埋坑了,说了iframe,然而我也不太深入了解。我说了五种方法。。。。。

  3:聊到TCP和IP,udp,http,https的问题?前端主管一直揪着udp和tcp的问题不放,事实是并不了解UDP,又是自己给自己埋坑,机智的我,把话题转过去了,然而前端主管还揪着这个问题不放,我就说,这方面我不太了解。。。。。。

  4:针对我的笔试题目,写了整整四大页的笔试题目,写的我头晕目眩的,面试官问了一些问题。。。。。。

  5:是否了解公司?这个问题,好像每个面试官都会问

  差不多聊了40多分钟吧,我表现的好像还不错,回答的也不错。前端主管就叫我等着,找人来面我。。。。

  我感觉这两个面试官,和我都挺合拍的,聊的来,哈哈哈,性格上都很开放,有激情,动力,活力。。。反正和我上午面的那个面试官的精神状态,完全不一样。。。。。

  三面:HR面

  hr面,反正很轻松了,问啥你就回答啥,眼睛看着对方,展示自己的自信,不要低着头,这是我总结出来的,说话看着对方,是对对方的尊重和真诚,自信。跟我聊实习工资,到岗日期,啥啥啥的,个人性格啊,家庭地址,反正是一堆的个人信息之类的,如实回答就行了。

  面试到此结束,本来22号还有一个穷游网的面试,但22号要去360大厦进行培训上课了,所以,我就推了。

  4月22-4月27

  从22号-27号便是在360大厦总部度过的,首先介绍一下北京吧,从网申-笔试-参加360前端星云计划-北京培训,一路路刷人,自己也算幸运的,能过来上课。虽然一路上奔波劳累,但也算值了。这么多从全国各个选拔过来的小伙伴,以及一群优秀的老师(都是360技术高管)给我们上课,收获很大很大啊!

  每个老师都给我们讲解了涉及前端的各个不同领域的东西。主要包括:http、TCP服务器端原理,JavaScript的开发规范,移动端的介绍,thinkjs(创始人李云银老师亲自授课)和nodejs,前端架构流,cdn托管,以及如何读懂技术文档(编写JavaScript高级程序设计的译者李松峰老师讲解),每一个前沿技术,对自己都是一个冲击,收获真不是一般的大啊!真的要非常感谢这些老师,IT界的技术大牛,程序员的境界原来这么美!

  每一个领域,老师们又引申出了很多前沿的学习工具和新技术,总之,收获很多啊!列举一下这些天涉及到的知识点,供学习前端的孩纸参考。按照时间的先后
  1. 【22.上】
  2. 1.语义化的理解
  3. 2.font awesome
  4. 3.深刻理解问题的原理,修炼代码的细节
  5. 4.与用户打交道,交互变简单,跟人打交道,复杂东西简单化公司日报
  6. 5.JavaScript-的语言重要性脚本,服务器,客户端,硬件方面
  7. 算法,可视化,数据交互,与后端的链接,新的技术,行业的标准w3c标准
  8. chrome下开发,断点调试工具。研究代码,而不是复制代码
  9. 关注新技术,写技术,业务分隔,200人做前端
  10. 5.代码规范,pc jquery mobile MVC think.js ios 安卓app 编译部署的技术
  11. 学习 积累沉淀 分享
  12. 程序 模型与思考 掌握自己的方法论,形成体系的东西,js的安全问题
  13. 6.中间人攻击--
  14. 客户端  ----->服务器端  
  15. 加私钥的问题A->B->C 同时给AC加私钥

  16. 【22.下】
  17. 1.HTTP与性能优从输入url到页面加载完的过程中都发生了什么事情?
  18. 2.UDP和TCP
  19. 3.三次握手,四次挥手
  20. 4.请求响应报文格式   TCP Clint/think.js
  21. 5.TCP Server升级为HTTP server
  22. 6.乱码问题
  23. 7.什么是http状态
  24. 8:header的分类 content-length来表示其长度
  25. 9:压缩content-Encoding:gzip
  26. 10:get和post的区别?
  27. 11:cookie的理解?
  28. 12:Accept-Encoding/Content-Encoding
  29. 13:抓包工具 wireshark|fiddle|firebug|IE8+自带工具
  30. 14:发包工具 telnet/curl | fiddle
  31. 15:http的历史
  32. 16:http性能优化问题?
  33. 17:keep-alive减少后续的握手时间
  34. 18:同域并发控制?
  35. 19:模块拆分导致更多的请求||合并请求
  36. 20:压缩
  37. 21:缓存的问题 Etag||expires|cache-control|
  38. 22:浏览器请求的三种方式?F5|cmd+r|忽略Expires和cache-control,发起协商请求
  39. 23:样式内联|
  40. 24:用户心理?
  41.    BigPipe|异步加载|按需加载|加载提示|进度条|预判行为|
  42. 25:http性能指标 Yslow
  43. 26:http瀑布图
  44. 27:《图解http 上野宣》《http权威指南》《web性能权威指南》

  45. 【23.上】

  46. 1.HTML的关键点(doctype与渲染模式|语义化)
  47. 2.doctype的作用?文档声明|
  48. 3.渲染模式 ?w3c标准模式|准标准模式
  49. 4.xhtml class必须小写|属性为单引号|含有结束标签
  50. 5.html设计思想?兼容已有内容|避免不必要的麻烦|解决现实问题(localstorage/geoloaction)|优雅降级|尊重事实标准|用户》开发者》浏览器厂商》标准制定者》
  51. 6.html5标签(nav|embedded)
  52. 7.语义化(元素,属性及属性值都拥有语义含义)
  53. 8.语义化的好处?可访问性|便于seo|易读|易维护
  54. 9.base:指定基准url及链接打开方式(traget为空白)|meta:页面元数据
  55. 10:使用meta扩展html?<blockquote>--一段文字的引用|ol有序|ul无序
  56. 11:<figure> alt:当图片不被识别时,或者在客户端时,阻止图片加载,则此时可用alt来表示说明
  57. 12;lang属性--规定元素内容的语言
  58. 13:如何做到语义化?了解标签的语义|手写html,避免生成工具|遵守行业通用标准|行为样式结构分开
  59. 14:微格式|schema.org|ARIA
  60. 15:webplatform.org--学习网站
  61. 16:代码风格?rel:指定外部引入的资源与当前页面的关系
  62. 17:简单选择器的选择组合
  63. 18:继承-重叠样式,某些属性会自动继承其父元素的值,除非显示指定的一个值19:字体系列|‘font-size|px em(一般是相对于font-size的计算值)  百分比
  64. 20:颜色的关键字rgba-解决使用opacity时,遮罩层和文字所有的东西都变为了半透明的情况。
  65. 21:HSL:颜色值,饱和度,亮度
  66. 22:对齐方式?justify:分散对齐,适用于多行才会起作用,

  67. 【23.下】
  68. 1.盒模型和视觉可视化模型
  69. 2.viewport可视区域 视口
  70. 3.块级元素,inline-block元素本身是行级,
  71. 4.排版流(文档流)
  72.   在排版流中块级元素独占一行,块级元素会受到浮动元素的影响
  73. 5.float浮动
  74. 6.如何清除浮动?clear|BFC
  75.   浮动元素会对后续的行级元素产生影响
  76.   :before|:after|伪元素,伪类
  77. 7.BFC:块级格式化上下文,把自己里面的东西框起来,包括浮动,使其不影响外面的元素
  78.   BFC的创建:overflow:hidden|overflow:auto|BFC不会和块级元素重叠
  79.   BFC作用:双栏布局|清除浮动|防止margin重叠
  80. 8:position:fixed相对于viewport进行固定的
  81. 9:堆叠层次 z-index
  82. 10:兄弟选择器 h2~p--跟h2并列的共样式
  83.   input:checked~nav{}---当选择框被选择后,对nav进行一系列的操作
  84. 11:background size背景图片的大小
  85. 12.transition :all 2s--所有的都一起发生变化
  86. 13:代码风格
  87. 14:代码规范:BEM|smacss
  88. 15:css预处理器:less|sass|postcss
  89. 16:mobile和pc端
  90. 17:viewport
  91. 18:Media Query-媒体查询
  92. 19:flebox属性

  93. 【24.上】
  94. 1.变量的赋值?动态绑定|动态类型
  95. 2.JQuery
  96. 3.zepto下data方法只能处理字符串

  97. 【25.上】
  98. 1.前端工作流问题
  99. 2.合并图片的好处?减少内存开销|减少请求的次数
  100. 3.grunt-编译管理工具 grunt-cli(可解决版本问题,针对不同的版本进行兼并)|
  101. 4.js的注意点?代码审查->编译-> 合并->压缩
  102. 5.针对css?预编译(sass|less|stylus)->后处理(autoprefixer|Mixin)->合并->压缩
  103. 6.图片处理?压缩->合并(css spirte)
  104. 7.完整处理?处理js->处理css->处理图片->自动化测试->处理版本(cdn处理)->发布上线
  105. 8.开发版本?提供静态服务器|只做基础编译|实时编译|
  106. 9.GULP与Grunt的区别?
  107. 10.GULPfile.js配置|执行?
  108. 11.webpack配置|和webpack执行
  109. 12.FIS配置工具

  110. 【25.下】
  111. 1.读写文件
  112. 2.创建http服务
  113. 3.c10k问题
  114. 4.Nginx-异步非阻塞的问题--即高性能的HTTP和反向代理服务器
  115. 5.io.js
  116. 6.node.js的模块--基于CommonJS
  117.   一个单独的文件就是一个模块|
  118.   var circle=require('.\circel.js')-相对路径的方式
  119.   绝对路径
  120. 7.模块加载的策略
  121. 8.删除模块缓存
  122. 9.原生模块 http|url...
  123. 10.npm--把所有的模块进行统一管理,直接将npm打包到node里面
  124. 11.node.js框架--express|koa|sails.js|think.JS
  125. 12.ES6/7特性如下:语法改进|开发方便|
  126. 13.arrows 省略function关键字和return|
  127. 14.classes/extends继承类/super调用方法
  128. 15.template strings
  129. 16.destructuring
  130. 17.default+rest+spread
  131. 18.modules
  132. 19.node.js最大的问题?异步的问题
  133. 20.callback hell  嵌套严重|不能统一处理错误|try/catch不能捕获错误
  134. 21.promise--pedding(可转换为另外的两种状态)|resolved(成功)|rejected(失败)
  135. 22.callback包装为promise
  136. 23.promise的问题?this指向问题|局部变量需要借助外部变量才能进行
  137. 24.generators function *gen(){}
  138. 25.generators问题?语义不易理解|需要借助执行器|无法与arrows一起使用|比如yield *yield
  139. 26.AsYnc functions--基于promise|返回promise|使用async/wait更加语义化|错误捕获|并行处理|问题?
  140.    1.stage-3
  141.    2.没有Runtime支持
  142. 27.Babel 基于v8  Babel is a JavaScript compiler
  143. 28.ES6/7+Babel
  144. 29.demo npm install -g npm@3 -
  145.    demo npm thinkjs module admin
  146.    admin->controller->user.js->
  147.    view->admin->

  148. 【26.上】
  149. 1.组织与结构 LC
  150. 2.岗位分工以及分工合作流程
  151.   技术发展路线图
  152.   前端后端架构模式
  153. 3.web平台部--9个部门
  154. 4.网站架构
  155. 5.网站架构模式 MVC分层|分割|分布式|集群|缓存|异步|冗余|自动化|安全
  156. 6.高性能?前端性能优化|服务器性能优化|存储性能优化
  157. 7.前端性能优化?
  158.   减少HTTP请求|使用浏览器缓存|启用压缩|css放在页面最上面,js放在下面|减少cookie传输|cdn加速|
  159.   延迟一切能延迟的:bigRender,switchable|就近原则
  160. 8.分布式缓存:缓存热点数据、hash算法取模,memcache,
  161. 9.高可用?getlab/git
  162. 10.代码协作管理
  163. 11.导航业务分析
  164. 12.技术一览?导航特征页面简单|数据静态化|使用NGINX,异步,抓取文件到本地文件
  165. 13.前端架构|浏览器优化技术|cdn|动静分离,静态资源独立部署|DNS|应用开发架构|开发框架
  166.    动态页面静态化|业务拆分|虚拟化服务器|分布式消息|分布式缓存|数据采集与监控|浏览器数据采集|服务器性能数据采集|系统监控报警|架构误区

  167. 【26.下】
  168. 1.原型:prototype是js构造器的一个特殊的属性,它上面的所有的属性和方法被它的所有实例所共享。
  169. 2.asynchronous
  170.   异步:是单线程的JavaScript处理触发任务。
  171. 3.document ready
  172. 4.捕获阶段在最外层,先于内层
  173.   如果中间存在阻止冒泡的话,会将后面的事件推到最前面进行,即捕获阶段。
  174. 5.transform-origin:0 45px
  175.    Math.cos(Math.PI*2*p)*145+'px'
  176.         sin
  177. 6.兼容性?框架底层封装和polyfill(实现标准库)
  178. 7.return [].slice.call(arguments).reduce(function(a,b){return a+b;})--支持多个传参

  179. 【27.上】
  180. 1.使用cdn以及开发工具
  181. 2.影响网络传输速度的因素
  182. 3.cdn是什么?接管dns|用户访问cdn节点|cdn节点内容来自源站
  183. 4.dig|nslookup--可看到dns解析
  184. 5.cdn的优势?以前端角度看cdn
  185. 6.用于cdn加速的内容有哪些?
  186. 7.静态资源?依据url定位资源|内容允许被cdn节点缓存
  187. 8.cookie.frame.domain
  188. 9.动态资源是什么?可以被cdn加速吗?
  189. 10.jsonp方式的调用?通过动态添加的方式。改变script中的src
  190. 11.合理回源
  191. 12.静态页面资源
  192. 13.前端公共库
  193. 14.ISP--运营商
  194. 15.流媒体加速
  195. 16.chrome|IE
  196. 17.高级js程序设计--李松峰老师
  197. 18.如何阅读和翻译?
  198. 19.如何把翻译一本书?
  199. 20.注意积累
复制代码

  总而言之,收获很多,方向更加明确了,知道自己要学习哪些东西,虽然东西很多,慢慢来,很感谢360的各位大牛,分享自己的一些干货,相信,经过培训的46名同学未来都能进入很棒的互联网公司。(忘了说了,一起上课的有两位清华大学的学生,还有一半的研究生),呜呜,感觉自己弱爆了,不过,学到了很多东西。

  虽然360面试挂了,但我还是大三,还有机会,秋招可以继续,哈哈哈,努力好好修炼,这次北京培训,对自己的眼界和技术各方面,都有了一个重新认识。前方很美好,继续努力,继续修炼。对于360面试的问题,比较细节,自己需要加强各方面的联系,多敲代码,多思考,多总结!

相关帖子

发表于 2017-4-6 10:31:42 | 显示全部楼层
楼主,您好,看到您发的星计划的帖子,能不能和您交流一下,方便加一下发一下邮箱不,我的邮箱是(13327311312@163.com)谢谢了
使用道具 举报

回复

您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

关于我们
联系我们
  • 电话:010-86393388
  • 邮件:udn@yonyou.com
  • 地址:北京市海淀区北清路68号
移动客户端下载
关注我们
  • 微信公众号:yonyouudn
  • 扫描右侧二维码关注我们
  • 专注企业互联网的技术社区
版权所有:用友网络科技股份有限公司82041 京ICP备05007539号-11 京公网网备安1101080209224 Powered by Discuz!
快速回复 返回列表 返回顶部