前端开发面试题

对闭包的理解
使用闭包主要是为了设计私有的方法和变量。闭包的优点是可以避免全局变量的污染,缺点是包会常驻内存,会增大内存使用量,使用不当很容易造成内存泄露。
闭包有三个特性:
1.函数嵌套函数
2.函数内部可以弓|用外部的参数和变量
3.参数和变量不会被垃圾回收机制回收

谈谈Cookie的弊端
1.Cookie数量和长度的限制。每个domain最多只能有20条cookie,每个cookie长度不能 超过
4KB,否则会被截掉。
2.安全性问题。如果cookie被人拦截了,那人就可以取得所有的session信息。即使加密也与事无
补,因为拦截者并不需要知道cookie的意义,他只要原样转发cookie就可以达到目的了。
3.有些状态不可能保存在客户端。例如,为了防止重复提交表单,我们需要在服务器端保存一个
计数器。如果我们把这个计数器保存在客户端,那么它起不到任何作用。

cookie和session的区别:
1、cookie数据存放在客户的浏览器上,session数据放在服务器上。
2、cookie不是很安全,别人可以分析存放在本地的COOKIE并进行CO0KIE欺骗 考虑到安全应当使用session.
3、session会在一 定时间内保存在服务器上。当访问增多,会比较占用你服务器的性能 考虑到减轻服务器性能方面,应当使用COOKIE。
4、单个cookie保存的数据不能超过4K,很多浏览器都限制一个站点最多保存20个cookie。
5、所以个人建议:
将登陆信息等重要信息存放为SESSION
其他信息如果需要保留,可以放在COOKIE中

CSS3有哪些新特性
CSS3实现圆角( border-radius),阴影(box- shadow),
对文字加特效(text-shadow、),线性渐变(gradient) ,旋转(transform)
transform: rotate(9deg) scale(0. 85,0.90) translate(0px, -30px) skew( -9deg, 0deg);//旋转,缩放,定位
增加了更多的CSS选择器多背景 rgba
在CSS3中唯一引入的伪元素是::selection.
媒体查询,多栏布局
border- image

htmI5有哪些新特性,如何处理HTML5新标签的浏览器兼容问题?如何区分HTML和HTML5 ?

HTML5现在已经不是SGML的子集,主要是关于图像,位置,存储,多任务等功能的增加。
拖拽释放API
语义化更好的内容标签
音频、视频API
画布API
地理API
本地离线存储localStorage长期存储数据,浏览器关闭后数据不失;
sessionStorage的数据在浏览器关闭后自动删除
表单控件, calendar、date、 time、 email、 url、 search
新的技术webworker, websocket, Geolocation
IE8/IE7/[E6支持通过document.createElement方法产生的标签,
可以利用这一特性让这些浏览器支 持HTML 5新标签
浏览器支持新标签后,还需要添加标签默认的样式:
当然最好的方式是直接使用成熟的框架、使用最多的是html5shim框架
<!--[ifltIE 9]>
<script> src=ttp://tml5shim.googlecode. com/svn/trunk/html5.js" </script>
<![endif]-->

如何对网站的文件和资源进行优化
文件合并
文件最小化/文件压缩
使用CDN托管
缓存的使用(多个域名来提供缓存)

减少页面加载时间的方法
1.优化图片
2.图像格式的选择(GIF: 提供的颜色较少,可用在-些对颜色要求不高的地方)
3.优化CSS (压缩合并css,如margin-top , margin-left…)
4.网址后加斜杠(如www.campr.com/目录,会判断这个“目录是什么文件类型,或者是目录。)
5.标明高度和宽度(如果浏览器没有找到这两个参数,它需要一边下载图片一边计算大小,如果图片很多,浏览器需要不断地调整页面。这不但影响速度,也影响浏览体验。当浏览器知道了高度和宽度参数后,即使图片暂时无法显示,页面上也会腾出图片的空位,然后继续加载后面的内容。从而加载时间快了,浏览体验也更好了。)
6.减少http请求(合并文件,合并图片)。

性能优化的方法
(1)减少http请求次数: CSS Sprites, JS、Css源码压缩、图片大小控制合适;网页Gzip; CDN托管,data缓存,图片服务器。
(2)前端模板 JS+数据,减少由于HTML标签导致的带宽浪费,前端用变量保存AJAX请求结果,每次操作本地变量,不用请求,减少请求次数
(3)用 innerHTML代替DOM操作,减少DOM操 作次数,优化javascript性能。
(4) 当需要设置的样式很多时设置className而不是直接操作style。
(5) 少用全局变量、缓存DOM节点查找的结果。减少I0读取操作。
(6) 避免使用CSS Expression (css表达式)又称Dynamic properties (动态属性)。
(7) 图片预加载,将样式表放在顶部,将脚本放在底部 加上时间戳。
移动端性能优化
尽量使用css3动画,开启硬件加速。适当使用touch事件代替click事件。避免使用css3渐变阴影效果。尽可能少的使用box- shadowgradientsbox- shadowgradients往往都是页面的性能杀手

new操作符具体干了什么呢
1、创建一个空对象,并且this变量引用该对象,同时还继承了该函数的原型。
2、属性和方法被加入到this 引用的对象中。
3、新创建的对象由this所引用,并且最后隐式的返回this 。

事件、IE与火狐的事件机制有什么区别?如何阻止冒泡
1.我们在网页中的某个操作(有的操作对应多个事件)。例如:当我们点击一个按钮就会产生一个事
件。可以被JavaScript侦测到的行为。
2.事件处理机制: IE是事件冒泡、firefox同时支 持两种事件模型,也就是:捕获型事件和冒泡型事
件。;
3. ev.stopPropagation);注意旧ie的方法ev.cancelBubble = true;

HTTP状态码

100 Continue 继续,一般在发送post请求时,已发送了http header之后服务端将返回此信息,表示确认,之后发送具体参数信息
200 OK 正常返回信息
201 Created 请求成功并且服务器创建 了新的资源
202 Accepted 服务器已接受请求,但尚未处理
301 Moved Permanently 请求的网页 已永久移动到新位置。
302 Found 临时性重定向。
303 See other 临时性重定向, 且总是使用GET请求新的URI.
304 Not Modified自从 上次请求后,请求的网页未修改过。
400 Bad Request 服务器无法理解请求的格式,客户端不应当尝试再次使用相同的内容发起请求。
401 Unauthorized 请求未授权。
403 Forbidden 禁 止访间。
404 Not Found 找不到如何与 URI相匹配的资源。
500 Internal Server Error 最常见的服务器端错误。
503 Service Unavailable服务器端暂时无法处理请求(可能是过载或维护)。

浏览器是如何渲染页面的
1.解析HTML文件, 创建DOM树。自上而下,遇到任何样式(link、 style) 与脚本(script) 都会阻塞(外部样式不阻塞后续外部脚本的加载)
2.解析CSS。优先级:浏览器默认设置<用户设置<外部样式<内部样式<HTML 中的style样式;
3.将CSS与DOM合并,构建渲染树(Render Tree)
4.布局和绘制,重绘(repaint) 和重排(reflow)

异步加载和延迟加载
1.异步加载的方案:动态插入script标签
2.通过ajax去获取js代码,然后通过eval执行
3. script标签上添加defer或者async属性
4.创建并插入iframe,让它异步执行js
5.延迟加载:有些js代码并不是页面初始化的时候就立刻需要的,而稍后的某些情况才需要的。

null和undefined的区别
null是一个表示"无"的对象,转为数值时为0 ; undefined是一个表示’ 无"的原始值, 转为数值时为NaN。
当声明的变量还未被初始化时,变 量的默认值为undefined。
null用来表示尚未存在的对象,常用来表示函数企图返回一个不存在的对象。
undefined表示"缺少值" ,就是此处应该有一个值,但是还没有定义。典型用法是:

(1)变量被声明了,但没有赋值时,就等于undefined.
(2)调用函数时,应该提供的参数没有提供,该参数等于undefined.
(3)对象没有赋值的属性,该属性的值为undefined.
(4)函数没有返回值时,默认返回undefined.

null表示’没有对象" ,即该处不应该有值。典型用法是:

(1)作为函数的参数, 表示该函数的参数不是对象。
(2)作为对 象原型链的终点。

线程与进程的区别
一个程序至少有一个进程,一个进程至少有一个线程.
线程的划分尺度小于进程,使得多线程程序的并发性高。
另外,进程在执行过程中拥有独立的内存单元,而多个线程共享内存,从而极大地提高了程序的运行效率。
线程在执行过程中与进程还是有区别的。每个独立的线程有一个程字运行的入口、顺序执行序列和程序的出口。但是线程不能够独立执行,必须依存在应用程序中,由应用程字提供多个线程执行控制。
从逻辑角度来看,多线程的意义在于一个应用程序中,有多个执行部分可以同时执行。但操作系统并没有将多个线程看做多个独立的应用,来实现进程的调度和管理以及资源分配。这就是进程和线程的重要区别。

Doctype作用?严格模式与混杂模式如何区分?它们有何意义?
(1)、<!DOCTYPE> 声明位于文档中的最前面,处于 标签之前。告知浏览器以何种模式来渲染文档。
(2)、严格模式的排版和JS运作模式是 以该浏览器支持的最高标准运行。
(3)、在混杂模式中,页面以宽松的向后兼容的方式显示。模拟老式浏览器的行为以防止站点无法工作。
(4)、DOCTYPE不存在或格式不正确会导致文档以混杂模式呈现。

浏览器输入url到页面呈现出来发生了什么
1)、进行地址解析 解析出字符串地址中的主机,域名,端口号,参数等
2)、根据 解析出的域名进行DNS解析

  1. 首先在浏览器中查找DNS缓存中是否有对应的ip地址,如果有就直接使用,没有就执行第二步
  2. 在操作系统中查找DNS缓存是否有对应的ip地址,如果有就直接使用,没有就执行第三步
  3. 向本地DNS服务商发送请求查找时候有DNS对应的ip地址。如果仍然没有最后向Root Server服务商查询。

3)、根据查询到的ip地址寻找目标服务器

  1. 与服务器建立连接
  2. 进入服务器,寻找对应的请求

4)、浏览器接收到响应码开始处理。
5)、浏览器开始渲染dom,下载css、 图片等一些资源。直到这次请求完成

https、http区别
1.https协议需要到ca申请证书,-般免费证书较少,因而需要一 定费用。
2.http是超文本传输协议,信息是明文传输,https则是具有安全性的ss加密传输协议。
3.http和https使用的是完全不同的连接方式,用的端口也不一样,前者是80, 后者是443。
4.http的连接很简单,是无状态的; HTTPS协议是由SSL+HTTP协议构建的可进行加密传输、身份认证的网络协议,比http协议安全。

请解释JSONP的工作原理,以及它为什么不是真正的Ajax?
JSONP是利用标签没有同源策略的限制(算是一个漏洞) ,来达到与第三方通信,从而实现跨域。

我们通常使用js代码动态创建一个script标签, src引用第 三方api的地址,并提供一个回调函数的function name,例如http://www.smartstudy.com/apicallback-functionName ,query的key是约定
好的,比如这里就叫callback, functionName是 我们前端定义好的函数,后端通过query取到函数名,
并把你所需要的数据已参数的形式传给这个函数,返回给浏览器。浏览器解析服务器返回数据,functionName函数,参数为资源数据。

JSONP并不使用XMLHttpRequest对象加载资源,而是通过script标签把资源当做普通的javascript脚本来加载,所以不存在跨域问题,也不是真正的AJAX。

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值