前端知识盲点for of 一个数据结构只有部署了 Symbol.iterator 属性, 才具有 iterator接口可

1，requestAnimationFrame 的执行时间

 setTimeout(() => {
  console.log('setTimeout')
}, 0)

requestAnimationFrame(() => {
  console.log('requestAnimationFrame')
})

new Promise(r => {
  console.log('promise')
  r()
}).then(() => console.log('then')

如果是一个 microtask, 那么他应该打印 promise requestAnimationFrame then setTimeout

如果是一个 macrotask, 那么他应该打印 promise then setTimeout requestAnimationFrame

requestAnimationFrame会有一个16.6s的延迟
2,**for...in **循环只能遍历对象上的可枚举属性
**for of **一个数据结构只有部署了 Symbol.iterator 属性, 才具有 iterator接口可以使用 for of循环。
部署了 Symbol.iteratoer属性的数组；数组 Array,Map,Set,String,arguments对象,Nodelist对象(获取dom元素的列表的集合)
3,forEach是不能阻塞的，默认是请求并行发起，所以是同时输出1、4、9。

4,flex:

a,b,c a代表该容器的放大比例，b代表该容器的缩小比例，c代表实际长度
如果子元素的加和小于父元素，按照放大比例放大空余部分；反之，按照权重收缩；

<div class="container">
    <div class="left"></div>
    <div class="right"></div>
</div>

<style>
  * {
    padding: 0;
    margin: 0;
  }
  .container {
    width: 600px;
    height: 300px;
    display: flex;
  }
  .left {
    flex: 1 2 500px;
    background: red;
  }
  .right {
    flex: 2 1 400px;
    background: blue;
  }
</style>
结果：
子元素的 flex-shrink 的值分别为 2，1
溢出：500+400 - 600 = 300。
总权重为 2 * 500+ 1 * 400 = 1400
两个元素分别收缩：
300 * 2(flex-shrink) * 500(width) / 1400= 214.28
300 * 1(flex-shrink) * 400(width) / 1400= 85.72
两个元素的最终宽度分别为：
500 - 214.28 = 285.72
400 - 85.72 = 314.28

5,toFixed()

方法可把 Number 四舍五入为指定小数位数的数字
6,把数字格式化为指定的长度
7，/...(?=.)/ 前面可以匹配任意三个字母，后头必须在匹配一个字母
8，length 属性可返回字符串中的字符数目。而function中length获取为一个函数定义的参数数目。
9,es6枚举只能是以类的方式定义枚举类，不能直接使用enum关键字？？？？？
10,
Math.round(）函数返回一个数字四舍五入后最接近的整数如果参数的小数部分大于0.5，四舍五入到相邻的绝对值更大的整数如果参数的小数部分小于0.5，四舍五入到相邻的绝对值更小的整数如果参数的小数部分等于0.5，四舍五入到相邻的在正无穷（+∞）方向上的整数。
11,var test=undefined;typeof test=='undefined'==false;
12，a^=(1<<4)-1;^表示异或，<<表示右移
13，JavaScript的可迭代对象

1）数组Arrays
2）字符串Strings
3）Map
4）Set
5）arguments
6）Typed Arrays
7）Generators，ES6新增加

14,在正则表达式中exec返回匹配到的内容；
15，For循环是按顺序的，for in 循环是不一定按顺序的
16，关于原型链

Object.prototype.proto=== null;//true
Object.prototype.prototype === undefied;//true
在js中如果A对象是由B函数构造的，那么A.proto === B.prototype

f.proto === f[的构造函数].prototype === F.prototype
F.prototype.proto === (F.prototype)[的构造函数].prototype === Object.prototype (所以a能够通过f.a访问)
f.constructor === F
F.proto === F[的构造函数].prototype === Function.prototype (所以b可以通过, f.constructor.b访问到)

17，match不是正则表达式的函数，是支持正则表达式的函数
(1) test() 方法用来检测一个字符串是否匹配某个正则表达式，如果匹配成功，返回 true ，否则返回 false； (2) exec() 方法用来检索字符串中与正则表达式匹配的值。exec() 方法返回一个数组，其中存放匹配的结果。如果未找到匹配的值，则返回 null；（3）compile() 方法可以在脚本执行过程中编译正则表达式，也可以改变已有表达式。
18,NAN的布尔值也是null
19,typeof
undefined 值未定义
布尔值
boolean string 字符串
number 数值（整形和浮点）
object 对象或null
function 函数
20，instance

instanceof能检测出object的具体类型，还能检测出多层继承的关系，例如：
function Person(){
}
function Student(){
}
Student.prototype = new Person();
var John = new Student();
console.log(John instanceof Student); // true
console.log(John instancdof Person);  // true

21，

javascript中实现跨域的方式总结
第一种方式：jsonp请求；jsonp的原理是利用<script>标签的跨域特性，可以不受限制地从其他域中加载资源，类似的标签还有<img>.
第二种方式：document.domain；这种方式用在主域名相同子域名不同的跨域访问中
第三种方式：window.name；window的name属性有个特征：在一个窗口(window)的生命周期内,窗口载入的所有的页面都是共享一个window.name的，每个页面对window.name都有读写的权限，window.name是持久存在一个窗口载入过的所有页面中的，并不会因新页面的载入而进行重置。
第四种方式：window.postMessage；window.postMessages是html5中实现跨域访问的一种新方式，可以使用它来向其它的window对象发送消息，无论这个window对象是属于同源或不同源。
第五种方式：CORS；CORS背后的基本思想，就是使用自定义的HTTP头部让浏览器与服务器进行沟通，从而决定请求或响应是应该成功还是应该失败。
第六种方式：Web Sockets；web sockets原理：在JS创建了web socket之后，会有一个HTTP请求发送到浏览器以发起连接。取得服务器响应后，建立的连接会使用HTTP升级从HTTP协议交换为web sockt协议。

22，forEach，filter，every，some会跳过空位，map会跳过空位，但是会保留这个值。
23，冒泡事件很多，个人觉得记住常见的不支持冒泡事件就可以了有：①focus ②blur ③mouseenter ④mouseleave ⑤load ⑥unload ⑦resize
24，[1,2,-3].reduce((a, b) => a - b, 0)；reduce函数的初始值为0，然后依次计算0-1 -1-2...;
25,1 in [1] in操作符表示寻找数组里是否有索引为1 的数值
26，'use strict'是严格模式
严格模式下禁止this关键字指向全局对象。
此时this为undefined。
27，setMonth(n)，这里是0-11分别对应1-12月
28,undefined 和 null与任何其他值用“==”比较返回值都是false;
29, $emit() 是向上冒泡(子组件向父组件传值)$ broadcast() 是向下传播事件（父组件向子组件传值） 30，用来定义在脚本未被执行时的替代内容
31,var datas=[10,20,30]; datas.unshift(40,50); // 首部添加 [40,50,10,20,30]
32，调用对象未声明的属性会undifned
使用未声明的变量会报错
33，下面情况会导致reflow发生
1：改变窗口大小
2：改变文字大小
3：内容的改变，如用户在输入框中敲字
4：激活伪类，如:hover
5：操作class属性
6：脚本操作DOM
7：计算offsetWidth和offsetHeight
8：设置style属性
34,[]会被转换为true
[]==false这时[]会被隐式转换为0
35，常见的请求头和相应头都有什么呢？ 1)请求(客户端->服务端[request]) GET(请求的方式) /newcoder/hello.html(请求的目标资源) HTTP/1.1(请求采用的协议和版本号) Accept: /(客户端能接收的资源类型) Accept-Language: en-us(客户端接收的语言类型) Connection: Keep-Alive(维护客户端和服务端的连接关系) Host: localhost:8080(连接的目标主机和端口号) Referer: http://localhost/links.asp(告诉服务器我来自于哪里) User-Agent: Mozilla/4.0(客户端版本号的名字) Accept-Encoding: gzip, deflate(客户端能接收的压缩数据的类型) If-Modified-Since: Tue, 11 Jul 2000 18:23:51 GMT(缓存时间) Cookie(客户端暂存服务端的信息) Date: Tue, 11 Jul 2000 18:23:51 GMT(客户端请求服务端的时间)

2)响应(服务端->客户端[response]) HTTP/1.1(响应采用的协议和版本号) 200(状态码) OK(描述信息) Location: www.baidu.com(服务端需要客户端访问的页面路径) Server:apache tomcat(服务端的Web服务端名) Content-Encoding: gzip(服务端能够发送压缩编码类型) Content-Length: 80(服务端发送的压缩数据的长度) Content-Language: zh-cn(服务端发送的语言类型) Content-Type: text/html; charset=GB2312(服务端发送的类型及采用的编码方式) Last-Modified: Tue, 11 Jul 2000 18:23:51 GMT(服务端对该资源最后修改的时间) Refresh: 1;url=www.it315.org(服务端要求客户端1秒钟后，刷新，然后访问指定的页面路径) Content-Disposition: attachment; filename=aaa.zip(服务端要求客户端以下载文件的方式打开该文件) Transfer-Encoding: chunked(分块传递数据到客户端）
Set-Cookie:SS=Q0=5Lb_nQ; path=/search(服务端发送到客户端的暂存数据) Expires: -1//3种(服务端禁止客户端缓存页面数据) Cache-Control: no-(服务端禁止客户端缓存页面数据)
Pragma: no-(服务端禁止客户端缓存页面数据)
Connection: close(1.0)/(1.1)Keep-Alive(维护客户端和服务端的连接关系)
Date: Tue, 11 Jul 2000 18:23:51 GMT(服务端响应客户端的时间) 在服务器响应客户端的时候，带上Access-Control-Allow-Origin头信息，解决跨域的一种方法。
36，XML 被设计为传输和存储数据，其焦点是数据的内容。
HTML 被设计用来显示数据，其焦点是数据的外观。
37，switch中没有break,会一直向下执行
38，0xff ^ 33进行异或操作，结果是22
39，XML 与 HTML 的主要差异 XML 不是 HTML 的替代。

XML 和 HTML 为不同的目的而设计：

XML 被设计为传输和存储数据，其焦点是数据的内容。

HTML 被设计用来显示数据，其焦点是数据的外观。

HTML 旨在显示信息，而 XML 旨在传输信息
40，解决端口被占用问题
[链接]（blog.csdn.net/zt157326258…
41,

var foo = {n:1};
(function(foo){            //形参foo同实参foo一样指向同一片内存空间，这个空间里的n的值为1
    var foo;               //优先级低于形参，无效。
    console.log(foo.n);    //输出1
    foo.n = 3;             //形参与实参foo指向的内存空间里的n的值被改为3
    foo = {n:2};           //形参foo指向了新的内存空间，里面n的值为2.
    console.log(foo.n);    //输出新的内存空间的n的值
})(foo);
console.log(foo.n);        //实参foo的指向还是原来的内存空间，里面的n的值为3.

42，Array.prototype.slice.call(arguments)将类数组转化为数组；
43,parse有两个参数，当传入字符串时，会从第一个数字解析到第一个非数字，如果第一个是非数字则返回NAN，反之，返回解析得到的数字。