Использование мощи абстрактных синтаксических деревьев Джамунда Фергюсона

Многие из нас пришли в JavaScript, не имея серьёзного опыта в области компьютерных наук. Вы когда-нибудь испытывали страх, когда кто-то начинал говорить об алгоритмах? Оказывается, при разработке веб-сайтов нам нечасто приходится обращаться к этим концепциям для достижения успеха. Тем не менее, последние несколько лет определённо научили меня, что компьютерные науки могут многое предложить UI-программистам. От внедрения зависимостей в Angular до мира React с его неизменяемыми объектами и методами сравнения DOM-объектов, оказывается, компьютерные науки могут многому научить UI-разработчиков. Одна из концепций, оказавшая наибольшее влияние на инструментарий JS за последние несколько лет, — это абстрактное синтаксическое дерево.

Абстрактные синтаксические деревья повсюду. Они обеспечивают работу JS в ваших браузерах. Они используются в ваших минификаторах. Они используются в ваших линтерах. Они обеспечивают работу Webpack, Browserify, Babel и многих других инструментов, составляющих современный веб-стек. И вы, вероятно, никогда раньше о них не слышали.

Позвольте мне показать вам, как работают абстрактные синтаксические деревья.

Мы рассмотрим несколько простых примеров линтеров и пользовательских загрузчиков Webpack и поможем вам представить себе мощь, которую деревья могут привнести в ваши программы, чтобы вы могли воспользоваться их потенциалом. В ESLint каждое правило передаётся в виде абстрактного синтаксического дерева, которое затем анализируется в поисках ошибок. Дерево — это своего рода гигантский литерал объекта JavaScript, представляющий вашу программу. Используя такие инструменты, как Esprima и Acorn, мы можем преобразовать код в AST, преобразовать его, а затем снова преобразовать в код.

Присоединяйтесь ко мне в увлекательном путешествии по кроличьей норе AST, и вы больше никогда не будете программировать по-старому.

О Джамунде Фергюсоне:

Привет, я Джамунд. Я работаю инженером пользовательского интерфейса в PayPal.

Github: xjamundx

Twitter: @xjamundx