| 求职

百度前端实习面经

js typeof

1
2
var a = null;
 console.log(typeof null);

事件冒泡和事件捕获，不同浏览器的触发顺序

  • 捕获阶段
    事件的第一个阶段是捕获阶段。事件从文档的根节点流向目标对象节点。途中经过各个层次的DOM节点，并在各节点上触发捕获事件，直到到达事件的目标节点。捕获阶段的主要任务是建立传播路径，在冒泡阶段，事件会通过这个路径回溯到文档跟节点。
  • 目标阶段
    当事件到达目标节点的，事件就进入了目标阶段。事件在目标节点上被触发，然后会逆向回流，直到传播至最外层的文档节点。
  • 冒泡阶段
    事件在目标元素上触发后，并不在这个元素上终止。它会随着DOM树一层层向上冒泡，回溯到根节点。

    触发顺序

    非目标元素捕获 -> 目标元素代码顺序 -> 非目标元素冒泡。

阻止冒泡，不同浏览器怎么处理

e.stopPropagatin
window.event.cancelBuddle

绑定click事件，解绑

  • 绑定
    addEventListener attachEvent
  • 解绑
    removeEventListener deattachEvent
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    var EventUtil={
        /*检测绑定事件*/
        addHandler:function(element,type,handler){
            if(element.addEventListener){
                element.addEventListener(type,handler,false);
            }
            else if(element.attachEvent){
                element.attachEvent('on'+type,handler);
            }
            else{
                element["on"+type]=handler /*直接赋给事件*/
            }
        },
        /*通过removeHandler*/
        removeHandler:function(element,type,handler) {   /*Chrome*/
            if (element.removeEventListener)
                element.removeEventListener(type, handler, false);
            else if (element.deattachEvent) {               /*IE*/
                element.deattachEvent('on' + type, handler);
            }
            else {
                element["on" + type] = null;
                /*直接赋给事件*/
            }
        }
    };

什么是闭包

1
2
3
4
5
6
7
8
9
10
11
var a = 1;
 function foo(){
     var a = 2;
     function bar(){
         var a = 3;
         return a;
     }
     bar();
 }
 foo();
console.log(a);

ajax,异步与同步区别,ajax怎么实现同步

  • 区别
    ajax同步是指当JS代码加载到当前AJAX的时候会把页面里所有的代码停止加载，页面出现假死状态，当这个AJAX执行完毕后才会继续运行其他代码，页面鸡丝状态接触。
    ajax异步是指这个AJAX代码运行中的时候其他代码一样同时运行
  • 实现同步
    JQuery中ajax方法里有个async属性控制ajax的同步与异步。
    默认async为true,异步请求；
    async为false，则同步请求

js eval()用法

eval只接受一个参数，字符串，把它当做js语句来解析，然后把执行结果插入到原位置。通过eval()执行的代码被认为是包含该次调用的执行环境的一部分，因此被执行的代码具有与改执行环境相同的作用域链。

1
2
var msg = "hello world";
eval("alert(msg)"); //hello world

简单说下csrf

CSRF（Cross-site request forgery）跨站请求伪造，
CSRF通过伪装来自受信任用户的请求来利用受信任的网站

DOCTYPE有哪几种类型

  • HTML5
    <DOCTYPE html>

  • HTML 4.01 Strict
    该 DTD 包含所有 HTML 元素和属性，但不包括展示性的和弃用的元素（比如 font）。不允许框架集（Framesets）。

    1
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">

  • HTML 4.01 Transitional
    该 DTD 包含所有 HTML 元素和属性，包括展示性的和弃用的元素（比如 font）。不允许框架集（Framesets）。

    1
    2
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" 
    "http://www.w3.org/TR/html4/loose.dtd">

  • HTML 4.01 Frameset
    该 DTD 等同于 HTML 4.01 Transitional，但允许框架集内容。

    1
    2
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" 
    "http://www.w3.org/TR/html4/frameset.dtd">

  • XHTML 1.0 Strict
    该 DTD 包含所有 HTML 元素和属性，但不包括展示性的和弃用的元素（比如 font）。不允许框架集（Framesets）。必须以格式正确的 XML 来编写标记。

    1
    2
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" 
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

  • XHTML 1.0 Transitional

    1
    该 DTD 包含所有 HTML 元素和属性，包括展示性的和弃用的元素（比如 font）。不允许框架集（Framesets）。必须以格式正确的 XML 来编写标记。

  • XHTML 1.0 Frameset
    该 DTD 等同于 XHTML 1.0 Transitional，但允许框架集内容。

    1
    2
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN" 
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">

  • XHTML 1.1
    该 DTD 等同于 XHTML 1.0 Strict，但允许添加模型（例如提供对东亚语系的 ruby 支持）。

    1
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">

浏览器有哪几种模式，特点

  • 标准（严格）模式
    CSS1Compat
  • 怪异（混杂）模式
    BackCompat
    如何检测模式： document.compatMode
    特点

CSS哪些属性可以继承，哪些不可以继承

可继承的样式：

  1. font-size
  2. font-family
  3. color
  4. text-indent

不可继承的样式：

  1. border
  2. padding
  3. margin
  4. width
  5. height

CSS选择器

  1. id选择器(# myid)
  2. 类选择器(.myclassname)
  3. 标签选择器(div, h1, p)
  4. 相邻选择器(h1 + p)
  5. 子选择器(ul > li)
  6. 后代选择器(li a)
  7. 通配符选择器( * )
  8. 属性选择器(a[rel = “external”])
  9. 伪类选择器(a: hover, li:nth-child)

CSS优先级

  1. 优先级就近原则，同权重情况下样式定义最近者为准;
  2. 载入样式以最后载入的定位为准;
  3. !important> id > class > tag
  4. important 比 内联优先级高，但内联比 id 要高

CSS选择器权重

CSS盒子模型

position属性

display属性

line-height属性

用什么IDE，说说特点

git命令

  • 文件被谁修改
  • 比较

优雅降级，渐进增强

  • 渐进增强（Progressive Enhancement）：一开始就针对低版本浏览器进行构建页面，完成基本的功能，然后再针对高级浏览器进行效果、交互、追加功能达到更好的体验。

  • 优雅降级（Graceful Degradation）：一开始就构建站点的完整功能，然后针对浏览器测试和修复。比如一开始使用 CSS3 的特性构建了一个应用，然后逐步针对各大浏览器进行 hack 使其可以在低版本浏览器上正常浏览。

按值传递，引用传递

js是按值传递还是引用传递

JS中基本类型是按值传递的，对象类型是按共享传递的。
详解

查找算法，简单说下二分查找

简单说下快速排序算法

说几个linux命令

简单解释下vue数据双向绑定