在每个Web前端求职者的面试过程中,一定都有过被面试官问到项目中的难点,而答不上来的情况。为了让大家在Web前端面试前准备得更加充足,我准备了一些易被忽视且难度较高的前端面试题,希望可以帮助大家更加顺利完成求职,找到自己满意的工作。

1、流式布局如何实现,响应式布局如何实现?

流式布局:也叫fluid,当上面一行的空间不够容纳新的TextView时候才开辟下一行的空间。场景:主要用于关键词搜索或者热门标签等场景;他主要是按照页面元素的宽度按照屏幕分辨率进行适配调整,但整体布局不变,使用%百分比定义宽度,高度大都是用px来固定,可以根据可视区域和父元素的实时尺寸来调整,尽可能适应各种分辨率。

响应式布局:主要是实现不同屏幕分辨率的终端上浏览网页的不同展示方式,通过响应式设计能使网站在手机和平板电脑上有更好的浏览阅读体验;首先设置meta标签,通过媒体查询来设置样式Media Queries,然后再设置多种试图宽度。

2、什么是“use strict”,好处和坏处是什么?

ECMAscript 5添加了第二种运行模式:“严格模式”(strict mode)。顾名思义,这种模式使得Javascript在更严格的条件下运行。

好处:消除Javascript语法的一些不合理、不严谨之处,减少一些怪异行为;消除代码运行的一些不安全之处,保证代码运行的安全;提高编译器效率,增加运行速度;为未来新版本的 Javascript 做好铺垫。注:经过测试IE6,7,8,9均不支持严格模式。

缺点:现在网站的JS都会进行压缩,一些文件用了严格模式,而另一些没有。这时这些本来是严格模式的文件,被merge后,这个串就到了文件的中间,不仅没有指示严格模式,反而在压缩后浪费了字节。

3、介绍一websocket。

websocket是一种网络通信协议,是HTML5开始提供的一种在单个TCP连接上进行全双工通信的协议,这个对比着http协议来说,http协议是一种无状态的、无连接的、单向的应用层协议,通信请求只能由客户端发起,服务端对请求做出应答处理。http 协议无法实现服务器主动向客户端发起消息,Websocket连接允许客户端和服务器之间进行全双工通信,以便任一方都可以通过建立的连接将数据推送到另一端。WebSocket只需要建立一次连接,就可以一直保持连接状态。

4、jquery如何绑定事件,有几种类型和区别?

jquery 绑定事件的方法分别是:bind(),live(),delegate()和 on(),像bind(),live(),delegate(),随着jquery版本的更新,已经被移除。注意:bind()是在3.0版本之后被移除的,现在用的最多的是on(),on()既可以绑定单事件,也可以绑定多事件,还可以进行事件委托。

区别:bind()的事件绑定是只对当前页面选中的元素有效,对动态创建的元素bind()事件,是没有办法达到效果的,而其余三个可以。

5、单页面应用有什么SEO方案?

原因:较之于传统页面,单页应用需要先下载框架(数据 / 模板),然后才能开始加载数据、

方案:服务器端渲染首屏(SSR基于vue的服务端下载);让服务端把首屏的数据渲染在页面上;进行基本的css模板js的编译合并;减少请求次数,使用gulp工具,把css打包成一个文件,js打包成一个文件, 模板打包成一个js文件($templateCache) 可以和js文件打包成一起(促使模板JS文件和JS文件一次性请求);代码分块,如果首屏不需要的块,就不用加载了;路由组件懒加载。当打包构建应用时,Javascript包会变得非常大,影响页面加载。如果我们能把不同路由对应的组件分割成不同的代码块,然后当路由被访问的时候才加载对应组件,这样更加高效;如果有大量图片使用懒加载。

以上就是我总结的Web前端面试时被问到项目中的难点。如果还有对Web前端面试抱有疑问的小伙伴,可以持续关注我,相信对大家的面试会有很大的帮助。

一些易被忽视且难度较高的Web前端面试题汇总相关推荐

  1. 前端面试题高性能高并发100+

    1. 前端性能优化? 前端性能优化:减少消耗,提高用户体验. 减少请求数量. 合理规划利用请求,合理利用缓存技术减少不必要的频繁请求.及时性不高的数据可以缓存起来利用, 例如一些基础数据.应用懒加载技 ...

  2. 计算机专业c语言挂科怎么办,大学最容易挂科的“学科排行榜”出炉,补考难度很高,你挂了吗?...

    高考是改变命运的独木桥,决定未来发展方向的一次重要的机会,在经历了12年的寒窗苦读之后,学子都希望能够考入一个较好的大学,选择一个好就业的专业,让自己的人生顺顺当当的,但是哪怕是上了大学之后,依旧不能 ...

  3. c语言编程大体难度较高的,面向初学者的C语言编程方法研究

    李欣潼 摘要:C语言是一门十分重要但对初学程序设计的同学来说又是相对难学的一门计算机语言.从初学者的角度出发,按照分析问题,算法设计,编码实现及程序运行几个步骤,说明了学习C语言的方法.论文以二元一次 ...

  4. 几点易被忽视的网络软故障排查

    几年的以太网络维护中,遇到了很多令人头疼的故障,但排除后,却又觉得自己很笨.这就是易被忽视的网络软故障而导致的.初次面对这类故障时,往往使人会束手无策,多次往复排查而无结果,当问题迎刃而解时,却又显得 ...

  5. 易被忽视的贝叶斯概率

    易被忽视的贝叶斯概率 @(概率论) 全概率是对事件进行划分,求的是总概率.贝叶斯是已知某事件发生,求是其中一件的概率.在前面我们列举过一个例子,讲村庄被偷的概率就是全概率,已知被偷,那么计算是哪个小偷 ...

  6. 不想参加难度较高的全国联考,可以选择中外合作办学硕士在职研究生

    许多人想要获得硕士学位,但是还不想参加考试难度较高的全国联考,这个时候就可以选择中外合作办学硕士在职研究生,中外合作办学在职研究生项目怎么样? 中外合作办学硕士在职研究生项目还是不错的,值得报考. 1 ...

  7. Sovrin:技术落地可期,但推广难度较高

    本期项目:Sorvin 宏观上看,区块链在身份认证领域具有一定的推广潜力,但仍会存在较大的应用障碍.有区块链技术背景的 Evernym 公司深度参与了 Sovrin 的发展,预计 Evernym 会对 ...

  8. “华为天才少年”自制百大Up奖杯,网友:技术难度不高侮辱性极强

    来源:雷锋网 B站硬核黑科技Up主.AI算法工程师稚晖君,停更了好一阵子后,这位自称野生钢铁侠的超硬核Up主终于又发布了新作品. 之所以停更这么久,Up主解释说,不是因为在野外被捕了,纯粹是因为工作太 ...

  9. 太赛博朋克!华为天才少年自制B站百大Up奖杯,网友:技术难度不高,侮辱性极强...

    大数据文摘授权转载自AI科技评论 作者:贝爽 在程序员的眼中,"平平无奇"四个字是不存在的. 比如,刚吃完的"螃蟹壳"只能变成垃圾? NO,给它裹上一层黑科技就 ...

  10. 华为天才少年自制B站百大Up奖杯!网友:技术难度不高,但侮辱性极强

    点击上方"CVer",选择加"星标"置顶 重磅干货,第一时间送达 本文转载自:AI科技评论  作者 | 贝爽 在程序员的眼中,"平平无奇"四 ...

最新文章

  1. 《与编码人员一起工作》作者访谈
  2. 【Linux 内核】调度器 ⑥ ( task_woken 函数 | set_cpus_allowed 函数 | rq_online 函数 | rq_offline 函数 )
  3. DataX在有赞大数据平台的实践
  4. Python 项目实践三(Web应用程序)第一篇
  5. 接口自动化测试框架实例教程
  6. 杭电oj-----Farm Irrigation(BFS)
  7. GBK编码/GBK内码/Big5
  8. 桌面图标有蓝底怎么去掉方法
  9. python展示水果价格_小姨开水果店的,所以今天用Python写了一个水果店小系统!...
  10. 计算机 64虚拟内存设置方法,64位的WIN7,4G内存,虚拟内存怎么设置
  11. 对《人工智能的进化》这一人工智能方面科普书籍的学习/摘抄/总结
  12. rop检查_【国际高影响力文章红毯秀7月】白内障扩瞳安全性、ROP筛查新标准、45mmHg眼内灌注压...
  13. 工作用哪个邮箱好用?好用的办公邮箱让你放假无烦恼
  14. 右键删除或新增 Open Folder as Intellij IDEA Project
  15. 达内培训python百度云下载
  16. 仿制网站被抄袭的几个有效解决的方法
  17. 康耐视 visionpro图像角度识别
  18. java线程池的正确使用方式,completableFuture
  19. SQL Server如何设置账号密码
  20. python如何压缩文件?

热门文章

  1. Model/ModelAndView
  2. web 打印插件 hiprint 使用
  3. AutoResetEvent和ManualResetEvent用法
  4. 无人驾驶汽车系统入门(十四)——ROS入门与实践(1)
  5. Win8.1 ext-ms-win-ntuser-uicontext-ext-l1-1-0.dll等缺失
  6. 动态推荐系统关键技术研究(一)
  7. 微软疑断自由软件开发者“活路”,禁止在微软商店发布商业开源
  8. nvme linux读写测试工具,不同硬件平台(intel/AMD)和不同OS/FS/测试工具下NVMe SSD性能简测...
  9. CruiseControl服务器安装配置
  10. 浅析 DDD 领域驱动设计