20200409-美团前端实习 一面凉经

严重发现本身手撕代码，不能调试的状况下能力不好
原理还好，有些知识点就是紧张忘了orz

基本上这些，有点记不住了

行级块级元素（没怎么举出来） 
消除浮动 （clear：both和父级hidden）
js基本变量（我没答上来忘了undefined和null）
tcp （三握四挥）为何四挥
节流防抖（有大体思路，写不出）
ajax（大体差很少??）
跨域（cors和jsonp）为何？（同源策略）
原型链继承（原型式、寄生虫组合式）
let、const、var的区别
call、apply、bind的区别
让我模拟call（中午刚看的就忘了）
重绘重排（回流我也记不太清了）
bfc ifc（ifc忘记）

行级块级元素

一、在众多行内元素中，最常使用的是span，另外行内元素还包括img、a、big、small、sub、sup、strong、u、button(属性默认为display：inline-block)

二、行内元素的特色：相邻的行内元素不换行，设置宽高无效，margin设置仅左右方向有效，上下无效，padding设置上右下左都有效。水平方向上padding-left，padding-right，margin-left，margin-right都有边距效果，可是垂直方向上padding-top、padding-bottom、margin-top、margin-bottom都不会产生边距效果。

三、块级元素最具备表明性的就是div，其他的有p、h1~h六、table、ul、li、ol、等等以及H5新增的属性header、section、aside、footer等等。

消除浮动

1.额外标签法：给谁清除浮动，就在其后额外添加一个空白标签 。
优势：通俗易懂，书写方便。（不推荐使用）
缺点：添加许多无心义的标签，结构化比较差。

给元素small清除浮动（在small后添加一个空白标签clear(类名能够随意），设置clear:both;便可）

2.父级添加overflow方法：能够经过触发BFC的方式，实现清楚浮动效果。
优势：代码简洁（慎重使用，若该父盒子里还有position定位会引发麻烦）
缺点：内容增多时候容易形成不会自动换行致使内容被隐藏掉，没法显示须要溢出的元素。

注意：别加错位置，是给父亲加（并非全部的浮动都须要清除，谁影响布局，才清除谁。）

3.使用after伪元素清除浮动：：after方式为空元素的升级版，好处是不用单独加标签了。（较经常使用）
优势：符合闭合浮动思想，结构语义化正确
缺点：因为IE6-7不支持：after，使用zoom：1，触发hasLayout。

注意：这个也是给父亲添加 clearfix

4.使用before和after双伪元素清除浮动：（较经常使用）

注意：是给父亲添加clearfix

js基本变量

number、string、boolean、symbol、undefined、null

节流防抖

前几天刚看了orz，有点思路可是不严谨

https://blog.csdn.net/mus123/article/details/105333431

ajax

function loadDoc() {
  var xhttp = new XMLHttpRequest();
  xhttp.onreadystatechange = function() {
    if (this.readyState == 4 && this.status == 200) {
      document.getElementById("demo").innerHTML =
      this.responseText;
    }
  };
  xhttp.open("GET", "/example/js/ajax_info.txt", true);
  xhttp.send();
}

跨域（cors和jsonp）为何？（同源策略）

https://blog.csdn.net/mus123/article/details/105262096

原型链继承

https://blog.csdn.net/mus123/article/details/105412287

let、const、var

变量提高、块做用域、暂时性死区、同名变量、const固定
http://www.javashuo.com/article/p-bmsxzqus-by.html

call、apply、bind的区别

https://blog.csdn.net/mus123/article/details/105391096

重绘/重排（回流）

原来回流就是重排。。
尺寸、位置相关重排
颜色、可见性相关重绘
https://www.baidu.com/link?url=7fk8NogNusT0qCV4oBxiF-Bfu-kOklpMRDXFpyOdSOktEwEwFvIGUr2MRqA4M8tL73LRrCYbgRT8j9u8QKlzhq&wd=&eqid=ec072ca200000fbc000000035e8ed2d3

bfc ifc

http://www.javashuo.com/article/p-vbzamlwa-bx.html
bfc
Formatting Context，格式化上下文，指页面中一个渲染区域，拥有一套渲染规则，它决定了其子元素如何定位，以及与其余元素的相互关系和做用。

内部的Box会在垂直方向，一个接一个地放置。

Box垂直方向的距离由margin决定。属于同一个BFC的两个相邻Box的margin会发生重叠

每一个元素的左外边缘（margin-left)， 与包含块的左边（contain box
left）相接触(对于从左往右的格式化，不然相反)。即便存在浮动也是如此。除非这个元素本身造成了一个新的BFC。

BFC的区域不会与float box重叠。

BFC就是页面上的一个隔离的独立容器，容器里面的子元素不会影响到外面的元素。反之也如此。

计算BFC的高度时，浮动元素也参与计算

IFC(Inline Formatting Contexts)直译为"行内格式化上下文"，IFC的line box（线框）高度由其包含行内元素中最高的实际高度计算而来（不受到竖直方向的 padding/margin 影响)

IFC中的line box通常左右都贴紧整个IFC，可是会由于float元素而扰乱。float元素会位于IFC与与line box之间，使得line box宽度缩短。 IFC中时不可能有块级元素的，当插入块级元素时（如p中插入div）会产生两个匿名块与div分隔开，即产生两个IFC，每一个IFC对外表现为块级元素，与div垂直排列。