vue3、组合式api的原因、

vue2与vue3的区别

• vue3的Template 支持多个根标签，vue2不支持

• vue3 用 createApp(),而 vue2用的是 new Vue()

• context.emit
  – 新增的 context.emit 与 this.$emit 作用相同

• vue3中的属性绑定:默认所有属性都绑定到根元素 使用 inheritAttrs:false 可以取消默认绑定；使用attrs或者context.attrs 获取所有属性；使用v-bind=“$attrs” 批量绑定属性；使用 const {size,level,…rest} = context.attrs 将属性分开

vue3中使用组合式api的原因

• 让组件拥有了更加良好的代码组织结构
• 让相同的代码逻辑在不同的组件中进行了完整的复用

跨组件传值

• props + emit
• vuex
• provide和inject的注入方法

组合式API有哪些

• ref()
• reactive()
• watch()
• 生命周期()
• computed()

watchEffect 用来代替生命周期里的onMounted和onUpdated

• 初始化页面的时候watchEffect里的代码会执行，当watchEffect里的数据有更新的时候同样会执行

const count = ref(0)
watchEffect(()=>console.log(count.value))
setTimeout(()=>{count.value++},100)

• 注意watchEffect第一次运行是在组件挂载之前，如果需要访问DOM需要将我们的watchEffect放在onMounted里

onMounted(()=>{
 watchEffect(()=>console.log(count.value))
})

vite和webpack的区别：

• 前者是按需加载，优势在开发环境，启动是不打包，不需要编译，速度快。
• 后者是全部加载，在启动开发服务器时会先打包再启动开发服务器。

vite创建vue项目和vue-cli创建项目的区别:

• vite是web开发构建工具
• vue-cli是官方的vue.js项目脚手架

git reset、git revert和git checkout有什么区别？

• git reset 将文件从缓存区中移除(文件层面)
• git revert 在公共分支上回滚更改(文件层面)
• git checkout 切换分支或查看旧版本(提交层面)

提交层面的操作

• reset将一个分支的末端指向另一个提交。例如回退了两个提交 git reset HEAD~2
• revert撤销一个提交的同时会创建一个新的提交、它不会改变现在的提交历史
• 可以把git revert当作撤销``已经提交的更改，而git reset HEAD用来撤销``没有提交的更改。

git pull 和 git fetch

• pull 是从远程获取最新版本并merge到本地
• fetch 是从远程获取最新版本到本地，不会自动merge
• git pull 是 git fetch + git merge

如何在Git 恢复先前的提交?

• 要撤销提交但保留更改
• git reset +当前文件
• git status 检测更改
• 要修改(提交中的更改)
• git reset --hard + 当前文件名 如果使用了 --hard,文件将重置到提交时的状态
• 撤销提交但保留文件和索引
• git reset --soft +文件名

使用箭头函数应注意什么？

• 用了箭头函数，this就不是指向window，而是父级（指向是可变的）
• 不能够使用arguments对象
• 不能用作构造函数，这就是说不能够使用new命令，否则会抛出一个错误
• 不可以使用yield命令，因此箭头函数不能用作 Generator 函数

Set、Map的区别？

应用场景：Set用于数据重组，Map用于数据储存

• Set
• 成员不能重复
• 只有键值没有键名，类似数组
• 可以遍历，方法有add、delete、has
• Map
• 本质上是键值对的集合，类似集合
• 可以遍历，可以跟各种数据格式转换

Promise构造函数是同步执行还是异步执行，then方法呢

• Promise构造函数是同步执行的，then方法是异步执行的

setTimeout、Promise、Async/Await的区别

####### 事件循环中分为宏任务队列和微任务队列

• 其中setTimeout的回调函数放到宏任务队列里，等到执行栈清空以后执行。
• promise.then里的回调函数会放到相应宏任务的微任务队列里，等宏任务里面的同步代码执行完再执行。
• async函数表示函数里面可能会有异步方法，await后面跟一个表达式。async方法执行时，遇到await会立即执行表达式，然后把表达式后面的代码放到微任务队列里，让出执行栈让同步代码先执行。

输出结果

const promise = new Promise((res,rej)=>{
	console.log(1);
	res();
	console.log(2)
})
promise.then(()=>{
	console.log(3);
})
console.log(4);
// 1243

var 、let、const

• var声明变量可以重复声明，而let不可以重复声明
• var是不受限于块级的，而let是受限于块级
• var会与window相映射（会挂一个属性），而let不与window相映射
• var可以在声明的上面访问变量，而let有暂存死区，在声明的上面访问变量会报错
• const声明之后必须赋值，否则会报错
• const定义不可变的量，改变了就会报错
• const和let一样不会与window相映射、支持块级作用域、在声明的上面访问变量会报错

get和post的区别

• 二者在HTTP中都代表着请求数据，其中get请求相对来说简单、快速、效率高、相对post安全性低、
• get 有缓存(保留历史记录)、post没有
• 体积大小不同 前者体积小
• url参数可见与不可见
• get只接收ASCII字符的参数数据类型，post没有限制
• get会被浏览器主动catch
• 回退时get 无害 post会再次提交请求

post使用场景：一般用于修改服务器上的资源，对所发送的信息没有限制。例如：

• 1、无法使用缓存文件（更新服务器上的文件或数据库）
• 2、向服务器发送大量数据（POST 没有数据量限制）
• 3、发送包含未知字符的用户输入时，POST 比 GET 更稳定也更可靠

对ES6的理解

• let 和 const(不存在变量提升,暂时性死区,不允许重复声明, 块级作用域)
• 结构赋值（数组，对象，字符串）let [a, b, c] = [1, 2, 3];
• Number数字类型扩展

// 1. 数值分隔符
let budget = 1_000_000_000_000;
budget === 10 ** 12 // true

// 2. Number.isFinite()用来检查一个数值是否为有限的（finite）
Number.isFinite(15); // true
Number.isFinite(0.8); // true
Number.isFinite(NaN); // false
Number.isFinite(Infinity); // false

// 3. 参数类型不是NaN，Number.isNaN一律返回false
Number.isNaN(NaN) // true
Number.isNaN("NaN") // false
Number.isNaN(1) // false

• Function 函数类型扩展

// ES6 引入 rest 参数（形式为...变量名），用于获取函数的多余参数，这样就不需要使用arguments对象了
function add(...values){
	let sum = 0;
	for(var val of values){
		sum += val;	
	}
	return sum
}
add(6,8,10)

• Array 数组类型扩展

// 1.扩展运算符
console.log(...[1,2,3]);
// 2.Array.from 方法用于将两类对象转为真正的数组；
// 类似数组的对象 可遍历的对象
let arrayLike = {
	'':'','':'','':''
};
let arr = Array.from(arrayLike);
// Array.of()方法用于将一组值，转换为数组
Array.of(1,2,3)

Set 和Map

• 模板字符串 `` 为js提供了 字符串插值功能
• ES6 提供了新的数据结构 Set。它类似于数组，但是成员的值都是唯一的，没有重复的值
• ES6 提供了 Map 数据结构。它类似于对象，也是键值对的集合，但是“键”的范围不限于字符串，各种类型的值（包括对象）都可以当作键
• Proxy 可以理解成，在目标对象之前架设一层“拦截”，外界对该对象的访问，都必须先通过这层拦截，因此提供了一种机制，可以对外界的访问进行过滤和改写
• Promise (promise.all、promise.race)
• class 语法糖 让对象原型的写法更加清晰、更像面向对象编程的语法而已
• 模块化 (import、export)
• Symbol,表示独一无二的值。ES5的对象属性名称都是字符串，symbol保证每个属性的名字都是唯一的，可以从根本上防止属性名的冲突。
• for-of(遍历数据-例如数组中的值)

setTimeout、Promise、Async/Await

事件循环：宏认为队列和微任务队列

• 其中setTimeout的回调函数放到宏任务队列里，等到执行栈清空以后执行。