ProGrammerXu的博客

定义：diff的过程就是调用名为patch的函数，比较新旧节点，一边比较一边给真实的DOM打补丁其有两个特点：比较只会在同层级进行, 不会跨层级比较 在diff比较的过程中，循环从两边向中间比较diff 算法的在很多场景下都有应用，在 vue 中，作用于虚拟 dom 渲染成真实 dom 的新旧 VNode 节点比较Diff算法的步骤：用 JavaScript 对象结构表示 DOM 树的结构；然后用这个树构建一个真正的 DOM 树，插到文 档当中当状态变更的时候，重新构造一棵新的对

条件：将数组var arr = [1,1,‘true’,‘true’,true,true,15,15,false,false, undefined,undefined, null,null, NaN, NaN,‘NaN’, 0, 0, ‘a’, ‘a’,{},{}]中重复的值过滤掉1、 ES6-set使用ES6中的set是最简单的去重方法var arr = [1,1,'true','true',true,true,15,15,false,false, undefined,undef

定义：在子组件中用<slot></slot>划出一块区域来显示父组件中页面结构，显示的结构在父组件的子组件标签中设置就可以了！插槽怎么显示数据显示的结构在父组件的子组件标签设置就行插槽分为几种默认插槽 具名插槽 作用域插槽具名插槽：给具体的插槽命名，并在使用的时候传入插槽的名称import Vue from 'vue'// 定义组件componentOne const compoentOne = { template: ` ..

把你们想知道问题的评论在这里，我一一解答！！！

一、单例模式定义：保证一个类仅有一个实例，并提供一个访问它的全局访问点二、核心确保只有一个实例，并提供全局访问3、实现在vue脚手架项目开发中，我们需要对axios进行请求拦截，响应拦截，多次调用封装号的axios实例也仅设置一次，封装后的axios就是要一个单例。以下是vue-cli4中axios单例模式的案例：一般我会在项目的src目录中，新建一个network文件夹，然后在里面新建一个http.js和一个api.js文件。http.js文件用来封装我们的axios，ap.

深拷贝和浅拷贝的区别1.浅拷贝： 将原对象或原数组的引用直接赋给新对象，新数组，新对象／数组只是原对象的一个引用（浅拷贝只拷贝一层）2.深拷贝： 创建一个新的对象和数组，将原对象的各项属性的“值”（数组的所有元素）拷贝过来，是“值”而不是“引用”（深拷贝层层拷贝）为什么要使用深拷贝？我们希望在改变新的数组（对象）的时候，不改变原数组（对象）内存模型JS内存空间分为栈(stack)、堆(heap)、池(一般也会归类为栈中)。 其中栈存放变量，堆存放复杂对象，池存放常量。基本数.

前言：js是面向过程，不是面向对象面向对象：我们可以通过 new Object()和字面量创建，但是这两种方法不能判断对象归属问题以及不能批量产出对象，所以有了工厂模式，工厂模式是在函数中new一个对象，给对象赋值，然后return 对象，工厂模式解决了批量的问题，但是还是没有解决对象归属问题。所以又有了构造函数模式，构造函数解决了对象的归属问题，但是构造函数创建的对象的方法不能共享，每个对象都会创建方法，造成内存开销特别大，所以产生了原型的解决方法。我们一般情况下会采用构造函数和原型混合的模式来

什么是微任务以及宏任务?宏任务包括：setTimeout setInterval Ajax DOM事件微任务：Promise async/await微任务比宏任务的执行时间要早异步和单线程异步和单线程是相辅相成的，js是一门单线程脚本语言，所以需要异步来辅助异步和同步的区别:异步不会阻塞程序的执行， 同步会阻塞程序的执行，前端使用异步的场景：定时任务：setTimeout，setInverval 网络请求：ajax请求，动态<img>加载 事件绑定//

首先：不同浏览器的内核不尽相同，所以浏览器对网页的解析也有所差异。浏览器的内核主要分为两种： 一、 渲染引擎二、JS引擎。所以浏览器的兼容问题 一般是 css兼容问题，js兼容问题。二、浏览器的渲染内核浏览器 内核（渲染引擎） Chrome谷歌 之前Webkit，已改Blink内核 FireFox火狐 Gecko Safari苹果 Webkit IE Trident Opera欧朋 现已改用Google Chrome的Bli..

flex布局通过 display:flex来实现flex布局那么常用的属性值有哪些呢？容器的属性以下6个属性设置在容器上。flex-direction flex-wrap flex-flow justify-content align-items align-contentflex-direction属性flex-direction属性决定主轴的方向（即项目的排列方向）。它可能有4个值。row（默认值）：主轴为水平方向，起点在左端。 row-revers

1.清除浮动的四种方式为什么要清除浮动？为了解决父级元素因为子集元素引起的高度为0.第一种额外标签法：给谁清除浮动，就在其后额外添加一个空白标签 。优点：简便方便理解缺点：添加没有意义的标签，结构差<div class="fahter"> <div class="big">big</div> <div class="small">small</div> <div..

盒模型与BFC:什么是盒模型：在我们html中，每个元素都可以看做成一个盒子 ：分为 四个部分 分别是：1、内容区域（content）2、内边距（padding）3、外边距（margin）4、边框（border）四个部分组成！盒模型有两种：标准盒模型的总宽度=border+padding+width怪异盒模型的总宽度=border+padding+margin+（内容宽度）那如何在怪异盒模型宽度和标准盒模型总宽度之间怎么切换呢？box-sizing:border-box 怪.