В качестве внешнего интерфейса вы, возможно, разработали настольные приложения Electron, апплеты, веб-приложения для браузеров, приложения на основе межсетевых движков, таких как React Native, инструменты или службы на основе Node.js и т. д. Все они отличаются от JS. , Время выполнения, разработка также основана на передовых технологиях.
Столкнувшись с таким количеством подразделений, вы когда-нибудь, как фронтенд-инженер, сбивались с толку: что я должен изучать с таким количеством технологий? Есть ли в них вещи первой необходимости?
По сути, все эти технологии, весь написанный вами код можно разделить на два аспекта: API и абстракция.
api
Разные платформы предоставляют разные API и поддерживают разные возможности:
Браузер предоставляет API-интерфейс dom, поддерживает рендеринг css, а также предоставляет связанные API-интерфейсы, такие как аудио и видео, webgl и т. д. Эти API-интерфейсы являются для нас основой для разработки интерфейсных приложений.
Node.js предоставляет API-интерфейсы для возможностей операционной системы, таких как процессы, потоки, сети, файлы и т. д. Эти API-интерфейсы являются основой для нашей цепочки инструментов разработки или серверных приложений.
Кросс-энд движки, такие как React Native, поддерживают рендеринг CSS, а также предоставляют API для возможностей устройств, таких как камера, вспышка, датчик, GPS и другие API, которые являются основой для разработки нашего мобильного приложения.
Electron интегрирует Chromium и Node.js, а также предоставляет API для настольных компьютеров.
Помимо поддержки рендеринга CSS, апплет также предоставляет некоторые API-интерфейсы, в которых размещены возможности приложения.
Кроме того, существует множество сред выполнения, таких как плагины vscode, плагины для скетчей и т. д., у каждого из которых есть свои собственные API, которые можно использовать.
Различные среды выполнения JS предоставляют различные API-интерфейсы для приложений верхнего уровня, что является основой разработки приложений и границей возможностей разработки приложений.
Аннотация
На основе API, предоставляемого средой выполнения, мы можем завершить функциональную разработку приложения, но в сложных сценариях часто выполняются некоторые абстракции.
Например, клиентское приложение в браузере в основном обрабатывает данные через dom API и CSS и осуществляет некоторые взаимодействия, затем мы абстрагируем интерфейсную структуру, управляемую данными, и абстрагируем такие понятия, как компоненты, состояния и потоки данных. После этого различные требования могут быть абстрагированы в разные компоненты и состояния.
После слоев абстракции код легче поддерживать, а стоимость при разработке сложных интерфейсных приложений ниже.
Например, мы можем реализовать веб-сервер на основе API-интерфейсов, таких как fs, net и http, на основе Node.js, но для сложных приложений корпоративного уровня мы абстрагируем концепции контроллеров, служб, моделей и представлений через заднюю часть. -end framework для абстрактного MVC. Затем внутренний код может абстрагировать требования в различные контроллеры и службы.
После абстракции MVC разделение внутренних приложений стало более четким, простым в обслуживании и расширении.
Сложные приложения требуют некоторой абстракции на основе API. Мы часто используем фреймворк для создания уровня абстракции, а затем сами создаем еще один уровень абстракции Код после послойной абстракции легче поддерживать и расширять. Это также называется архитектурой.
Как погрузиться в API и абстракции
api
API — это инкапсуляция возможностей операционной системы или различных возможностей предметной области.
Например, API-интерфейсы процессов, потоков, файлов и сетей Node.js инкапсулируют возможности операционной системы. Если вы хотите вникнуть в них, вы должны изучить некоторые принципы работы операционной системы.
Такие API, как webgl, аудио и видео, соответственно инкапсулируют возможности графики, аудио и видео и др. Если вы хотите углубиться в них, вы должны изучить некоторые принципы в этих областях.
Лично я считаю, что нам нужно знать только, какие возможности предоставляет API, и нет необходимости слишком углубляться в принцип реализации API.
Аннотация
Абстракция — это парадигма программирования, основанная на языке программирования, предназначенном для разных целей.
Javascript предоставляет объектно-ориентированные, функциональные и другие парадигмы программирования, поэтому вы можете абстрагироваться на основе объектов, использовать различные шаблоны объектно-ориентированного проектирования или на основе функциональных. Это основа абстракции.
Абстракция делается в соответствии с разными целями.
Поле дальнего конца, чтобы разделить основные данные и операцию dom, страница делится в зависимости от функции, чтобы сделать это на основе этих целей, чтобы сделать абстракцию и компонент mvvm.
Внутреннее поле в основном предназначено для создания уровней, развязки и т. д., поэтому выполняются такие абстракции, как IOC и MVC.
можно увидеть,Абстракция основана на парадигме языка программирования Дизайн основан на требованиях Хорошая структура должна быть абстрагирована, чтобы соответствовать требованиям определенного кода управления.
Если вы хотите улучшить свои возможности абстрагирования и архитектурного проектирования, вы можете изучить следующие шаблоны объектно-ориентированного проектирования или парадигмы программирования, такие как функциональное программирование. Изучите абстракцию того, как работают различные фреймворки.
Суммировать
Разные платформы предоставляют разные API, которые являются основой и границей разработки приложений. Сложные приложения часто необходимо абстрагировать слой за слоем на основе API.Как правило, для создания слоя абстракции используется фреймворк, а еще один уровень абстракции создается сам по себе.Цель состоит в том, чтобы сделать разделение кода более четким и улучшить ремонтопригодность и масштабируемость.
По сути, весь написанный нами код можно разделить на два аспекта: API и абстракция.
Глубокие принципы API требуют глубоких знаний операционных систем и различных областей. Чтобы улучшить способность к абстракции, вы можете изучить шаблоны объектно-ориентированного проектирования или парадигмы функционального программирования.
Независимо от того, на какой платформе вы делаете разработку приложений, вы должны сначала изучить API в начале, а затем вы должны понимать различные абстракции: как абстрагируется фреймворк, и какие абстракции делает верхний уровень.
API гарантирует нижнюю границу, а абстракция может повысить верхнюю границу. Более того, способность к абстракции или архитектуре может быть перенесена, что является одной из самых важных способностей программистов.