大前端面试题总结

大前端总结

一.Javascript部分
1.箭头函数与普通函数的区别
答：普通函数：
（1）函数作为全局函数被调用时，this指向全局对象
（2）函数作为对象中的方法被调用时，this指向该对象
（3） 函数作为构造函数的时候，this指向构造函数new出来的新对象
（4）还可以通过call,apply,bind改变this的指向
箭头函数：
（1）箭头函数没有this,函数内部的this来自于父级最近的非箭头函数，并且不能改变this指向
（2）箭头函数没有super
（3）箭头函数没有arguments
（4）箭头函数没有new.target绑定
（5）不能使用new
（6）没有原型
（7）不支持重复的命名参数
2.MVVM
前后端分离：Model用纯JavaScript对象表示，View负责显示。
model：服务器的业务逻辑操作
view：用户界面
ViewModel：核心枢纽
过程：把view和model关联起来就是ViewModel
ViewModel负责把Model的数据同步到view显现出来，还负责把view修改同步到Model。
（1）各部分之间的通信，都是双向的
（2）View与Model不发生联系，都通过ViewModel传递。
3.BFC
块级格式化上下文
他是一个独立的渲染区域，并且与这个区域外部毫不相干。通俗地讲，BFC是一个容器，用于管理块级元素
（1）如何创建BFC
float为left或right
overflow为hidden|auto|scroll
display为table-cell或table-caption|inline-block|inline-flex|flex
position为absolute|fixed
根元素
4.get和post的区别
长度的限制
对于字段类型的支持post支持二进制编码
Get能被缓存post不能被缓存
Get是在所有的url是可见的post是不可见的
Get发送一次请求，Post发送两次
get用来获取数据，post用来提交数据
options：这个方法可使服务器传回该资源所支持的所有HTTP请求方法
put向指定资源位置上传其最新内容
DELETE：请求服务器删除Request-URI所标识的资源。
TRACE：回显服务器收到的请求，主要用于测试或诊断。
5. 强缓存和协商缓存
强：浏览器不与服务器协商直接取浏览器缓存
弱：浏览器会先向服务器确认资源的有效性后才决定是从缓存中取资源还是重新获取资源。
6.闭包？
当函数执行时，首先会形成一个私有的作用域，这个私有作用域保护了里面的私有变量不受外界的干扰；这种机制–> “闭包”；
闭包是指在 JavaScript 中，内部函数总是可以访问其所在的外部函数中声明的参数和变量
应用场景：防抖节流 、 变量的访问
7.ES6新增
（1）Set和map
set对象类似于数组，且成员的值都唯一
map对象是键值对集合，和json对象类似，但是key不仅是字符串也可以是对象
共同点
都是关联式容器 ，它们的底层容器都是红黑树 ，区别就在于map的值不作为键，键和值是分开的
字符串
includes()：返回布尔值，判断是否找到参数字符串。
startsWith()：返回布尔值，判断参数字符串是否在原字符串的头部。
endsWith()：返回布尔值，判断参数字符串是否在原字符串的尾部。

（2）Promise.all和promise.race区别
都是将多个 Promise 实例，包装成一个新的 Promise 实例。
Promise.all多个都成功才会调用.then中成功的回调
Promise.race只要有一个成功就会调用.then中成功的回调
Promise.finally
finally方法用于指定不管 Promise 对象最后状态如何，都会执行的操作

（3）垃圾回收机制
垃圾回收有两种实现方式，分别是标记清除和引用计数
标记清除：
当变量进入执行环境时标记为“进入环境”，当变量离开执行环境时则标记为“离开环境”，被标记为“进入环境”的变量是不能被回收的，因为它们正在被使用，而标记为“离开环境”的变量则可以被回收

（4）引用计数：
统计引用类型变量声明后被引用的次数，当次数为 0 时，该变量将被回收
JS哪些操作会引起内存泄漏
意外的全局变量引起的内存泄露
闭包引起的内存泄露
没有清理的DOM元素引用
被遗忘的定时器或者回调
子元素存在引起的内存泄露

（5）深浅拷贝
浅复制是对对象地址的复制，并没有开辟新的栈，也就是复制的结果是两个对象指向同一个地址，修改其中一个对象的属性，则另一个对象的属性也会改变，而深复制则是开辟新的栈，两个对象对应两个不同的地址，修改一个对象的属性，不会改变另一个对象的属性

说白了就是浅拷贝都是相同的内存地址，你的值变了 我也跟到变，

深拷贝呢就是你变你的，我们地址都不一样的，你变了关我屁事

（6）怎么禁止js访问cookie
设置了HttpOnly属性，那么通过js脚本将无法读取到cookie信息，这样能有效的防止XSS攻击

（7）深拷贝实现
JSON方法实现
用for…in实现遍历和复制
用数组的Array.prototype.forEach进copy

浅拷贝（使用object.assign方法）