1. 了解闭包

        函数嵌套函数 ，函数内部可以引用外部的参数和变量 ，参数和变量不会被垃圾回收机制回收。既然不会被回收所以会一直存在内存中，增大内存使用量，容易造成内存泄露。

2. 浏览器本地存储有哪些？

        js 提供了 sessionStorage 和 globalStorage 。在 HTML5 中提供了 localStorage 来取代 globalStorage 。html5 中的 Web Storage 包括了两种存储方式： sessionStorage 和 localStorage 。

        sessionStorage 用于本地存储一个会话（session）中的数据，这些数据只有在同一个会话中的页面才能访问并且当会话结束后数据也随之销毁。因此 sessionStorage 不是一种持久化的本地存储，仅仅是会话级别的存储。

         localStorage 用于持久化的本地存储，除非主动删除数据，否则数据是永远不会过期的。

3. cookie和session的区别？

       （1）cookie数据存放在客户的浏览器上，session数据放在服务器上。

       （2）cookie不是很安全，别人可以分析存放在本地的COOKIE并进行COOKIE欺骗考虑到安全应当使用session。

       （3）session会在一定时间内保存在服务器上。当访问增多，会比较占用你服务器的性能考虑到减轻服务器性能方面，        应当使用COOKIE。

       （4）单个cookie保存的数据不能超过4K，很多浏览器都限制一个站点最多保存20个cookie。

个人建议：

          将登陆信息等重要信息存放为SESSION

          其他信息如果需要保留，可以放在COOKIE中，即使被盗也不会存在太大的安全问题。

4. display:none和visibility:hidden的区别？

         display:none  隐藏对应的元素，在文档布局中不再给它分配空间，它各边的元素会合拢，就当从来不存在。

         visibility:hidden  隐藏对应的元素，但是在文档布局中仍保留原来的空间。

5. CSS中 link 和@import 的区别是？

          (1) link属于HTML标签，而@import是CSS提供的;

          (2) 页面被加载的时，link会同时被加载，而@import引用的CSS会等到页面被加载完再加载;

          (3) import只在IE5以上才能识别，而link是HTML标签，无兼容问题; 

          (4) link方式的样式权重高于@import的权重.

6.  position:absolute和float属性的异同

共同点：

            对内联元素设置`float`和`absolute`属性，可以让元素脱离文档流，并且可以设置其宽高。

不同点：

            float仍会占据位置，position会覆盖文档流中的其他元素。

7.  css选择器有哪些？

            id选择器（ # myid），  类选择器（.myclassname）， 标签选择器（div, h1, p）， 相邻选择器（h1 + p），子选择器（ul > li）， 后代选择器（li a），  通配符选择器（ * ）， 属性选择器（a[rel = "external"]），伪类选择器（a: hover, li:nth-child）

8. XML和JSON的区别？

           数据体积方面：JSON相对于XML来讲，数据的体积小，传递的速度更快些。数据交互方面：JSON与JavaScript的交互更加方便，更容易解析处理，更好的数据交互。数据描述方面：JSON对数据的描述性比XML较差。传输速度方面：JSON的速度要远远快于XML。

9. HTML与XHTML有什么区别？

           所有的标记都必须要有一个相应的结束标记、所有标签的元素和属性的名字都必须使用小写、所有的XML标记都必须合理嵌套、所有的属性必须用引号""括起来、把所有<和&特殊符号用编码表示、给所有属性赋一个值、不要在注释内容中使“--”、图片必须有说明文字

10.  解释下浮动和它的工作原理？清除浮动的技巧

           浮动元素脱离文档流，不占据空间。浮动元素碰到包含它的边框或者浮动元素的边框停留。

1.使用空标签清除浮动。这种方法是在所有浮动标签后面添加一个空标签 定义css clear:both. 弊端就是增加了无意义标签。

2.使用overflow。给包含浮动元素的父标签添加css属性 overflow:auto; zoom:1; zoom:1用于兼容IE6。

3.使用after伪对象清除浮动。该方法只适用于非IE浏览器。具体写法可参照以下示例。使用中需注意以下几点。一、该方法中必须为需要清除浮动元素的伪对象中设置 height:0，否则该元素会比实际高出若干像素；

11.   浮动元素引起的问题和解决办法？

浮动元素引起的问题：

（1）父元素的高度无法被撑开，影响与父元素同级的元素

（2）与浮动元素同级的非浮动元素（内联元素）会跟随其后

（3）若非第一个元素浮动，则该元素之前的元素也需要浮动，否则会影响页面显示的结构

解决方法： 使用 CSS 中的 clear:both ;属性来清除元素的浮动可解决2、3问题，对于问题1，添加如下样式，给父元素添加 clearfix 样式：

.clearfix:after{content: ".";display: block;height: 0;clear: both;visibility: hidden;}

.clearfix{display: inline-block;} /* for IE/Mac */

12.  清除浮动的几种方法：

        1 额外标签法（缺点：不过这个办法会增加额外的标签使HTML结构看起来不够简洁。）

        2 使用after伪类

      #parent:after{

             content:".";

             height:0;

             visibility:hidden;

             display:block;

             clear:both;

       }

        3 浮动外部元素

        4 设置`overflow`为`hidden`或者auto

13.  DOM操作——怎样添加、移除、移动、复制、创建和查找节点？

     （1）创建新节点

                createDocumentFragment()    //创建一个DOM片段

                createElement()  //创建一个具体的元素

                createTextNode()  //创建一个文本节点

    （2）添加、移除、替换、插入

                appendChild()

                removeChild()

                replaceChild()

                 insertBefore() //在已有的子节点前插入一个新的子节点

    （3）查找

                 getElementsByTagName()    //通过标签名称

                 getElementsByName()    //通过元素的Name属性的值(IE容错能力较强，会得到一个数组，其中包括id等于name值的)

                 getElementById()    //通过元素Id，唯一性

14. html5有哪些新特性、移除了哪些元素？如何处理HTML5新标签的浏览器兼容问题？如何区分 HTML 和 HTML5？

        （1） HTML5 现在已经不是 SGML 的子集，主要是关于图像，位置，存储，多任务等功能的增加。

        （2） 拖拽释放(Drag and drop) API

                      语义化更好的内容标签（header,nav,footer,aside,article,section）

                      音频、视频API(audio,video)

                      画布(Canvas) API

                      地理(Geolocation) API

                      本地离线存储 localStorage 长期存储数据，浏览器关闭后数据不丢失；

                      sessionStorage 的数据在浏览器关闭后自动删除

                      表单控件，calendar、date、time、email、url、search

                      新的技术webworker, websocket, Geolocation

       （3）移除的元素

                      纯表现的元素：basefont，big，center，font, s，strike，tt，u；

                      对可用性产生负面影响的元素：frame，frameset，noframes；

                     支持HTML5新标签：

         (4)  IE8/IE7/IE6支持通过document.createElement方法产生的标签，可以利用这一特性让这些浏览器支持HTML5新标签，浏览器支持新标签后，还需要添加标签默认的样式：

         (5)  当然最好的方式是直接使用成熟的框架、使用最多的是html5shim框架

15. iframe的优缺点？

           1. 解决加载缓慢的第三方内容如图标和广告等的加载问题,Security sandbox并行加载脚本

           2.iframe会阻塞主页面的Onload事件,即时内容为空，加载也需要时间,没有语意

16. 你如何对网站的文件和资源进行优化？

           文件合并,文件最小化/文件压缩,使用 CDN 托管,缓存的使用（多个域名来提供缓存）

17. 请说出三种减少页面加载时间的方法。

           (1) .优化图片

           (2).图像格式的选择（GIF：提供的颜色较少，可用在一些对颜色要求不高的地方）

           (3).优化CSS（压缩合并css，如margin-top,margin-left...)

           (4).网址后加斜杠（如www.campr.com/目录，会判断这个“目录是什么文件类型，或者是目录。）

           (5).标明高度和宽度（如果浏览器没有找到这两个参数，它需要一边下载图片一边计算大小，如果图片很多，浏览器需要不断地调整页面。这不但影响速度，也影响浏览体验。当浏览器知道了高度和宽度参数后，即使图片暂时无法显示，页面上也会腾出图片的空位，然后继续加载后面的内容。从而加载时间快了，浏览体验也更好了。）

           (6).减少http请求（合并文件，合并图片）.

18. null和undefined的区别？

            null 是一个表示"无"的对象，转为数值时为0； undefined 是一个表示"无"的原始值，转为数值时为 NaN 。当声明的变量还未被初始化时，变量的默认值为 undefined 。 null 用来表示尚未存在的对象，常用来表示函数企图返回一个不存在的对象。

            undefined 表示"缺少值"，就是此处应该有一个值，但是还没有定义。典型用法是：

                 （1）变量被声明了，但没有赋值时，就等于undefined。

                 （2) 调用函数时，应该提供的参数没有提供，该参数等于undefined。

                 （3）对象没有赋值的属性，该属性的值为undefined。

                 （4）函数没有返回值时，默认返回undefined。

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

                  （1） 作为函数的参数，表示该函数的参数不是对象。

                  （2） 作为对象原型链的终点。

19. js延迟加载的方式有哪些？

           defer和async、动态创建DOM方式（创建script，插入到DOM中，加载完毕后callBack）、按需异步载入js

20. 你有哪些性能优化的方法？

       （1）减少http请求次数：CSS Sprites, JS、CSS源码压缩、图片大小控制合适；网页Gzip，CDN托管，data缓存 ，图片服务器。

       （2） 前端模板 JS+数据，减少由于HTML标签导致的带宽浪费，前端用变量保存AJAX请求结果，每次操作本地变量，不用请求，减少请求次数

       （3） 用innerHTML代替DOM操作，减少DOM操作次数，优化javascript性能。

       （4） 当需要设置的样式很多时设置className而不是直接操作style。

       （5） 少用全局变量、缓存DOM节点查找的结果。减少IO读取操作。

       （6） 避免使用CSS Expression（css表达式)又称Dynamic properties(动态属性)。

       （7） 图片预加载，将样式表放在顶部，将脚本放在底部  加上时间戳。

21. 异步加载和延迟加载的理解

       （1）异步加载的方案： 动态插入script标签

      （2）通过ajax去获取js代码，然后通过eval执行

      （3）script标签上添加defer或者async属性

      （4）创建并插入iframe，让它异步执行js

      （5）延迟加载：有些 js 代码并不是页面初始化的时候就立刻需要的，而稍后的某些情况才需要的。

22. sql注入原理

       就是通过把 SQL 命令插入到 Web 表单递交或输入域名或页面请求的查询字符串，最终达到欺骗服务器执行恶意的SQL命令。

总的来说有以下几点：

         1.永远不要信任用户的输入，要对用户的输入进行校验，可以通过正则表达式，或限制长度，对单引号和双"-"进行转换等。

         2.永远不要使用动态拼装SQL，可以使用参数化的SQL或者直接使用存储过程进行数据查询存取。

         3.永远不要使用管理员权限的数据库连接，为每个应用使用单独的权限有限的数据库连接。

         4.不要把机密信息明文存放，请加密或者hash掉密码和敏感的信息。

23. GET和POST的区别，何时使用POST？

         GET：一般用于信息获取，使用URL传递参数，对所发送信息的数量也有限制，一般在2000个字符

         POST：一般用于修改服务器上的资源，对所发送的信息没有限制。

        GET方式需要使用Request.QueryString来取得变量的值，而POST方式通过Request.Form来获取变量的值，

也就是说Get是通过地址栏来传值，而Post是通过提交表单来传值。

然而，在以下情况中，请使用 POST 请求：

         无法使用缓存文件（更新服务器上的文件或数据库）

        向服务器发送大量数据（POST 没有数据量限制）

       发送包含未知字符的用户输入时，POST 比 GET 更稳定也更可靠

24. eval的作用？

       把对应的字符串解析成JS代码并运行；应该避免使用eval，不安全，非常耗性能（2次，一次解析成js语句，一次执行）。

25. ajax 是什么?ajax 的交互模型?同步和异步的区别?如何解决跨域问题?

      （1） 通过异步模式，提升了用户体验

        (2)  优化了浏览器和服务器之间的传输，减少不必要的数据往返，减少了带宽占用

        (3) Ajax在客户端运行，承担了一部分本来由服务器承担的工作，减少了大用户量下的服务器负载。

26. ajax的最大的特点是什么?

         Ajax可以实现动态不刷新（局部刷新）,readyState属性 状态 有5个可取值： 0=未初始化 ，1=启动 2=发送，3=接收，4=完成

27. ajax的缺点?

        (1) ajax不支持浏览器back按钮。

        (2) 安全问题 AJAX暴露了与服务器交互的细节。

        (3) 对搜索引擎的支持比较弱。 

        (4) 破坏了程序的异常机制。

        (5) 不容易调试。

跨域： jsonp、 iframe、window.name、window.postMessage、服务器上设置代理页面

28. 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 服务器端暂时无法处理请求（可能是过载或维护）。

29 栈和队列的区别?

          栈的插入和删除操作都是在一端进行的，而队列的操作却是在两端进行的。队列先进先出，栈先进后出。

          栈只允许在表尾一端进行插入和删除，而队列只允许在表尾一端进行插入，在表头一端进行删除

30. 栈和堆的区别？

          栈区（stack）—  由编译器自动分配释放  ，存放函数的参数值，局部变量的值等。

         堆区（heap）  —  一般由程序员分配释放，  若程序员不释放，程序结束时可能由OS回收。

         堆（数据结构）：堆可以被看成是一棵树，如：堆排序；

         栈（数据结构）：一种先进后出的数据结构。