面试题总结

Css篇：

1、CSS实现宽度自适应100%，宽高16:9的比例的矩形。

JS篇：

1、iframe的缺点有哪些？

iframe会阻塞主页面的Onload事件；
搜索引擎的检索程序无法解读这种页面，不利于SEO;
iframe和主页面共享连接池，而浏览器对相同域的连接有限制，所以会影响页面的并行加载。
使用iframe之前需要考虑这两个缺点。

如果需要使用iframe，最好是通过javascript动态给iframe添加src属性值，这样可以绕开以上两个问题。

2、怎么判断两个对象是否相等？

3、git pull和git fetch的区别？

（1）git fetch：相当于是从远程获取最新版本到本地，不会自动merge

（2）git pull：相当于是从远程获取最新版本，并merge到本地

4、ES6中箭头运算符this指向问题？ （参考这篇文章：  ES6箭头函数--特性）

（1）箭头函数的 this 始终指向函数定义时的 this，而非执行时。
（2）还需要注意一点的就是这个this是不会改变指向对象的，我们知道call和apply可以改变this的指向，但是在箭头函数中是无效的。

5、ES6箭头函数没有块级作用域。

//ES6箭头函数
var o = {
        x : 11,
        test : () => {console.log(this.x)}
    };

o.test();

输出：undefined

　　

//非箭头函数

var o = {
        x : 11,
        test : function () {console.log(this.x)}
    };

o.test();

输出： 11

6、=、浅拷贝、深拷贝三者区别？

　　浅拷贝是和深拷贝比较的，深拷贝可以理解为递归进行浅拷贝。
　　深拷贝为了解决对象中依旧含有对象，例如

let a = {
  name: 'LiHua',
  habits:  ['a', 'b']
}

1. 普通的=赋值：b=a，b如果修改了b.name，那么a.name也会改变
2. 浅拷贝，b，如果修改了b.name, a.name不会改变，但是修改b.habits数组中的值，a.habits的值也会改变。 如 Array的slice和    concat方法。
3. 深拷贝，b的值改变，不会对a产生任何影响。 如 JSON.parse(JSON.stringify(testObj))【该方法对于正则表达式类型、函数类型等无法进行深拷贝(而且会直接丢失相应的值)。】和  lodash库的cloneDeep方法;

7、position类型？

• 定位元素（positioned element）是其计算后位置属性为 relative, absolute, fixed 或 sticky 的一个元素。
• 相对定位元素（relatively positioned element）是计算后位置属性为 relative 的元素。
• 绝对定位元素（absolutely positioned element）是计算后位置属性为 absolute 或 fixed 的元素。  【绝对定位元素脱离文档流】
• 粘性定位元素（stickily positioned element）是计算后位置属性为 sticky 的元素

8、函数声明和函数表达式

　　变量声明提升，即所有声明变量或声明函数都会被提升到当前函数的顶部； 函数表达式最大的问题，在于将代码拆分为两行分别执行。

var getName = function () { alert (4);};
function getName() { alert (5);}

getName(); //4

　　变量提升后执行代码实际为：

var getName;//只提升变量声明
function getName() { alert (5);}//提升函数声明，覆盖var的声明
getName = function () { alert (4);};//最终的赋值再次覆盖function getName声明

getName();//最终输出4