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

严重发现自己手撕代码,不能调试的情况下能力很差
原理还好,有些知识点就是紧张忘了orz

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

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

行级块级元素

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

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

3、块级元素最具有代表性的就是div,其余的有p、h1~h6、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固定
https://www.cnblogs.com/zhaoxiaoying/p/9031890.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

https://segmentfault.com/a/1190000014886753
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垂直排列。

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章