qq_44428688的博客

写在最先，不知不觉更新面试题系列也一个月过去了，在这个过程中查漏补缺良多。也来到了熟悉又不太熟悉的VUE阶段。看这些八股文有用吗，我感觉当然是有用的，扩展自己的思维，当在工作中遇到不会的东西的时候。你虽然不能完全上手，但是你至少知道有这么东西存在，你大概能联想到是这个东西。编程需要天赋这是毋庸置疑的，但是我们也要相信任何东西都是勤能补拙的。既然不是天才，那就和比大多数平凡人去更努力一点吧… 这当然枯燥，但是这也很有趣！

CSRF(跨站请求伪造）是一种挟持用户当前以及登录的web应用程序上执行非本意操作的攻击方法。XSS(跨站脚本)，指的是通过利用网页开发时留下的漏洞，注入恶意指令代码到网页，使用户加载并执行攻击者恶意的网页程序。常见的列如在评论区植入JS代码，用户进入评论网页代码被执行，造成页面被植入广告，账户信息被窃取等。如何防御CSRF攻击1.验证token：浏览器请求服务器时，服务器随机返回一个token，每个请求都需要带上token和cookie才会被认为是合法的请求。

https:运行在ssl（secure socket layer）上面，ssl运行在tcp上面，是添加了加密和认证机制的http,默认端口443，https的加减密处理消耗更多的CPU和内存资源，还需要证书。get和post本身都是tcp的连接，并无差别。但是由于HTTP规定和浏览器/服务器的限制，导致它们在应用过程中体现出一些不同。http:协议运行在TCP之上，明文传输，客户端与服务器无法验证对方的身份，默认端口80。post:向指定的资源提交要被处理的数据，用于将数据发送给服务器。

递归就是在运行的过程中调用自己，构成递归需要以下条件。子问题与原始问题为同样的事情且更为简单。不能无限制的调用本身，需要有一个出口，化简为非递归的情况处理。2.es6 flat 函数 （推荐使用）

而异步的概念则是不保证同步的概念，也就是说，一个异步过程的执行将不再与原有序列的有顺序关系。promise是一部编程的一种解决方案，在es6中promise被列为了正式规范，统一了用法，原生提供了promise对象，promise承诺：默认情况下是等待状态pending,如果状态转变为成功就成功了，如果状态转变为失败就是失败了。是指把接受多个参数的函数变换成接受一个单一参数（最初函数的第一个参数）的函数，并且返回接受余下的参数而且单号结果的新函数的技术。同步：上一个任务没有执行完，下一个任务不能开启。

浅拷贝只是拷贝一层，更深层及的对象级别只是拷贝出来引用，不拷贝地址，两者属性值指向同一内存空间。简单来讲，就是改变其中一个对象，另一个对象也会跟着改变。深拷贝，拷贝对象各个层级的属性。简单来讲，就是复制出来的每个对象都有属于自己的内存空间，不会互相干扰。实现深拷贝 （这个一般VUE里面有个内置的模块loadsh 很好用和这个深拷贝 用的都是这个 但是下面也会沾一个深拷贝的代码）return obj;[] : {};

使用事件冒泡原理，自己所触发的事件，让其父元素代为执行例如：富文本解析在不改变富文本内容的情况下给图片实现点击放大预览效果 可以把事件给到解析富文本的那个盒子 然后通过event 去判断点击是不是图片 再进行下面的事件处理。

4.Object.prototype.toString.call(arr) 把对象转换成一个字符串和已知对象去对比。2.值类型只能单纯的存储值，如整型，字符串等。而引用类型可以存储对象的堆地址，可以使多个变量指向同一个对象。1.值类型内容长度固定，保存值的存在范围，引用类型内容长度不固定，可以存储不定长度的数据。1.Array.isArray(要检测的值) 是数组返回true 不是数组返回false。一般说的JS的数据类型是前7个 7中数据类型 后两种也有归属于object的说法。

层爆炸，由于某些原因肯呢个导致大量不在预期内的合成层，虽然哟浏览器的层压缩机制，但是也有跟多无法进行压缩的情况。简单直接的方式：食堂3D硬件家岁提升动画性能时候，最后给元素增加一饿z-index属性，人为干扰合成层的顺序，可以有效的减少创建不必要的合成层，提升渲染性能。双飞翼布局：为了中间div内容不被遮挡，直接在中间div内部创建子div用于放置内容，在该子div里用margin-left和margin-right为左右两栏div留出位置（放大浏览器不会变形）他俩的区别就是一个往外撑一个往里挤的区别吧。

BFC的布局规则是内部的box会在垂直方向上，一个接一个地放置，BOX垂直的方向的距离由margin决定，属于同一个BFC的两个相邻的BOX的margin 会发生重叠。在布局中，BFC的应用场景包裹清楚盒子垂直方向上外边距合并和解决子元素设置成浮动元素时产生的父元素高度塌陷的问题。所谓的塌陷即是较大的margin 会覆盖较小的margin 上下方向的两个盒子中间只有一个较大的margin值(本来应该是2+1 变成2 )。4.把子元素的margin 改成父元素的padding。父子的margin塌陷。

1.结构化标准语言：主要败局哦XHTML和xml .Xhtml是一种基于xml的标记语言，用于创建和组织网页内容。具有更好的可读性和维护性。xml则是一种用于描述和传输数据的标记语言，具有可扩展性和灵活性。被广泛应用于web服务，数据存储和配置文件等领域。2.表现标准语言：主要包括css。css是一种用于控制网页样式和布局的标记语言，通过选择器和属性来定义元素的外观和行为。可以实现网页的美化和响应式设计，使得网页可以适应不同的屏幕尺寸和设备类型。W3C标准主要包括一下几个方面。

flex-direction属性指定了弹性子元素在父容器中的位置1.row:横向从左到右排列（左对齐），默认的排列方式2.row-reverse：反转横向排列（右对齐），从后往前排，最后一项排在最前面3.colum：纵向排列4.colum-reverse：反正纵向排列，从后往前排列，最后一项排在最上面。

1.vue双向绑定的原理是什么？里面的关键点在哪里？vue2的双向绑定时通过object.defineProperty()去劫持各个属性的setter,getter，在数据变动时，发布消息给订阅者，触发相应的监听回调来渲染视图。直接定义一个新属性，或者修改一个现有属性，并返回此对象缺点：检测不到对象属性的添加和删除数组API方法无法监听到 数组的api方法在vue2里面进行了重写需要对每个属性进行遍历监听，如果嵌套对象，需要深层监听，造成性能问题vue3 es6新增的Proxy的监听是针对一个对象的，那么对

canvas具有灵活性，高性能，跨平台等优点。2.渲染方式: canvas使用的是像素渲染的方式，这意味着它适合于绘制复杂的，由像素构成的图像。4.文件大小：由于canvass使用的是像素渲染的方式，所以在同样的显示效果下,canvas需要更多的存储空间.svg一般都比较小。5.可编辑性 :canvas通过Js进行绘制，一旦绘制完成就很难直接编辑，而svg的图像是xml格式的,可以直接编辑和修改。1.autoplay:此属性允许音频在也加载完成后自动播放，需要注意的是，不是所有的浏览器都支持此属性。