1. axios概念 axios是一个基于Promise的HTTP客户端，可以用于浏览器和Node.js环境。axios支持所有现代浏览器和Node.js，可以用于发送GET、POST、PUT、DELETE等HTTP请求，并且支持请求和相应拦截、自动转换数据格式等功能。 2. Axios的核心 1.Promise 基础： Axios 基于 Promise，这意味着所有的请求都是异步的，并且可以使用 .then 和 .catch 方法来处理成功和失败的情况。 2.请求配置： 每次发送请求时，可以传递一个配置对象，包含 URL、方法、请求头、请求体等信息。 3.拦截器： Axios 支持请求和响应...

1. 虚拟DOM 虚拟dom是当前前端最流行的两个框架（vue和react）都用到的一种技术，都说他能帮助vue和react提升渲染性能，提升用户体验。 虚拟DOM就是一个普通的js对象（VNode 节点），是一个用来描述真实dom结构的js对象。 为什么要用虚拟DOM 你用传统的原生api或jQuery去操作DOM时，浏览器会从构建DOM树开始从头到尾执行一遍流程。 当你在一次操作时，需要更新10个DOM节点，浏览器没这么智能，收到第一个更新DOM请求后，并不知道后续还有9次更新操作，因此会马上执行流程，最终执行10次流程。 而通过VNode，同样更新10个DOM节点，虚拟DOM不会立即操作...

promise,是异步操作（读取文件，发起网络请求）的一种解决方案，解决了回调地狱（传统的解决方案）的出现。 1.回调地狱 在异步编程的领域中，回调地狱是一个经常困扰开发者的难题。它的产生源于回调函数的过度嵌套，从而导致代码结构变得错综复杂。当一个回调函数内部嵌套另一个回调函数时，就像是在一个盒子里不断嵌套更小的盒子，层层深入。 例如，假设我们要模拟发送三个异步请求，并且第二个请求依赖于第一个请求结果中的某个特定值作为参数，第三个请求又依赖于第二个请求结果中的某个值作为参数。如果使用传统的回调函数方式，代码可能会呈现出如下的形态： function fn() { setT...

1.生命周期 对于生命周期来说，整体上变化不大，只是大部分生命周期钩子名称上 + “on”，功能上是类似的。不过有一点需要注意，Vue3 在组合式API（Composition API，下面展开）中使用生命周期钩子时需要先引入，而 Vue2 在选项API（Options API）中可以直接调用生命周期钩子。 import { onMounted } from 'vue'; // 使用前需引入生命周期钩子 // 可将不同的逻辑拆开成多个onMounted，依然按顺序执行，不会被覆盖 onMounted(() => { // ... }); Vue2 Vue3 bef...

css单位主要包含以下几种：px，em，rem，vh，vw，vmax，vmin，下面我们主要介绍这几种单位。 1. px px表示像素，属于绝对长度单位，1px=1物理像素。 2. em em是相对长度单位。相对于当前对象内文本的字体尺寸。如当前对行内文本的字体尺寸未被人为设置，则相对于浏览器的默认字体尺寸（1em = 16px）。 为了简化 font-size 的换算，我们需要在css中的 body 选择器中声明font-size= 62.5%，这就使 em 值变为16px * 62.5% = 10px。（就不为16px）. 这样 12px = 1.2em, 10px = 1em, 也就是说...

BFC，全称为Block Formatting Context（块级格式化上下文），是Web页面中的一个独立渲染区域，让处于BFC内部的元素与外部的元素相互隔离，确保内部元素的布局不会被外部元素影响。 1.触发BFC的条件 要创建一个BFC，你可以使用以下任一CSS属性： 1.overflow 不为 visible 2.float 属性不为 none 3.display 为 inline-block、flex、inline-flex、table-cell、grid、flow-root 或 table-caption 4.position 为 absolute 或 fixed 2.BFC的布局规...

在前端中我们主要使用以下方法来实现水平垂直居中 1.单行文本 line-height + text-align .box { width: 400px; height: 200px; line-height: 200px; /* 控制行高（行间距） */ text-align: center; /* 控制文本水平对齐方式 */ } 2.多行文本或盒子 2.1 flex 弹性布局 .container { display: flex; /* 启用 Flex 布局 */ justify-content: center; /* 主轴（默认横向）居中 *...

flex:1 flex 是 flex-grow, flex-shrink, flex-basis. 三个属性的简写，默认值为 0 1 auto。该属性有两个快捷值：auto(1 1 auto) 和 none(0 0 auto)。建议优先写 flex 属性，而不是写三个分离的属性，因为浏览器会自动计算其相关值。 flex-grow 默认为0， 只能是正整数。即父元素有剩余空间也不放大元素。如果为 1，则把剩余空间的一份加给自己的宽度。 flex-shrink 默认为1，只能是正整数。即父元素空间不足则按比例收缩。如果为 0，则不收缩。 flex-basis 默认为 auto, 即元素本身的大小。...

1.Flex容器 任何一个容器都可以被指定为Flex布局，这样容器内部的元素就可以使用Flex进行布局。 采用Flex布局的元素，称为Flex容器（flex container），简称”容器”。 它的所有子元素自动成为容器成员，称为Flex项目（flex item），简称”项目” 2.Flex属性 1.flex-direction: 设置主轴的方向(默认为水平方向，起点在左端) 2.justify-content: 设置主轴上的子元素排列方式 3.flex-wrap: 设置子元素是否换行 4.align-content: 设置侧轴上子元素的排列方式（多行） 5.align-item...

JS的变量提升指的是代码在执行前会将变量提升到作用域的顶部，仅存在var声明变量中。 console.log(num + '件') // undefined var num = 10 只提升生命，不提升赋值。 上段代码类似于 var num; console.log(num + '件') num = 10; 在函数作用域中也同样遵循该规则。 注意 1、let/const声明的变量在未声明即被访问时会报语法错误。 2、变量在var声明之前即被访问，变量的值为undefined。 3、let/const声明的变量不存在变量提升。 4、变量提升出现在相同作用域中。 函数提升 // 1、会把...

ES6新特性 1. 变量声明 let/const let 特性：1. 拥有块级作用域，这意味着在 if 语句、for 循环、while 循环等代码块中声明的 let 变量，只在该代码块内有效。2. 不允许在同一作用域内重复声明同一个变量。 const 特性：1. 也具有块级作用域。2. 声明时必须进行初始化赋值，且赋值后不能再重新赋值修改其值。3. 如果 const 声明的是一个对象或数组，虽然不能重新赋值整个对象或数组，但可以修改对象的属性值或数组的元素值。 2. 箭头函数 箭头函数特性：1. 消除了函数的二义性。2. 简洁的语法。3. 箭头函数不会创建自己的 this 上下文，而是继承外层...