美文网首页
前端面试总结

前端面试总结

作者: 代小代isDelenDelen | 来源:发表于2017-04-29 13:18 被阅读77次

           面试官为了体现自己的能力,面试的时候必然会千方百计的问倒你,这样要想有个好的面试结果,自然资料复习是必不可少的!下面一些总结,希望给大家带来帮助:

    # 1 bootstrap的删格布局实现方法:

    row在container下会有padding-left:15px;  自身有margin-right:-15px  在row外使用col是无效的  12删格是有width百分比构成 然后结合media 768px 992px 1200px的变化 而offset也是改变的当前元素的margin值实现的

    # 2 chrome的测试工具 性能分析器(profiler)

    Timeline检测render js load painting时间    Collect Javascript CPU Profile:用于找出耗时较长的js函数   Take Heap Snapshot 用于分析JS对象及其关联的DOM节点的内存分布   Record Heap Allocations:记录内存分配信息,用于分析内存泄漏的情况

    详情见:http://wwww.jianshu.com/p/504bde348956

    # 3 http协议的理解

    1.支持客户/服务器模式。

    2.简单快速:客户向服务器请求服务时,只需传送请求方法和路径。请求方法常用的有GET、HEAD、POST。每种方法规定了客户与服务器联系的类型不同。由于      HTTP协议简单,使得HTTP服务器的程序规模小,因而通信速度很快。

    3.灵活:HTTP允许传输任意类型的数据对象。正在传输的类型由Content-Type加以标记。

    4.无连接:无连接的含义是限制每次连接只处理一个请求。服务器处理完客户的请求,并收到客户的应答后,即断开连接。采用这种方式可以节省传输时间。

    5.无状态:HTTP协议是无状态协议。无状态是指协议对于事务处理没有记忆能力。缺少状态意味着如果后续处理需要前面的信息,则它必须重传,这样可能导致每次连接传送的数据量增大。另一方面,在服务器不需要先前信息时它的应答就较快。

    包括 url/请求头http请求由三部分组成,分别是:请求行、消息报头、请求正文/

    TTP协议详解之响应篇在接收和解释请求消息后,服务器返回一个HTTP响应消息。HTTP响应也是由三个部分组成,分别是:状态行、消息报头、响应正文

    HTTP消息由客户端到服务器的请求和服务器到客户端的响应组成。请求消息和响应消息都是由开始行(对于请求消息,开始行就是请求行,对于响应消息,开始行就    是状态行),消息报头(可选),空行(只有CRLF的行),消息正文(可选)组成。HTTP消息报头包括普通报头、请求报头、响应报头、实体报头。

    每一个报头域都是由名字+“:”+空格+值 组成,消息报头域的名字是大小写无关的。

    # 4、http缓存工作机制

    http缓存是基于HTTP协议的浏览器文件级缓存机制。即针对文件的重复请求情况下,浏览器可以根据协议头判断从服务器端请求文件还是从本地读取文件,chrome控制台下的Frames即展示的是浏览器的http文件级缓存。以下是浏览器缓存的整个机制流程。主要是针对重复的http请求,在有缓存的情况下判断过程主要分3步:

    判断expires,如果未过期,直接读取http缓存文件,不发http请求,否则进入下一步

    判断是否含有etag,有则带上if-none-match发送请求,未修改返回304,修改返回200,否则进入下一步

    判断是否含有last-modified,有则带上if-modified-since发送请求,无效返回200,有效返回304,否则直接向服务器请求

    # 5 js内存泄漏的情况

    1. 绑定事件后的元素 移除元素后 事件没有移除 会造成内存泄漏2. 循环引用的过程中,js内存垃圾回收机制会进行处理,而ie下不会 会造成内存泄漏3. 闭包内的变量,没有销毁 会造成内存泄漏 一般用完的变量 都是置为null4. 对象里的属性制定一个对象 如果删除这个属性 对象依然存在 会造成内存泄漏  例如 var a={b:{c:1}},x=a.b;delete a.b;x.c依然存在5. 取字符串长度的时候会默认生产new String()不会被回收  需要手动生成  var s='aaa';alert(new String(s).length);

    # 6 js 三种强制类型转换和二种隐式类型转换 强制:parseInt parseFloat Number 隐式:+ -

    # 7 清除浮动的方法以优缺点

    1. 在父亲元素的子元素添加一个div 而后给这个div 添加一个clear:both;    优点:代码少 容易理解,副作用少 缺点 是增加了dom元素,添加标签2. 给父元素添加伪类:after,使用zoom:1兼容ie,而后在伪类中添加clear:both   优点:浏览器支持好,不容易出现怪问题  缺点 代码多,不少初学者不理解原理,要两句代码结合使用,才能让主流浏览器都支持3. 给父元素添加overflow:hidden,使用zoom:1兼容ie,添加width 同时不能定义height,使用overflow:hidden时,浏览器会自动检查浮动区域的高度   优点:代码少 容易理解,副作用少 缺点如果使用position 会把超出部分隐藏掉# 8 302 301 304302重定向(两次请求) 。 304,浏览器缓存的上次请求的.html页面,包括最后修改时间(如果发现最后修改时间和服务器里面的时间一样,那么响应304,无需传输数据,浏览器接收到304,则去自己的缓存中取出数据,节省传输成本)。 301永久转移301 redirect: 301 代表永久性转移(Permanently Moved)。

    8 js函数如何实现重载

    首先要知道重载函数的定义:在相同的声明域中的函数名相同的,而参数表不同的,即通过函数的参数表而唯一标识并且来区分函数的一种特殊的函数。

    而在js中函数的定义只会覆盖掉之前的函数,所以要是实现重载就要对函数的argument这个伪数组进行处理,例如根据传入参数的类型 执行不同的方法。

    function a(){

       console.log(arguments); //执行 a(1,2,3) 输出 [1,2,3,callee:function]

    }

    以下提供 取得我们定义时函数的参数名称的方法

    var =function(a,b,c)

    {returna+b+c;};

    function getParameterNames(fn){           

                   if(typeoffn!=='function')

                  return [];

                var COMMENTS=/((\/\/.*$)|(\/\*[\s\S]*?\*\/))/mg;

               var code=fn.toString().replace(COMMENTS,'');

               var result=code.slice(code.indexOf('(')+1,code.indexOf(')'))

                          .match(/([^\s,]+)/g);

                   return result===null?[]:result;

    }

    console.log(getParameterNames(test));// ['a', 'b', 'c']

    相关文章

      网友评论

          本文标题:前端面试总结

          本文链接:https://www.haomeiwen.com/subject/dwyzzttx.html