WEB前端经典笔试/面试题

1.HTML和XHTML，XML，DHTML有什么区别

    HTML：超文本标记语言，专门编写网页内容的语言。

   XHTML：严格的html标准，元素必须被正确地嵌套，元素必须被关闭，标签名必须用小写字母，文档必须拥有根元素。

    XML：可扩展的标记语言，标签名和属性名可自定义。

    DHTML：动态的html技术，是html+css+js的统称。

2.写出几种IE6 BUG的解决方法

    1)双边距BUG float引起的 使用display。

    2)3像素问题 使用float引起的 使用dislpay:inline -3px.

    3)超链接hover 点击后失效 使用正确的书写顺序 link visited hover active.

    4)Ie z-index问题 给父级添加position:relative.

    5)Png 透明 使用js代码 改.

    6)Min-height 最小高度 ！Important 解决’.

    7)select 在ie6下遮盖 使用iframe嵌套.

    8)为什么没有办法定义1px左右的宽度容器（IE6默认的行高造成的，使用over:hidden,zoom:0.08 line-height:1px）.

3.清除浮动的几种方式，各自的优缺点

    1)使用空标签清除浮动 clear:both（理论上能清楚任何标签,增加无意义的标签）.

    2)使用overflow:auto（空标签元素清除浮动而不得不增加无意代码的弊端,,使用zoom:1用于兼容IE）.

    3)是用afert伪元素清除浮动(用于非IE浏览器).

4.变量定义：内存中存储*一个*数据的存储空间

5.过程中共创建了几个字符串？3个

var str="Hello";

  str=str+"World"

 console.log(str);

6.++n与n++区别

   ++n: 前++, 返回*新*值

   n++:后++, 返回*旧*值

7.undefined  VS   null

undefined：所有变量的默认初始值，自动赋值

null：主动清空一个变量，释放一个对象

8.短路逻辑：逻辑运算中，如果前一个条件已经可以得出最终结论，则后续所有条件不再执行！

var i=10

var j=10

var k=i--<0&&j++>0

console.log(i+","j++","+k);

                      //9  //10   //false

var k=i-->0||j++<0

         console.log(i+","j++","+k);

                              //8   //10   //true

9.

var n=10;

function fun(n){

            console.log(m);

            var m=n;

            n++;  

console.log(m);

}

fun(n); //undefined   10

console.log(n); //10    

console.log(m); //报错

10.do-while VS  while

   只看开始循环前，条件是否满足：

   开始循环前，条件都满足：则两者完全一样

   开始循环前，条件不满足：dowhile至少可执行一次循环体;while一次都无法执行

11.按值传递——原始类型 VS 引用类型

       原始类型的值，赋值后，相互不影响

        引用类型的对象，赋值后，依然引用同一个对象；任何修改，都会影响对方。

12.内置对象：11个

   ES标准已经规定好，由浏览器厂商已经实现的对象

    开发人员直接使用，不必关心具体实现。

        String Number Boolean --包装类型

        Array Date RegExp Math

        Error

        Function Object

        Global-->window

13.new String(xxx) VS String(xxx)

     String(xxx)：隐式类型转换为字符串，返回原始类型的字符串值

     new String(xxx): 创建一个String包装类型的对象，返回String包装类型的对象。

14.n.toFixed(d)  VS  Math.round(n)

         n.toFixed(d): 按指定d位小数四舍五入，*返回字符串*

          Math.round(n): 不能指定小数位数，只能取整;*返回number*

15.Error对象：在错误发生时，*自动创建*的封装错误信息的对象

         属性：err.name：

错误类型：6种

          SyntaxError：语法错误

          ReferenceError：引用错误，找不到对象或变量时。

           TypeError：类型错误，错误的使用了对象的*方法*

          RangeError: 范围错误，参数超范围

          EvalError: Eval错误，错误的使用了eval函数

          URIError: URI错误

17.js中如何解决浏览器兼容性问题：3种

       1. 不兼容的类型或方法：2种：

                if  else

                try catch

       2. 不兼容的值：短路逻辑中的||;值1||值2

18.try catch错误处理中的return：

        1. finally中的return，会替换try catch中的return

        2. 即使finally中没有return，finally中的代码一定会在return前执行，但无法影响已确定的return结果

19.判断闭包：3特点：

     1)内外层函数嵌套

     2)内层函数必须使用了外层函数的局部变量

     3)外层函数将内层函数返回到外部，可在外部调用

20.如何判断一个对象是数组类型：typeof失效

    1). if(Array.prototype.isPrototypeOf(obj)){

                            obj是数组类型

       }

    2). 其实构造函数的prototype指向原型对象

       同时，原型对象有constructor指回构造函数对象

              if(obj.constructor==Array)

    3). 判断子对象是否是指定构造函数的实例：

if(子对象 instanceof 构造函数名)

               instanceof也是查找整个原型链

    4). if(Object.getPrototypeOf(obj)==Array.prototype)

    5). call和apply：

          if(Object.prototype.toString.call(obj)=="[object Array]")

                    执行的一刹那，相当于arr.toString();

     6). ES5中新函数：Array.isArray(obj)      

21.call VS apply:

       相同：在调用方法时，修改当前调用方法的对象

       差别：传入参数的形式：

                            xxx.call(obj,值1,值2,值3....)         

                            xxx.applye(obj,[值1,值2,值3....])

22.面向对象三大特点：

     封装：为什么：1. 单独的属性和方法是没有意义的，只有放在对象上才有意义。

                                2. 便于反复调用——代码重用！便于维护！

     多态：重写和重载

                          重载：为什么：便于调用！

           重写：为什么：为了实现子对象与父对象的差异     

     继承：父对象的属性值和方法，子对象可直接使用

           js中所有的继承都是通过原型(__proto__)实现的

           为什么：代码重用！便于维护！节约内存空间！

23.getXXX  VS   Selector API

      返回值：getXXX 返回动态集合

               Selector API 返回非动态集合

      效率：getXXX 效率高

           Selector API  效率低

24.富客户端 VS  瘦客户端

    * 富(胖)客户端 - 不仅提供数据的静态展示，还可以实现动态的交互

    * 瘦客户端 - 可以实现数据的静态展示

25.ready与onload的区别

   *ready

          * 具有简写形式

          * 等待DOM节点树的内容加载完毕后,就执行(速度快)

          * 一个HTML页面允许编写多个ready

   *onload

          * 没有简写形式

          * 必须等待HTML页面中所有内容都加载完毕后,才执行(速度慢)

          * 一个HTML页面只能编写一个onload

26.C/S架构 VS B/S架构

     C/S架构 - Client/Server(客户端/服务器端) 比如QQ、Office、大型游戏等

      * 优点

                   * 稳定

                   * 对带宽的要求相对低

                   * 体验更好

    * 缺点

                  * 占用用户硬盘空间

                  * 升级非常麻烦

      B/S架构 - Browser/Server(浏览器/服务器端) 比如Web QQ、百度脑图、网页游戏等

      * 优点

                    * 升级简单 - 只管服务器

                    * 不占用用户硬盘空间

     * 缺点

                    * 体验不够好

                    * 兼容问题

27.状态码

    * 1xx - (服务器端返回)信息

    * 2xx - 请求成功

            * 200 - 请求成功

    * 3xx - 请求重定向

            * 302 - 请求重定向配置location使用

           * 304 - (服务器端)资源没有被修改 | 访问本地缓存

           * 305 - 使用代理

    * 4xx - 客户端错误

           * 400 - 请求无效(失败)

           * 403 - 请求被拒绝

           * 404 - 网页未找到

           * 405 - 请求方式不被允许

           * 408 - 请求超时

    * 5xx - 服务器端错误

          * 500 - 服务器端内部错误

          * 502 - 路径无效(失败)

          * 504 - 路径超时

          * 505 - HTTP版本不支持

28.请求协议GET与POST的区别

1)请求行不同

* 请求地址

         * GET - URL?params

         * POST - URL

       * 请求类型

         * GET

         * POST

2)请求体不同

  *GET - 为空

       *POST - 请求数据

3)请求数据的区别

* GET - 添加在URL后

       * 安全性相对较低

       * 大小有限制

       * 中文乱码问题

     * POST - 请求体中

       * 安全性相对较高

       * 大小无限制

      * 中文乱码问题

29.DOM对象与jQuery对象相互转换

  DOM对象转换为jQuery对象

      $(DOM对象)

  jQuery对象转换为DOM对象

      jQuery对象是类数组对象 - jQuery对象[索引值]

      jQuery提供get(index)方法

30.请求方式(类型)

     * 种类 - 至少具有7种

      * GET

      * POST

      * PUT

      * DELETE

      * HEAD

      * OPTIONS

      * TRACE

    * 标准式API

      * 新增 - PUT请求方式

      * 修改 - POST请求方式

      * 删除 - DELETE请求方式

      * 查询 - GET请求方式