一、运营商劫持
运营商是指那些提供宽带服务的 ISP，包括三大运营商中国电信、中国移动和中国联通，还有一些小运营商。运营商都是提供最基础的网络服务，网络运营商为了卖广告或者其他经济利益，有时候会直接劫持用户的访问，目前，运营商比较常见的劫持方式有两种，分别是 DNS 劫持，HTTP 劫持。
Object.defineProperty的兼容性问题和解决方案
1. 语法
Object.defineProperty(obj, prop, descriptor)
- obj：要在其上定义属性的对象。
- prop：要定义或修改的属性的名称。
- descriptor：将被定义或修改的属性描述符。
- 返回值：被传递给函数的对象。
2. 属性描述符
- 创建属性
如果对象中不存在指定的属性，Object.defineProperty() 就创建这个属性。当描述符中省略某些字段时，这些字段将使用它们的默认值——拥有布尔值的字段的默认值都是false；value，get 和 set 字段的默认值为 undefined。一个没有get/set/value/writable定义的属性被称为“通用的”，并被“键入”为一个数据描述符。
再谈跨域那些事儿
当一个资源从与该资源本身所在的服务器不同的域或端口请求一个资源时，资源会发起一个跨域 HTTP 请求。出于安全原因，浏览器限制从脚本内发起的跨域 HTTP 请求。
跨域不一定是浏览器限制了发起跨站请求，也可能是跨站请求可以正常发起，但是返回结果被浏览器拦截了。最好的例子是 CSRF 跨站攻击原理，请求是发送到了后端服务器无论是否跨域！注意：有些浏览器不允许从 HTTPS 的域跨域访问 HTTP，比如 Chrome 和 Firefox，这些浏览器在请求还未发出的时候就会拦截请求，这是一个特例。
跨域解决方案（我了解并且使用过的）：
- jsonp
- CORS
- Node 中间件代理
- WebSocket 协议跨域
JS操作符运算时的类型转换总结
ECMAScript 操作符的与众不同之处在于，它们能够适用于很多值，例如字符串、数字值、布尔值，甚至对象。不过，在应用于对象时，相应的操作符通常都会调用对象的 valueOf() 和（或）toString() 方法，以便取得可以操作的值。
valueOf() 方法
JavaScript调用valueOf方法将对象转换为原始值。你很少需要自己调用valueOf方法；当遇到要预期的原始值的对象时，JavaScript会自动调用它。默认情况下，valueOf方法由Object后面的每个对象继承。 每个内置的核心对象都会覆盖此方法以返回适当的值。如果对象没有原始值，则valueOf将返回对象本身。
JavaScript的许多内置对象都重写了该函数，以实现更适合自身的功能需要。因此，不同类型对象的valueOf()方法的返回值和返回值类型均可能不同。
JS数据类型及检测方法总结
JS 中有 7 种内置数据类型：
- Undefined（未定义）
- Null（空值）
- Number（数字）
- String（字符串）
- Boolean（布尔值）
- Symbol（符号） [ ES6 新增，详情见 ES6 入门 ]
- Object（对象）
上述 7 种类型，除了 Object 外都是基本数据类型。
浅谈Promise
简单介绍一下 Promise，感兴趣者可去查看相关规范
Promise 本质是个状态机。Promise 有三种状态：pending、fulfilled 和 rejected，而每个 Promise 只能有这三种的其中一种状态。状态是可转换的：pending -> fulfilled 或者 pending -> rejected，但是明确！！！状态转换是不可逆的，只能有这两种转换。
then 方法可以被同一个 Promise 调用多次，且必须返回一个 Promise。
为了保证 then 方法中的回调顺序执行，onFulfilled 或者 onRejected 必须异步调用。
当 Promise 执行成功时，调用 then 方法的第一个回调函数，失败时调用 then 方法的第二个回调函数。
首先，接下来的每一步实现，都是在借鉴了很多博主对 Promise 源码的理解和剖析以及 Promise 本身的规范之上做出的自己的总结，等一个简单的雏形完成，你都会有一定的理解
- 第一版：
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15function Promise(fn) {
this.state = 'pending'; // Promise 当前的状态
this.data = undefined; // Promise 当前的返回值
this.callbacks = []; // 回调队列
fn(this.resolve, this.reject);
}
Promise.prototype = {
constructor: Promise,
resolve: function(result) {},
reject: function(error) {},
}
Flex布局笔记
基本概念
采用 Flex 布局的元素，称为 Flex 容器（flex container），简称”容器”。它的所有子元素自动成为容器成员，称为 Flex 项目（flex item），简称”项目”。
容器默认存在两根轴：水平的主轴（main axis）和垂直的交叉轴（cross axis）。主轴的开始位置（与边框的交叉点）叫做main start，结束位置叫做main end；交叉轴的开始位置叫做cross start，结束位置叫做cross end。项目默认沿主轴排列。
关于容器属性
flex-direction：决定主轴方向（即项目排列方向）
- row（默认值）：主轴为水平方向，起点在左端
- row-reverse：主轴为水平方向，起点在右端
- column：主轴为垂直方向，起点在上沿
- column-reverse：主轴为垂直方向，起点在下沿
flex-wrap：如果一条轴线排不下，决定如何换行
- nowrap（默认）：不换行
- wrap：换行，第一行在上方
- wrap-reverse：换行，第一行在下方
flex-flow：flex-direction 属性和 flex-wrap 属性的简写形式，默认值为 row nowrap
justify-content：定义项目在主轴上的对齐方式
- flex-start（默认值）：左对齐
- flex-end：右对齐
- center： 居中
- space-between：两端对齐，项目之间的间隔都相等
- space-around：每个项目两侧的间隔相等。所以，项目之间的间隔比项目与边框的间隔大一倍
align-items：定义项目在交叉轴上如何对齐
- flex-start：交叉轴的起点对齐
- flex-end：交叉轴的终点对齐
- center：交叉轴的中点对齐
- baseline: 项目的第一行文字的基线对齐
- stretch（默认值）：如果项目未设置高度或设为auto，将占满整个容器的高度
align-content：定义多根轴线的对齐方式。如果项目只有一根轴线，该属性不起作用
- flex-start：与交叉轴的起点对齐
- flex-end：与交叉轴的终点对齐
- center：与交叉轴的中点对齐
- space-between：与交叉轴两端对齐，轴线之间的间隔平均分布
- space-around：每根轴线两侧的间隔都相等。所以，轴线之间的间隔比轴线与边框的间隔大一倍
- stretch（默认值）：轴线占满整个交叉轴
关于项目属性
order：定义项目的排列顺序。数值越小，排列越靠前，默认为0
flex-grow：定义项目的放大比例，默认为0，即如果存在剩余空间，也不放大
如果所有项目的 flex-grow 属性都为 1，则它们将等分剩余空间（如果有的话）。如果一个项目的 flex-grow 属性为 2，其他项目都为 1，则前者占据的剩余空间将比其他项多一倍。
flex-shrink: 定义项目的缩小比例，默认为1，即如果空间不足，该项目将缩小。
如果所有项目的flex-shrink属性都为1，当空间不足时，都将等比例缩小。如果一个项目的flex-shrink属性为0，其他项目都为1，则空间不足时，前者不缩小。负值对该属性无效。
