# 前言
大家好呀！作为一名习惯于Vue的前端，国庆后正式走入了去往React阵营的道路。经历了金九银十和十一长假后的我也要开始努力写文章了，开篇主要是分享下我是如何横切到React技术栈。如果看文章的你正在学习React或者说也是转换技术栈希望我的文章能给你带来一点启发和帮助。
为什么换React
为什么换React呢，是因为新公司是属于React技术栈。包括antD，Umi，hooks等一系列的解决方案。在技术栈方向上进行了更换，因此，在这个9月，我成为了一名Reacter。虽然之前接触过react，但是技术的更新迭代是日新月异的，因此决定从基础出发，重新再刷一遍。
# React现在的前置技能TypeScript
- TypeScript 中的类型注释和类型推断
在Vue中自由飞翔惯了的我，一进入react的世界有点懵。到处是各种类型注释，不然就报错页面一片红色，下面我们简单了解一下·····
let count: number;
count = 555;
这段代码就是类型注解，意思是显示的告诉代码，我们的count 变量就是一个数字类型，这就叫做类型注解。是不是一下就明白了。
再感受下
let count = 123;
这时候我并没有直白的告诉你变量count是一个数字类型，但是如果你把鼠标放到变量上时，你会发现 TypeScript 自动把变量注释为了number类型，也就是说它是有某种推断能力的，通过你的代码 TS 会自动的去尝试分析变量的类型。
2. TypeScript 函数参数和返回类型定义
经过上面的类型注释和类型推断，就能明白函数参数和返回类型定义的意义了，首先我们从一个函数来直观的看一下
function getTotal(one: number, two: number) {
return one + two;
}
const total = getTotal(1, 2);
这时候我们写的代码并没有定义getTotal的返回值类型，虽然TypeScript可以自己推断出返回值是number类型。 但是如果这时候我们的代码写错了，比如写程了下面这个样子。
function getTotal(one: number, two: number) {
return one + two + "";
}
const total = getTotal(1, 2);
这时候total的值就不是number类型了，但是不会报错。这个时候有的朋友就会想到去定义total，但是如果代码是上面的样子是很难找到错误的，因为是函数getTotal()出了错误。这时还是要从根本解决问题
return one + two;
}
const total = getTotal(1, 2);
自由飞翔的日子不在了，但是发现了一点好处，就是代码一旦出现错误，原因也是相对好找了许多。最多的基础视频和学习还是来自技术胖的教程。时间无多，去努力学习了，后面会一步一个脚印的记录自己学习的情况！
