为什么要用TypeScript、函数式组件...

——以下是我在做项目过程中的一些感悟，这种自己悟出来的东西，无论对错，我认为都要比百度出来应付面试官的答案好。

一、为什么要使用TypeScript?

        相信很多前端小伙伴面试的时候经常被问道为什么要使用TypeScript，或者说他能给我们带来什么好处。最开是我被面试官问到的时候，也只是回答了些啊哦额，但是突然有一天我悟了，大师，我真的悟了。

        首先说说我的技术经历吧，一直以来我都是使用的react或者是reactNative框架进行开发。最开始使用类组件，做了几个项目之后，又第一次使用函数式组件，并且加入了TypeScript，但是在实际写代码中觉得比较累赘，所以就没怎么使用到，并且一开始并没有觉得函数式组件要优与类组件什么地方。之后我来到另外一家公司，它们准备用RN 做款产品，由于前端只有我一人，所以也是很有幸使用了一下 create-react-native-app，也是使用类组件。由于全部活都是自己干，所以尽可能的组件化开发（以前都是一个组件就是一个页面，简称“页面化”）。在我封装一些功能性组件的时候，我突然间想写点注释记录这个组件可以传哪些参数，并且是什么类型的值。没错，就在这一刻，这一瞬间，这一刹那，我想到了曾经的累赘“TypeScript”，这个事情似乎它也可以做，而且可以做得更好啊。但是还有另一个第三方库propTypes，它也可以做这个事，以及像Vue自身就有对props的检测。其实在我看来两者大同小异。

propTypes是组件接收props的约束，
typescript类型约束主要是参数传递以及返回值的约束，两个东西侧重点不一样。
typescript 的类型检查是静态的，prop-types 可以在运行时进行检查。
你如你传了个 offsetTop=“abc”，你的编辑器可能会提示你类型有误，但是在浏览器里仍然是可以正常运行的。而如果你使用了 prop-types，在浏览器里就会给出提示。

以上便是我对typeScript的理解，有不对的地方，希望友好讨论

        接下来说说我对类组件和函数式组件的理解吧，也是在使用了类组件和函数式组件开发项目之后。我又在接下来的一个项目中使用了类组件+函数式组件进行开发。在我写页面组件的时候，我会使用类组件，在页面组件中抽离子组件的时候我会使用函数式组件。从最直观的来说，函数式组件会比类组件写起来更简便，或者说看起来更优雅（个人感觉）。还有就是当我们在编写无状态组件的时候，使用函数式组件会更加能体现代码的一个精简，以及代码可读性。当页面是一个类组件时，如果想抽离一个组件，而且就放在这个类组件文件里，我会选择函数式组件。当这个抽离出来的函数式组件有状态时，此时就感觉有点别扭，如果把它独立成一个文件又感觉麻烦，而且别的地方也不会用到。如果是单纯的函数式组件倒还好，但是现在它又有了状态，就感觉一个文件里用了两种方式完成功能，不是为了炫技，就是吃饱了撑的。

1、组件不会被实例化，整体渲染性能得到提升

        因为组件被精简成一个render方法的函数来实现的，由于是无状态组件，所以无状态组件就不会在有组件实例化的过程，无实例化过程也就不需要分配多余的内存，从而性能得到一定的提升。

2、组件不能访问this对象

        无状态组件由于没有实例化过程，所以无法访问组件this中的对象，例如：this.ref、this.state等均不能访问。若想访问就不能使用这种形式来创建组件

3、组件无法访问生命周期的方法

        因为无状态组件是不需要组件生命周期管理和状态管理，所以底层实现这种形式的组件时是不会实现组件的生命周期方法。所以无状态组件是不能参与组件的各个生命周期管理的。

4、无状态组件只能访问输入的props，同样的props会得到同样的渲染结果，不会有副作用
        无状态组件被鼓励在大型项目中尽可能以简单的写法来分割原本庞大的组件，未来React也会这种面向无状态组件在譬如无意义的检查和内存分配领域进行一系列优化，所以只要有可能，尽量使用无状态组件。