Vue3+TypeScript学习笔记： 0前言
1、Vue3带来的变化（源码）
- Vue3带来了新的特性
更好的性能
更小的包体积
更好的TypeScript集成
更优秀的API设计 - 源码通过monorepo的形式来管理源代码
Mono：单个；
Repo：repository仓库；
主要是将许多项目的代码存储在同一个repository中；
这样做的目的是多个包本身相互独立，可以有自己的功能逻辑、单元测试等，同时又在同一个仓库下方便管理；
而且模块划分的更加清晰，可维护性、可扩展性更强；
- 源码使用TypeScript来进行重写
在Vue2.x的时候，Vue使用Flow来进行类型检测；
在Vue3.x的时候，Vue的源码全部使用TypeScript来进行重构，并且Vue本身对TypeScript支持也更好；
2、Vue3带来的变化（性能）
- 使用Proxy进行数据劫持
这种方式存在一个缺陷就是当给对象添加或删除属性时，是无法劫持和监听的；
所以在Vue2.x的时候，不得不提供一些特殊的API，比如$set或$delete，事实上都是一些hack方法，也增加了开发者学习新的API的成本。
- 删除了一些不必要的API
移除了实例上的$on，$off和$once;
移除了一些特性：如filter、内联模板等；
- 包括编译方面的优化
生成Block Tree、Slot编译优化、diff算法优化；
3、Vue3带来的变化（新的API）
- 由Options API到Composition API
在Vue2.x的时候，我们会通过Options API来描述组件对象；
Options API包括data、props、methods、computed、生命周期等等这些选项；
存在比较大的问题是多个逻辑可能是不同的地方：比如created中会使用某一个method来修改data的数据，代码的内聚性非常差；
Composition API可以将先关联的代码放到同一处进行处理，而不需要在多个Options之间寻找；
- Hooks函数增加代码的复用性
在Vue2.x的时候，我们通常通过mixins在多个组件之间共享逻辑；
但是有一个很大缺陷就是mixins也是由一大堆的Options组成的，并且多个mixins会存在命名冲突的问题；
在Vue3.x中，我们可以通过Hook函数，来将一部分独立的逻辑抽取出去，并且它们还可以做到是响应式的；
具体的好处，会在后续的课程中演练和讲解（包括原理）；
4、JavaScript
- 任何可以使用JavaScript来实现的应用最终都会使用JavaScript实现。
- JavaScript不仅能在浏览器端，并且在服务器（Nodejs）也被广泛的应用。
- 甚至是在桌面端（Electron）、移动端（React Native、Weex）。
缺点：
- 比如ES5以及之前的使用的var关键字关于作用域的问题；
- 比如最初JavaScript设计的数组类型并不是连续的内存空间；
- 比如直到今天JavaScript也没有加入类型检测这一机制；
JavaScript正在慢慢变好：
- ES6、7、8等的推出，每次都会让这门语言更加现代、安全、方便；
- JavaScript在类型检测上依然是毫无进展。（即错误出现的越早越好）
JavaScript在最初没有考虑类型约束的问题，容易造成类型思维的缺失；
前端开发人员通常不关心变量或者参数是什么类型的，如果在必须确定类型时，我们往往需要使用各种判断验证；
因此JavaScript不适合开发大型项目，这种宽松的类型约束会带来非常多的安全隐患。
在多人开发时，没有类型约束，往往会增加很多的沟通成本。
针对类型约束，推出flow和TypeScript。
Vue3.x已经全线转向TypeScript，几乎所有的代码都使用TypeScript进行了重构。
5、Vue项目通常需要掌握哪些技术栈？
- Vue3全家福
Vue3核心语法、Vue-Router路由、Vuex状态管理
- Vue3组件库
AntDesignVue、Element-Plus
- 可视化库
ECharts、Three.js、G2、L7等
- TypeScript
实际项目中使用TypeScript
- 其他技术栈
Webpack、Vite，Axios等网络请求库，Less、Sass等CSS预处理器
TP-LINK开奖124人在聊
