前端开发的经典面试题有哪些?你知道吗?

283 阅读6分钟

1,如何进行网站性能优化

(1)目的: 

从用户角度而言,优化能够让页面加载得更快、对用户的操作响应得更及时,能够给用户提供更为友好的体验。从服务商角度而言,优化能够减少页面请求数、或者减小请求所占带宽,能够节省可观的资源。

(2)措施:

——减少HTTP请求数。
——使用缓存。
——脚本的无阻塞加载。
——内联脚本的位置优化等。
——Javascript中的DOM 操作优化、CSS选择符优化。
——图片编码优化,懒加载。
——使用负载均衡方案。

2,什么是mvvm,mvc?区别?

(1)MVC(Model-View-Controller)

MVC是比较直观的架构模式,用户操作
->View(负责接收用户的输入操作)
->Controller(业务逻辑处理)->Model(数据持久化)->View(将结果反馈给View)。MVC使用非常广泛,比如JavaEE中的SSH框架。

(2)MVVM(Model-View-ViewModel)

如果说MVP是对MVC的进一步改进,那么MVVM则是思想的完全变革。
它是将“数据模型数据双向绑定”的思想作为核心,因此在View和Model之间没有联系,
通过ViewModel进行交互,而且Model和ViewModel之间的交互是双向的,
因此视图的数据的变化会同时修改数据源,而数据源数据的变化也会立即反应view。
微信小程序前端使用mvvm。

3,px和em的区别

px表示像素 (计算机屏幕上的一个点:1px =1/96in),是绝对单位,不会因为其他元素的尺寸变化而变化;
em表示相对于父元素的字体大小。em是相对单位 ,没有一个固定的度量值,而是由其他元素尺寸来决定的相对值。

4,优雅降级和渐进增强

渐进增强(Progressive Enhancement):一开始就针对低版本浏览器进行构建页面,完成基本的功能,然后再针对高级浏览器进行效果、交互、追加功能达到更好的体验。
优雅降级(Graceful Degradation):一开始就构建站点的完整功能,然后针对浏览器测试和修复。比如一开始使用 CSS3 的特性构建了一个应用,然后逐步针对各大浏览器进行 hack 使其可以在低版本浏览器上正常浏览。

其实渐进增强和优雅降级并非什么新概念,只是旧的概念换了一个新的说法。在传统软件开发中,
经常会提到向上兼容和向下兼容的概念。渐进增强相当于向上兼容,而优雅降级相当于向下兼容。

5, JS哪些操作会造成内存泄露

(1)意外的全局变量引起的内存泄露。
          function leak()
                 {
                   leak=
                  "xxx"
                  ;//leak成为一个全局变量,不会被回收 }
(2)闭包引起的内存泄露。
(3)没有清理的DOM元素引用。
(4)被遗忘的定时器或者回调 

(5)子元素存在引起的内存泄露。

6,什么是闭包,如何使用它,为什么要使用它?

闭包就是能够读取其他函数内部变量的函数。由于在Javascript语言中,
只有函数内部的子函数才能读取局部变量,
因此可以把闭包简单理解成“定义在一个函数内部的函数”。

所以,在本质上,闭包就是将函数内部和函数外部连接起来的一座桥梁。闭包可以用在许多地方。它的最大用处有两个,一个是前面提到的可以读取函数内部的变量,另一个就是让这些变量的值始终保持在内存中。

使用闭包的注意点:
· 由于闭包会使得函数中的变量都被保存在内存中,内存消耗很大,所以不能滥用闭包,否则会造成网页的性能问题,在IE中可能导致内存泄露。解决方法是,在退出函数之前,将不使用的局部变量全部删除。
· 闭包会在父函数外部,改变父函数内部变量的值。所以,如果你把父函数当作对象(
object
)使用,把闭包当作它的公用方法(Public Method),把内部变量当作它的私有属性(
private
value
),这时一定要小心,不要随便改变父函数内部变量的值。

7,请解释一下JavaScript的同源策略。

在客户端编程语言中,如javascript和 ActionScript,同源策略是一个很重要的安全理念,它在保证数据的安全性方面有着重要的意义。
同源策略规定跨域之间的脚本是隔离的,一个域的脚本不能访问和操作另外一个域的绝大部分属性和方法。那么什么叫相同域,什么叫不同的域呢?
当两个域具有相同的协议, 相同的端口,相同的host,那么我们就可以认为它们是相同的域。
同源策略还应该对一些特殊情况做处理,比如限制file协议下脚本的访问权限。
本地的HTML文件在浏览器中是通过file协议打开的,如果脚本能通过file协议访问到硬盘上其它任意文件,就会出现安全隐患,目前IE8还有这样的隐患

8,怎样添加、移除、移动、复制、创建和查找节点?

(1)创建新节点

createDocumentFragment() //创建一个DOM片段
createElement() //创建一个具体的元素
createTextNode() //创建一个文本节点

(2)添加、移除、替换、插入

appendChild() //添加
removeChild() //移除
replaceChild() //替换
insertBefore() //插入

(3)查找

getElementsByTagName() //通过标签名称
getElementsByName() //通过元素的Name属性的值
getElementById() //通过元素Id,唯一性


关于前端开发面试的题库,本篇文介绍的只是其中的一部分,前端学习不是一蹴而就的事情,需要每天不断积累。我这里还有更多前端面试题库资源,有想要了解前端、学习前端的小伙伴可以加我QQ:822311796 更有某机构价值5980元的VIP零基础前端入门视频免费送哟~





更多前端进阶知识,尽在WEB明教光明顶(web.xingruanedu.com