creeperyang/前端面试题.md

## 前端面试题.md

      
    Raw
  

              前端面试题.md
            
          
    CSS


font-size 最小 12px 的问题。
Chrome 对于简体中文版最小字号限制为12px，通过 transform:scale(0.875); 来hack。-webkit-text-size-adjust 已经无效了。


:nth-child()与:nth-of-type()的区别是什么？
http://www.zhangxinxu.com/wordpress/2011/06/css3%E9%80%89%E6%8B%A9%E5%99%A8nth-child%E5%92%8Cnth-of-type%E4%B9%8B%E9%97%B4%E7%9A%84%E5%B7%AE%E5%BC%82/

p:nth-child(2): 第2个child，且该child是p；
p:nth-of-type(2): children里第2个p；


flexbox，弹性盒模型。剩余空间分配。


盒模型，标准盒模型与IE盒模型的区别是什么？


reflow & repaint
在开发者工具的timeline里，我们可以看到一个典型的渲染过程基本如下：
Recalculate Style: 计算（应用到元素上的）样式。
Layout： 为（渲染树上）每个元素生成几何形状（大小和位置）。
Paint：为每个元素填充像素到layer。
Composite Layers : 把所有layer绘制，输出到屏幕。
渲染主要三阶段：Layout(reflow/relayout)计算范围，Paint(repaint)计算展现，Composite合成Bitmap。
以下行为会造成reflow或者repaint：
当对元素进行增删改操作时；
当元素的位置变化时；
新增stylesheet，修改样式表时；
window resize或者滚动的时候；
修改网页字体时；
通过display:none隐藏展示元素时会造成reflow和repaint，通过visibility:hidden；只会repaint，因为位置没变化；
影响 layout 的属性：宽高| 边距| 位置| 表现| 边框| 定位| 字体
影响 repaint 的属性：背景| 边框| 其他
优化建议：

不要一条一条地修改 DOM 的样式。与其这样，还不如预先定义好 css 的 class，然后修改 DOM 的 className，还有 cssText
把 DOM 离线后修改；
不要把 DOM 节点的属性值放在一个循环里当成循环里的变量。不然这会导致大量地读写这个结点的属性；
尽可能修改靠近叶子的节点。当然，改变层级比较底的 DOM节点有可能会造成大面积的 reflow，但是也可能影响范围很小；
为动画的 HTML 元件使用 fixed 或 absoult 的 position，那么修改他们的 CSS 是会大大减小 reflow；
千万不要使用 table 布局。因为可能很小的一个小改动会造成整个 table 的重新布局。


JS


JS 基础类型
6大基础类型：null, undefined, string, number, boolean, symbol
说说undefined和null的差异
symbol 是 ES6 引入的，你了解吗？
那我问下，Symbol.for(key) 和 Symbol(key) 有什么区别？
Symbol(key)不会创建全局symbol。

The Symbol.for(key) method searches for existing symbols in a runtime-wide symbol registry with the given key and returns it if found. Otherwise a new symbol gets created in the global symbol registry with this key.


同一个变量用var关键词申明两次会报错么？变量提升了解吗，可以讲一讲 creeperyang/blog#16。
在JavaScript中，一个变量名进入作用域的方式有 4 种：

Language-defined：所有的作用域默认都会给出 this 和 arguments 两个变量名（global没有arguments）;
Formal parameters（形参）：函数有形参，形参会添加到函数的作用域中;
Function declarations（函数声明）：如 function foo() {};
Variable declarations（变量声明）：如 var foo，包括_函数表达式_。
函数声明和变量声明总是会被移动（即hoist）到它们所在的作用域的顶部（这对你是透明的）。

而变量的解析顺序（优先级），与变量进入作用域的4种方式的顺序一致。


原型链，proto，ES6 class


jQuery(selector) 返回的是什么？jQuery 的插件原理是什么？
jQuery.prototype.xxx jQuery.xxx


Promise, 异步，microtasks，event loop。
了解promise吗？解决了什么问题？
(function test() {
    setTimeout(function() {console.log(4)}, 0);
    new Promise(function executor(resolve) {
        console.log(1);
        for( var i=0 ; i<10000 ; i++ ) {
            i == 9999 && resolve();
        }
        console.log(2);
    }).then(function() {
        console.log(5);
    });
    console.log(3);
})()
为什么输出结果是1,2,3,5,4而非1,2,3,4,5？


GET/POST 区别是什么？


HTTP 状态码，缓存控制。
403 Forbidden vs 401 Unauthorized
304 Not modified


cookie，session，localStorage，sessionStorage 的联系和区别？


跨域有哪些方法？jsonp的原理是？cors 请求为什么一般会请求两次（option）


列举一个会使js内存溢出的场景。如何解决？


前端优化的常用措施？在HTTP2里怎么优化？


其它


主干和分支有什么区别？怎么使用git workflow来保证多人合作的顺畅？


知道 virtual DOM 吗？为什么引入 virtual DOM？React 怎么保证 virtual DOM 算法的时间复杂度是 0(n)？


webpack 日常使用，优化？