作为前端，你可能开发过Electron桌面应用，小程序，浏览器上的web应用，基于ReactNative等跨端引擎的应用，基于onNode.js工具或服务等各种应用都是JS的不同运行时，开发也是基于前端技术。面对如此多的细分领域，身为前端工程师的你是否曾经迷茫过：这么多技术到底该学什么？它们之间有什么本质的东西吗？其实所有这些技术，你写的所有代码，都可以分为两个方面：api和抽象。APIs不同的平台提供不同的API和支持能力：浏览器提供domAPI，支持CSS渲染，还提供音视频、webgl等相关API，这些API是我们开发前端应用的基础。Node.js提供了具有操作系统能力的API，比如进程、线程、网络、文件等，这些API是我们开发工具链或者后端应用的基础。ReactNative等跨端引擎支持CSS渲染，同时也提供了设备能力的API，比如camera,flash,sensor,GPS等API，这些API是我们开发移动应用的基础。Electron集成了Chromium和Node.js，也提供了桌面相关的API。除了支持CSS渲染，小程序还提供了一些具有宿主应用能力的API。另外还有很多runtime，比如vscode插件，sketch插件等等，都有自己的API可以使用。不同的JS运行时向上层应用提供不同的API，是应用开发的基础，也是应用开发的能力边界。Abstract基于runtime提供的API，我们可以完成应用的功能开发，但是在复杂的场景下，往往会做一些抽象。比如浏览器上的前端应用，主要是通过domapi和css渲染数据，进行一些交互。然后我们抽象出数据驱动的前端框架，抽象出组件、状态、数据流等概念。之后，可以将不同的需求抽象成不同的组件和状态。经过层层抽象后，在开发复杂的前端应用时，代码更易于维护，成本更低。比如基于Node.js的fs、net、http等API，我们可以实现一个web服务器，但是对于复杂的企业级应用，我们使用后端框架抽象MVC，抽象controller等概念、服务、模型和视图。后续的后端代码可以将需求抽象成不同的控制器和服务。经过MVC的抽象，后端应用的层次更加清晰，更易于维护和扩展。复杂的应用需要在api的基础上做一些抽象。我们经常用框架做一层抽象，然后自己再做一层抽象。经过层层抽象后的代码更易于维护和扩展。这就是所谓的结构。如何深入api和抽象apiAPI是对操作系统能力或不同领域能力的封装。比如Node.js的进程、线程、文件、网络等API，封装了操作系统的能力。如果你想深入了解它们，你需要学习操作系统的一些原理。webgl、audio、video等API分别是对图形、音频、视频领域能力的封装。如果你想深入其中，你必须学习这些领域的一些原理。我个人决定，我们只需要知道api提供了哪些能力即可，没必要太深究api的实现原理。抽象抽象是一种基于编程语言的编程范式，为不同的目标而设计。Javascript提供了面向对象、函数式等编程范式，所以你可以基于对象进行抽象，使用各种面向对象的设计模式，或者使用函数式的。这是抽象的基础。抽象是根据不同的目标进行的。前端领域主要是将dom操作和数据分离，按照功能划分页面，所以mvvm和组件抽象就是按照这些目标来做的。后端领域主要是做分层、解耦等，所以做了IOC、MVC等抽象。可见，抽象是基于编程语言范式，根据需求进行设计。一个好的框架一定是一种抽象，满足某种管理规范的要求。如果你想提高自己的抽象和架构设计能力，可以学习以下面向对象的设计模式，或者函数式编程范式。研究各种框架是如何做抽象的。总结不同的平台提供不同的API，是应用开发的基础和边界。复杂的应用往往需要在API的基础上逐层抽象。一般是用一个框架做一层抽象，再做一层抽象，自己做。目标是让代码划分更清晰，提高可维护性和可扩展性。其实我们写的所有代码都可以分为两个方面：api和抽象。深入的API原理需要深入了解操作系统和各个领域。如果想提高自己的抽象能力，可以学习面向对象的设计模式或者函数式编程范式。无论是在哪个平台上做应用开发，一开始都要先学习API，然后需要了解各种抽象：框架是怎么抽象的，上层做了哪些抽象。API保证下限，抽象可以提高上限。而且，抽象能力或架构能力是可以迁移的，这是程序员最重要的能力之一。
