面试总结（CSS+JS）

css：

1、瀑布流： ① display:flex + flex-direction:column + flex-wrap:wrap       ② column-count + column-gap

2、src和href的区别：都是用于请求资源。

href（超文本引用）用于在当前文档和引用资源之间确立联系（link、a），src将其指向的资源下载应用到当前页面（script、img），请求到的资源替换当前的内容；href浏览器会识别该文档为css文件，并行下载资源并且不会停止对当前文档的处理，（同时也是为什么建议使用 link 方式加载 CSS，而不是使用 @import 方式）；src会暂停其他资源的下载和处理，直到将该资源加载、编译、执行完毕，将其所指向资源应用到当前内容（这也是为什么把js文件放在底部而不是头部的）

 3、判断图片是否加载完成

      ① img的complete属性；② onload事件

4、伪元素最基本的设置（::before和::after）

• 默认display: inline；
• 必须设置content属性，否则一切都是无用功，(默认是空字符串)；
• 默认user-select: none，就是::before和::after的内容无法被用户选中的；
• 伪元素和伪类结合使用形如：.target:hover::after

5、清除浮动

• 在浮动元素后使用一个空元素如，并在CSS中赋予.clear{clear:both;}属性即可清理浮动。
• 给浮动元素的容器添加overflow:hidden;或overflow:auto
• 什么都不做，给浮动元素后面的元素添加clear属性。
• 给浮动元素的容器通过:after伪元素实现在元素末尾添加一个看不见的块元素（Block element）即可清理浮动

6、css选择器优先级

•  !mportant>内联>id>class、属性、伪类>元素选择器

7、px、em和rem区别

• px：相对长度单位，相对于屏幕分辨率
• em：相对长度单位，相对于当前对象内文本的字体大小。如当前对行内文本的字体尺寸未被人为设置，则相对于浏览器的默认字体尺寸。子元素会继承父元素的字体大小
• rem:相对于html根元素

8、重绘和回流的区别

• 重绘：元素样式的改变（但宽高、大小、位置等不变）
• 回流：元素的大小或者位置发生改变（当页面布局和几何信息发生改变的时候），触发了重新布局导致渲染树重新计算布局和渲染

9、标准模型和怪异模型的区分

• 标准模型：content+padding+border+margin
• 怪异模型:content +margin
• 转换成标准模型:box-sizing:border-box   转换成怪异模型:box-sizing:content-bos

10、bfc（块级格式化上下文）

独立渲染的一个区域

JS：

1、对象合并的方法：

• object.assign(target,resource)，es6新增，后面覆盖之前的 
• $extend（true,），jQuery
• json.parse(json.stringfy) ，深拷贝
• ...扩展运算符，es6新增
• 递归

2、检测类型的方法

• typeof 用来监测数据类型的运算符
• instanceof 检测某一个实例是否属于某个类
• constructor跟instanceof相似 可以处理基本数据类型的检测
• object.prototype.toString.call()

3、map和forEach区别：

• map有返回值，可以return出来
• map会将处理结果组成一个新的数组并返回，原数组不会被修改，forEach只是遍历，可以修改原数组

4、slice：截取；  splice：拼接

5、数组方法

map、forEach、filter、reduce、find、findIndex、some、every、

6、对象方法

object.assign()；object.defineproperty()；object.keys()；object,getOwnPropertyNames()；object.value()；object.is()；

7、const定义的值怎么修改

const定义的基本数据类型的变量是不可以修改的，复杂类型的值是可以修改的

8、闭包

闭包的表现形式就是一个函数内部在嵌套一个函数，然后把内部函数返回，js在es6之前有一个函数级作用域，就是我们在函数外面访问不到函数内部的一些属性或方法，那么我们可以通过这种形式的话，可以在内部函数访问他，这样可以产生两个作用，一个是，形成一个暂时性的死区，在函数执行完之后不会被释放，可以做一些模块化的操作，防止全局污染，另外一个的话可以突破作用域的限制，然后在外层可以访问内层的一些属性和方法

9、防抖和节流

 10、在浏览器地址栏键入URL，按下回车之后会经历以下流程：

• 浏览器向 DNS 服务器请求解析该 URL 中的域名所对应的 IP 地址;
• 解析出 IP 地址后，根据该 IP 地址和默认端口 80，和服务器建立TCP连接;
• 浏览器发出读取文件(URL 中域名后面部分对应的文件)的HTTP 请求，该请求报文作为 TCP 三次握手的第三个报文的数据发送给服务器;
• 服务器对浏览器请求作出响应，并把对应的 html 文本发送给浏览器;
• 释放 TCP连接;
• 浏览器接收该 html 文本并显示内容

11、let var const区别

• let const是es6新增的，具有块级作用域
• let var 用来定义变量，const用来定义常量
• var 存在变量提升
• var定义的变量，有全局作用域，会作为window的一个属性
• const一旦定义，必须要赋值

const 变量指向的那个内存地址不得改动；对于引用类型的数据，变量指向的内存地址，保存的只是一个指向实际数据的指针，const只能保证这个指针是固定的。至于指向的数据结构是不是可变，是不能控制的