JavaScript – это замечательный язык. Это постоянно развивается, добавляя новые функции и функциональности. Тем не менее, это может быть вызова, чтобы выяснить, можно ли использовать определенный кусок синтаксиса. В зависимости от вашего проекта есть различные факторы для игры. Так что давайте поговорим об этом!
Новый синтаксис
let thing = obj?.node?.thing ?? 2
Пример выше использует два совершенно новых куска синтаксиса JavaScript. Дополнительные цепочки , обозначенный как Вспомогательный , а также Nullish Coalescing , ?? . Предположим, вы хотели использовать эту строку кода в вашем проекте. Что бы вам нужно сделать? Какую часть Tech Stack даже определяет, что является действительным JavaScript?
Ecmascript
Чтобы ответить на вышеуказанные вопросы, мы должны начать в начале. JavaScript основан на стандарте для языков сценариев, называемых Ecmascript. Сама стандарта постоянно меняется и добавляет новые функции. Этот процесс контролируется комитетом под названием TC39 Отказ
Предложения по дополнениям могут быть сделаны любым членом сообщества JavaScript. Как они оцениваются для включения, они проходят Многочисленные этапы Отказ Для этого есть сложности, но в целом предложения проходят через стадию 1, этап 2 и этап 3. Стадия 3 Предложения должны иметь реализацию в Вавиле – мы доберемся до этого в ближайшее время.
Последний этап – это этап 4. Вот где в настоящее время необязательные цепи и нулевые коалишские колюссы сейчас. Предложения на этом этапе считаются принятыми! Они являются частью динамической версии Ecmascript, называемой esnext. ESNext включает в себя функции, которые устанавливаются частью следующего выпуска. Релизы Ecmascript встречаются ежегодно и включают все предложения по стадии 4 из предыдущего года. Например, ES2019 был выпущен в июне 2018 года.
Тем не менее, функция достижения этапа 4, не обязательно означает, что вы можете использовать его. Если вы хотите включить синтаксис кровотечения-края, вы хотите понять, как стандарт ECMAScript будет принят и поддерживается.
Варить
Ваш лучший шанс в том, чтобы иметь возможность использовать совершенно новый этап 4 предложения (или даже более раннее этап, если вы хотите предоставить отзыв) – включить Бабел Плагин в вашем проекте. Почему Бабел?
Babel – транспортер для JavaScript. Это позволяет писать JavaScript с помощью современного синтаксиса, а затем компилируйте этот код в «старший» JavaScript; Таким образом, он может работать в ситуациях, когда этот современный синтаксис еще не поддерживается.
Babel можно бежать самостоятельно, но это часто в комплекте с инструментами, такими как WebPack. При создании вашего проекта JavaScript вывод по-прежнему JavaScript. Хотя это часто значительно менее читаемо, чем раньше, в зависимости от того, как выглядит ваш процесс сборки. Мы предположим, ради этого поста мы говорим о сборке производства.
Следующим шагом является запустить этот встроенный JavaScript где-то. Что-то считается вашей целевой средой.
JavaScript везде
Мы часто шутим, что JavaScript везде, но это правда. При создании проекта JavaScript вы не всегда знаете, куда он будет работать. Вместо этого вы сосредоточены на минимальной версии целевой среды, которую вы собираетесь поддержать. Но что считается целевой средой?
JavaScript работает в браузерах. Существуют браузеры на рабочем столе и мобильных устройствах, поэтому все это являются потенциальными целевыми средами. JavaScript также может запустить сторону сервера при использовании узла. Знание вашей целевой среды на стороне сервера, скорее всего, чем уверенность, все ваши пользователи будут использовать определенную версию браузера. Тем не менее, ваша целевая среда влияет на то, какие функции Ecmascript вы можете использовать, будь то на стороне сервера или на стороне клиента.
Двигатели JavaScript
JavaScript работает с использованием компилятора только что вовремя. Это двигатель, который компилирует и интерпретирует код. Как получается, все двигатели JavaScript создаются для соответствия стандарту ECMAScript. Двигатель переводит действительный JavaScript (как определено стандартом) для действительного машинного кода.
Поскольку каждый двигатель написан для сопоставления стандарта ECMAScript, сам двигатель определяет, какой синтаксис вы можете использовать в вашем проекте. И каждая целевая среда имеет свой собственный двигатель! В каком браузере ваш пользователь на вашем сайте? Какой двигатель в этом браузере? Поддерживает ли этот двигатель синтаксис, который вы пытаетесь использовать в вашем коде?
Совместимость
Таким образом, мы знаем, что двигатели JavaScript написаны для поддержки стандарта ECMAScript. И в результате эти двигатели являются окончательным арбитром, работает ли данный кусок синтаксиса. Но мы также знаем, что стандарт постоянно развивается. Итак, как вы знаете, является ли двигатель, который вы нацеливаете, включил эту функцию, которую вы пытаетесь использовать?
Есть несколько проектов по всей сети, посвященные обновлению Таблица совместимости Отказ Эти таблицы отслеживают доступные компиляторы/полифилки, браузеры и версии узла и соответствуют функциям Ecmascript, чтобы отметить, поддерживаются ли они.
Есть также отличные сайты, такие как https://caniuse.com/
«Версии»
Столбцы со совместимости настольный кластер различных типов технологий вместе. Браузеры (мы будем объединять мобильный и рабочий стол), компиляторы/многобилины и сервер/во время выполнения JavaScript.
Браузеры периодически отпускают обновления и прикрепите номера версий. Таблица совместимости учитывает самые последние и популярные стабильные выпуски и отмечает, является ли внутренний JavaScript Engine поддерживает определенный стандарт Ecmascript (и связанный синтаксис). Мобильные устройства браузеров также включены.
Раздел Compilers/Polyfills включает в себя горсть разных технологий. Обратите внимание, что колонны Babel и Teadercript включают Core-JS номера версий. Это относится к библиотеке, которая обеспечивает JavaScript Polyfills. Хотя Babel транспортирует большую часть существующего синтаксиса, есть некоторые вещи, которые просто отсутствуют, как новые ключевые слова или носовые ноты. Вот почему Core-JS версия отмечена.
Обратите внимание, что @ Babel/Polyfill существует и использует Core-JS под капотом. Тем не менее, он был устарел в пользу использования Core-JS напрямую.
Последний набор столбцов в таблице относится к JavaScript Server/Runtime. Я сосредоточусь на Узел здесь. Узел включает в себя ряд вещей, которые позволяют JavaScript запускать Server-Side, а один из них является двигателем JavaScript. В этом случае он использует двигатель V8. На самом деле это тот же двигатель, на котором работает браузер Chrome. Узел сам имеет версии. Каждая версия соединилась с двигателем V8, и в зависимости от того, какой стандарт ECMAScript в том, что версия V8 обновляется с определением того, какой синтаксис действительный JavaScript.
Поддержка приложения JavaScript
Часть того, что прекрасно относится к JavaScript, состоит в том, что есть много способов написать его и увидеть его в действии прямо сейчас. Но, как получается, производство JavaScript включает гораздо больше под капотом.
Было бы невероятно сложно написать код с использованием синтаксиса, который был совместим с самым низким общим целевой средой знаменателя. Если это был порог, то мы не сможем использовать необязательные цепочки в течение многих лет, пока все браузеры используются не поддерживаются. Или мы ограничили нашим пользователям только на самые последние телефоны и/или обновления браузера. Как вы можете подозревать, разработчики не хотят этого делать.
Производственные приложения Задайте вопрос совместимости в созданном JavaScript. Включенный синтаксис совместим с двигателями внутри нашей минимальной целевой среды? Вот почему проекты используют транспортировщики, такие как Babel. Создать JavaScript, совместимый через старые браузеры. Так что вы можете использовать необязательный цепочек, даже если Internet Explorer еще не поддерживает его или никогда.
Вы можете разработать удивительные проекты JavaScript, не зная много этой информации. Но если вам интересно, как сталкиваются новые функции, или хотите найти способ поддержки чего-либо на кровотечении в вашем проекте, приятно понимать эти детали.
Оригинал: “https://dev.to/laurieontech/the-ecmascript-ecosystem-2e13”