面试知识点记录

最近在学校参加校招，正在疯狂吸入各类面试题，学习的同时，也须要巩固知识，毕竟我是个记忆力不咋地的小菜鸡... 话很少说，开始今天的学习分享吧！

1.px rem em 的区别

他们都是计量单位，用来表示尺寸的。

px: 像素（Pixel）,相对长度单位，是针对显示器屏幕的分辨率而言的

优势：利用px设置字体大小和宽高等比较精准

缺点：px不能适应浏览器缩放带来的变化，不适用于响应式网站

em: 表示相对尺寸，其至关于对象内文本的font-size,参考父元素文本里的font-size

优势：能够很好的适应设备屏幕的变化，但必定要记得设置父元素的font-size

rem: 也表示相对尺寸，它的参考对象为根元素的font-size

2.position有哪几个属性，具体效果分别是什么

1. static 默认值，无定位
2. relative 生成相对定位元素，通常在子元素设置成position:absolute的时候，给父元素的position设置成relative
3. absolute 生成绝对定位元素，相对于static定位以外的第一个父元素进行定位
4. fixed 生成绝对定位元素，可是相较于浏览器窗口进行定位，常见于各类网站广告
5. inherit 从父元素继承position的值

3.absolute元素不设置left和top时会在哪一个位置（父元素顶部，可是包括static的父元素）

会在原来的文档流位置，可是因为margin的折叠效应会向下偏移一点与后面的元素重叠在一块儿

4.concat()

用于链接两个或多个数组，不会改变现有数组，仅仅返回一个被链接的副本

a.concat(b,c,d,e....)

a,b,c,d,e均为数组

5. Web Storage 分类

• sessionStorage 用于本地存储一个会话（session）中的数据，会话结束数据随之消失，只有在同一个会话的时候才能够访问。所以，session Storage 不是一种持久化的本地存储，仅仅为会话级存储
• localStorage 用于持久化的本地存储，除非主动删除数据，不然永不过时

6.如何用CSS画一个三角形

width：0；
height: 0;
border: 100px solid #000;
border-left: 50px solid transparent;
border-left: 50px solid transparent;
复制代码

7.CSS 优先级

!important > 行内样式 > ID选择器 > 类选择器 > 标签 > 通配符 > 继承 > 默认

同一级别后写的会覆盖先写的

8. 执行顺序问题

console.log(1);
let a = setTimeout(() => {console.log(2)}, 0);
console.log(3);
Promise.resolve(4).then(b => {
console.log(b);
clearTimeout(a);
});
console.log(5);
复制代码

问：代码在控制台的输出顺序是（C）

A. 1,2,3,4,5
B. 1,3,4,5
C. 1,3,5,4
D. 1,3,5,4,2
复制代码

很明显先执行同步任务，输出1,3,5，排除A，B 再执行异步任务，其中异步任务分为宏任务和微任务， 微任务的优先级高于宏任务，因此先执行Promise.resolve（4）， clearTimeout又把宏任务setTimeout清除了，因此选择C

9.变量值

在ECMAScript中，变量能够存放两种值，原始值和引用值

原始值有五种基本数据类型： Null,Boolean,String,underfined,number

10.

(function() {
  var a = b = 5;
})();   
console.log(b);
console.log(a);
复制代码

输出结果是：（D）

A. 5    5
B.Undefined Undefined
C.5     Undefined
D.5 Uncaught ReferenceError: a is not defined
复制代码

首先，第一个考点在于，var a = b = 5,实际上它是var a = b; b = 5; 能够看见在变量b的前面没有var来声明，所以它是一个全局变量，实际上至关于在全局声明了b这个变量。因此b的输出结果为5，排除B选项。

第二个考点，a是一个局部变量，在声明完以后就销毁了，固然找不到报错了...因此D才是正确答案