前端interview整合script全部代码、setTimeout、setInterval、setImmediate（

进程/线程

宏任务/微任务

**宏任务（MacroTask）**
    script全部代码、setTimeout、setInterval、setImmediate（浏览器暂时不支持，只有IE10支持，具体可见MDN）、I/O、UI Rendering。

**微任务（MicroTask）**
    Process.nextTick（Node独有）、Promise、Object.observe(废弃)、MutationObserver

3. ## promise 原理手写一个promise

懒加载原理
node 的 eventEmitter 原理&实现
动画性能优化
兼容性问题

跨域

/*CORS使用自定义的HTTP头部允许浏览器和服务器相互了解对方*/
Access-Control-Allow-Origin:指定授权访问的域
Access-Control-Allow-Methods：授权请求的方法（GET, POST, PUT, DELETE，OPTIONS等)

css浮动

 清除浮动的常用方式：
 1.结尾处加空div标签 clear:both （或在下一个元素上加clear:both;）
 2.父级div定义 伪元素:after
 3.父级div定义 overflow:hidden

水平居中，垂直居中 三栏布局

/*垂直居中*/
.parent::after{
    content:'';
    height:100%
}
.parent::after .son{
    display: inline-block;
    vertical-align: middle;
}

.parent2{
    position: relative
}
.son2{
    position: absolute;
    height:10px;
    /*方案一 有滚动条*/
    top:50%;
    margin-top:-0.5*10px;
    /*方案二 截断 无滚动条*/
    margin:auto 0;
    bottom:0;
    top:0
}

/*transform*/
.parent3{
    position:relative;
}
.son3{
    position:absolute;
    top:50%;
    transform:translate(-50%,-50%)
}

重排reflow)和重绘(repaint)

DOM Tree的构建过程
- 转码: 浏览器将接收到的二进制数据按照指定编码格式转化为HTML字符串
- 生成Tokens: 之后开始parser，浏览器会将HTML字符串解析成Tokens
- 构建Nodes: 对Node添加特定的属性，通过指针确定 Node 的父、子、兄弟关系和所属 treeScope
- 生成DOM Tree: 通过node包含的指针确定的关系构建出DOM Tree
重排: 部分渲染树（或者整个渲染树）需要重新分析并且节点尺寸需要重新计算，表现为重新生成布局，重新排列元素

重绘: 由于节点的几何属性发生改变或者由于样式发生改变，例如改变元素背景色时，屏幕上的部分内容需要更新，表现为某些元素的外观被改变

触发重排和重绘
- 添加、删除、更新DOM节点
- 通过display: none隐藏一个DOM节点-触发重排和重绘
- 通过visibility: hidden隐藏一个DOM节点-只触发重绘，因为没有几何变化
- 移动或者给页面中的DOM节点添加动画
- 添加一个样式表，调整样式属性
- 用户行为，例如调整窗口大小，改变字号，或者滚动
避免重排/重绘
- 集中改变样式
- 使用DocumentFragment
- 提升为合成层：
```
1.位图交予GPU处理，比CPU快；
2.当需要 repaint 时，只需要 repaint 本身，不会影响到其他的层；
3.对于 transform 和 opacity 效果，不会触发 layout 和 paint
/*提升为合成层*/
#target {
    will-change: transform;
}
```

cookie 和 session

Cookie是服务器发送到用户浏览器并保存在本地的一小块数据
它会在浏览器下次向同一服务器再发起请求时被携带并发送到服务器上。
Session 代表着服务器和客户端一次会话的过程。
Session 对象存储特定用户会话所需的属性及配置信息
cookie在浏览器和服务器间来回传递，另外两个只存在本地
cookie不能超过4k，另两个5M； 
cookie有效期是设置时间，sessionStorage是浏览器关闭时，localStorage是始终有效;
localStorage 和 cookie 在同源窗口共享，sessionStorage数据不共享

css3

css重置样式：不建议使用通配符重置，主要是性能问题。如果用通配符重置样式，那么势必会花费很大时间。网站打开速度变慢。所以reset时，按需而行。用到哪些标签就设置重置。常用的重置样式：
- textarea标签中，默认的方式为：both；就是说：在textarea的右下角有一个三角，用户可以拖动，以改变textarea的大小。一般情况下我们将textarea的样式设置为：none；
```
textarea { resize:none; } /*防止拖动*/
```
- 浏览器默认图片都有3px的空白，以保证我们对齐样式：
```
img {border:0;vertical-align:middle; } /* 去掉图片底部默认的3像素空白缝隙*/
```
- 清除浮动的基本写法:
```
.clearfix:before,.clearfix:after{
	content:"";
	display:table;
}
.clearfix:after{clear:both;}
.clearfix{
	*zoom:1;/*兼容IE7/6*/
}
```
script标签中的 defer 和 aysnc

阮一峰老师的 es6
es6 完全使用手册
JS 面向对象

进程与线程

一个进程可以包括多个线程。
一个进程的内存空间是共享的，每个线程都可以使用这些共享内存。
一个线程使用某些共享内存时，其他线程必须等它结束，才能使用这一块内存。
"互斥锁"（Mutual exclusion，缩写 Mutex）：防止多个线程同时读写某一块内存区域
"信号量"（Semaphore）：用来保证多个线程不会互相冲突

操作系统的设计，因此可以归结为三点：

以多进程形式，允许多个任务同时运行；
以多线程形式，允许单个任务分成不同的部分运行；
提供协调机制，一方面防止进程之间和线程之间产生冲突，另一方面允许进程之间和线程之间共享资源。

github整理

非master分支是作者参加阿里和字节跳动遇到的一面问题

觉得有帮助的就点个star吧

前端interview整合

http协议 / http请求

webpack 打包优化

Event Loop

进程/线程

宏任务/微任务

懒加载原理

node 的 eventEmitter 原理&实现

动画性能优化

兼容性问题

跨域

css浮动

水平居中，垂直居中 三栏布局

重排reflow)和重绘(repaint)

cookie 和 session

css3

script标签中的 defer 和 aysnc

阮一峰老师的 es6

es6 完全使用手册

JS 面向对象

进程与线程

github整理