Это 18-й день моего участия в августовском испытании обновлений. Узнайте подробности события:Испытание августовского обновления
В стране есть талантливые люди, и они уже сотни лет лидируют.
предисловие
Всем привет, я автор программного самадхи, Yinyi Wang, небольшого фронтенда.
Опубликовано со вчерашнего дня«Все еще сражаешься с «Аяксом»? Тогда это! 》После статьи я получил комментарии от всех, и комментарии были очень внимательными и обстоятельными.
Честно говоря, хотя я стараюсь изо всех сил отвечать на вопросы всех, я все еще не могу избежать двусмысленности понимания некоторых из этих понятий.Мне повезло получить подсказки от коллег, таких как:
Спасибо за ваш щедрый совет, который помог мне немного продвинуться по пути роста.
Теперь, чтобы подвести итог, основные вопросы, связанные с областью комментариев, заключаются в следующем:
- Какая связь между Fetch и Axios/Ajax
- Действительно ли Fetch заменит Ajax?
- Есть ли хорошо упакованная библиотека инструментов Fetch, которую можно порекомендовать?
Чтобы соответствовать всеобщему энтузиазму, я попытаюсь объяснить эти вопросы здесь.Если есть какие-то упущения, пожалуйста, также спросите Haihan!
Концепции и особенности
Во-первых, давайте рассмотрим концепции Ajax, Axios и Fetch.
Ajax
английское полное имяAsynchronous JavaScript + XML, что переводится какАсинхронный JavaScript и XML.
Он используется для описания «нового» подхода, использующего набор существующих технологий, и здесь «новый» подход в основном включает в себя: HTML или XHTML, CSS, JavaScript, DOM, XML, XSLT и, что наиболее важно, XMLHttpRequest.
При использовании модели AJAX, сочетающей эти методы, веб-приложения могут быстро отображать добавочные обновления пользовательского интерфейса без перезагрузки (обновления) всей страницы. Это позволяет программам быстрее реагировать на действия пользователя.
«Аякс» — этоконцептуальная модель, который представляет собой набор многих существующих технологийсобирать, конкретно не относится к технологии.
Наиболее важной особенностью Ajax является то, что он можетЧастично обновить страницу.
Axios
Axios — это библиотека сетевых запросов на основе Promise для Node.js и браузеров. Он изоморфен (то есть один и тот же набор кода может работать как в браузере, так и в Node.js). Он использует собственный http-модуль Node.js на стороне сервера и XMLHttpRequest на стороне клиента.
Здесь мы сосредоточимся только на Axios на стороне клиента, который представляет собой библиотеку инструментов, сформированную путем вторичной инкапсуляции на основе XHR.
Основные особенности клиентской части Axios:
- Создание XMLHttpRequests из браузера
- Обещанная поддержка API
- Перехват запросов и ответов
- Преобразование данных запроса и ответа
- отменить запрос
- Автоматически преобразовывать данные JSON
- Поддержка клиентов для защиты XSRF
Fetch
Fetch предоставляет интерфейс для получения ресурсов (включая междоменные запросы).
Fetch — это современная концепция, эквивалентная XMLHttpRequest. Он предоставляет многие из тех же функций, что и XMLHttpRequest, но предназначен дляБолее масштабируемый и эффективный.
Ядром Fetch являетсяАбстракция HTTP-интерфейса, включая Request, Response, Headers и Body, а также для инициализации асинхронных запросовglobal fetch. Благодаря этим абстрактным модулям HTTP, реализованным с помощью JavaScript, другие интерфейсы могут легко использовать эти функции.
В дополнение к этому Fetch также использует асинхронный характер запросов — он основан на Promise.
fetch() Метод должен принимать один параметр — путь к ресурсу. Независимо от того, успешен запрос или нет, он возвращает объект Promise, а разрешение соответствует ответу запроса.
Связь между Fetch и Axios/Ajax
Благодаря приведенному выше объяснению трех концепций у нас должно быть общее понимание взаимосвязи между ними.Я буду использовать диаграмму, чтобы показать это здесь:
Для изображения выше, позвольте мне объяснить:
- Ajax — это модель (набор технологий), представляющая асинхронный JavaScript + XML, поэтому Fetch также является подмножеством Ajax.
- Раньше мы часто говорили, что Ajax по умолчанию относится к набору технологий, основанных на XHR.После Fetch, Ajax больше не относится только к XHR.Мы называем технологию Ajax, основанную на XHR,Традиционный Аякс.
- Axios — это подмножество традиционного Ajax (XHR), поскольку он представляет собой оболочку XHR.
Действительно ли Fetch заменит Ajax?
Фактически, более точным способом задать этот вопрос должен быть: действительно ли Fetch заменит традиционный Ajax (XHR)?
Чтобы ответить на этот вопрос, мы должны четко понимать следующее:
- Асинхронное программирование — большая тенденция в JavaScript, и большинство браузеров уже поддерживают стандартные промисы.
- Fetch API — это API, поставляемый с браузером и основанный на стандартных промисах.
- Традиционная нативная структура письма Ajax относительно хаотична и не соответствует принципу разделения задач.Студенты, которые написали удаленный XHR, должны иметь глубокое понимание.
- Axios — это библиотека запросов Promise, основанная на пакете XHR, которая очень удобна в использовании.
Исходя из вышеперечисленных пунктов, мое мнение таково.Fetch со временем заменит традиционный Ajax, но процесс может быть длительным.
Хотя в настоящее время традиционные Ajax (такие как Axios и им подобные) используются гораздо чаще, чем Fetch, вы должны знать, что это кумулятивный эффект XHR за более чем десять лет.
Инкапсулированный Axios на тысячу миль опережает нативный XHR по простоте использования, но он все-таки инкапсулированный.По сравнению с нативным Fetch, Axios немного уступает по происхождению, а нативный API естественно будет поддерживать Больше функций будет более гибкий в использовании.
Получить рекомендацию библиотеки инструментов
В области комментариев к вчерашней статье одноклассник порекомендовал библиотеку инструментов Fetch с именемMande, Заинтересованные студенты могут пойти и посмотреть.
Суммировать
Выше приведено простое объяснение проблем с Fetch и Ajax, я надеюсь вдохновить всех.
Лично я жду Fetch на смену традиционному Ajax.Развитие технологий нужно постоянно подпитывать жизненной силой.Я могу это делать десятилетиями,но не хочу,чтобы front-end технологии стояли на месте.Как скучно!
~
~ Конец этой статьи, спасибо за чтение!
~
Получайте интересные знания, встречайте интересных друзей и формируйте интересные души!
Привет всем, я〖Программирование самадхи〗авторКороль-затворник, мой официальный аккаунт "Программирование самадхи』, пожалуйста, обратите внимание, я надеюсь, что вы можете дать мне больше советов!
Вы приходите, с ожиданиями, у меня есть аромат чернил, чтобы приветствовать вас! Вы возвращаетесь, что бы вы ни приобрели или ни потеряли, вы можете отдать это только с осадком!
Подчеркиваются как знания, так и навыки, культивируются внутренние и внешние навыки, должны быть усвоены как теория, так и практика, и обе руки должны быть твердыми!