author__avatar

Виталий Ртищев

Работаю Frontend-разработчиком в Phobos, создаю приложения на React, усердно тружусь над проектом Frontend Raccoon

Метод функций bind своими руками

10 Мая 2016

Разбираемся, как работает метод функций bind, как происходит привязка контекста и строим свой аналог на основе метода apply

React на практике: приложение с сортировкой и поиском данных

15 Апреля 2016

В первом выпуске React Challenge я предложил вам построить небольшое приложение на React, чтобы вы смогли прощупать библиотеку на более сложном проекте, чем, например, TODOList. Для выполнения челенджа у вас был небольшой стартовый шаблон, который отвечал за компилирование JavaScript и Sass, а также за генерирование случайных данных для приложения. Всего в первом челендже по официальным данным (количество форков на Github) приняло участие более 150 человек и многие даже довели дело до конца. Настало время во всём разобраться и подвести итоги.

ES6 классы

9 Апреля 2016

Нет, ничего не изменилось, прототипы никуда не ушли, а классы лишь приятная обёртка над прототипным наследованием. В классическом понимании классов в JavaScript никогда не существовало и не будет существовать никогда. Многие разработчики, особенно те, которые решили познать мир JavaScript после изучения другого языка программирования, не понимают (или не хотят понять) разницы между классическим и прототипным наследованием, в результате чего они буквально отказываются полностью использовать самый мощный инструмент, которым только может вооружиться JavaScript-разработчик. Поэтому данная статья, в первую очередь, призвана объяснить, почему классы, появившиеся в новом стандарте языка, не то, чем кажутся на первый взгляд.

Добро пожаловать в мир React

4 Апреля 2016

Сейчас вы на каждом шагу вы слышите: "React! Виртуальный DOM! Компоненты!". Настало время внести ясность, что это такое, как с этим жить и работать.

React Challenge #1: сортировка и поиск

18 Марта 2016

В первом выпуске React Challenge я предлагаю вам прощупать React и, в целом, составить для себя какое-то представление о том, что это вообще такое. В этом челендже будем разрабатывать достаточно простое приложение для поиска и сортировки данных.

React Challenge: анонс

18 Марта 2016

Учить новую технологию всегда непросто. Ещё сложнее сделать это одному, когда нет возможности спросить совета у более опытных разработчиков или своих "товарищей по несчастью". React Challenge призван объединить всех желающих научиться использовать React и помочь освоить библиотеку на более сложных и интересных примерах, чем Hello, World! или TODOList.

Продвинутое использование метода reduce

8 Марта 2016

Метод массивов reduce не похож на другие перебирающие методы массивов: результатом его выполнения может быть значение любого типа данных, которое задаёте сами. Именно такая особенность может сделать reduce чрезвычайно мощным инструментом в руках опытного разработчика.

Объектно-ориентированный JavaScript: дескрипторы

4 Марта 2016

Над каждым свойством любого объекта в JavaScript можно провести определённый набор манипуляций. Свойство можно записать, изменить, получить значение, а с помощью цикла for .. in или метода Object.keys перечислить все свойства объекта. Вполне стандартный набор операций для работы с объектами, к которому вы, скорее всего, уже привыкли. До релиза стандарта ES5 все эти "качества" объекта изменить было невозможно, но теперь для каждого свойства можно детально описать модель его поведения с помощью дескрипторов.

Объектно-ориентированный JavaScript: наследование на практике

2 Марта 2016

В одной из прошлых статей мы подробно рассмотрели процесс создания библиотеки для валидации данных, полученных из поля ввода. Библиотека хорошо работает и справляется со своей задачей. Тем не менее, если оценить библиотеку в более глобальном масштабе, то можно заметить, что она состоит из двух частей: валидации данных и коммуникации с DOM. В этой статье разберём процесс создания конструктора-родителя, который будет отвечать только за валидацию переданных ему данных, после чего напишем дочерний конструктор, который будет заниматься "грязной" работой: получать данные от DOM элементов, писать сообщения и запускать callback функции.

Дайджест лучших материалов за февраль

27 Февраля 2016

Дайджест лучших материалов из группы за второй месяц 2016 года

Объектно-ориентированный JavaScript: наследование

25 Февраля 2016

Наследование в JavaScript постоянно подвергается критике. Что, на самом деле, не удивительно — люди, привыкшие к понятию "класс", обычно просто не могут сходу понять, какой мощный инструмент попал в их руки и пытаются применить свои знания о классовом наследвании в JavaScript. В результате разработчик остаётся недоволен — большая часть его паттернов не вписывается в прототипное наследование. Данная статья призвана объяснить, как работает прототипное наследование, чтобы ваш опыт использования JavaScript не испортился "классовыми" заблуждениями.

Объектно-ориентированный JavaScript: немного практики

10 Февраля 2016

Настало время применить все ваши навыки объектно-ориентированного JavaScript и создать небольшую библиотеку. Библиотека предназначена для валидации данных из одного поля ввода, содержит несколько простых встроенных методов для простых манипуляций с данными и небольшой строковый шаблонизатор для вывода понятных сообщений.

Объектно-ориентированный JavaScript: прототипы

7 Февраля 2016

Понимание принципов работы прототипного наследования очень важно для любого JavaScript разработчика. В этой статье расскажем, как создавать методы и свойства, которые будут доступны всем объектам, созданным с помощью одной функции-конструктора.

Объектно-ориентированный JavaScript: функции конструкторы

6 Февраля 2016

Итак, вам нужно создать десяток объектов с одинаковыми свойствами и методами. Как раз для этого есть функции конструкторы, которые позволят не переписывать код для каждого объекта и в значительной степени помогут сэкономить ресурсы.

Виселица

6 Февраля 2016

Напишите игру "виселица"

Объектно-ориентированный JavaScript: работа с объектами

5 Февраля 2016

В прошлой статье мы выяснили, что не всё в JavaScript является объектом, и все данные разделяются на примитивы и объекты. В этой статье рассмотрим способы создания объектов, что такое методы, свойства, как их присваивать, способы итерации по всем свойствам объектов и использование ключевого слова this.

Объектно-ориентированный JavaScript: примитивы и объекты

4 Февраля 2016

Скорее всего, вы читали или слышали, что всё в JavaScript является объектом. Ещё чаще можно увидеть опровержения этого утверждения. Подобные споры возникают регулярно и обусловлены в большей степени недопониманием концепций JavaScript. И, на самом деле, причина считать примитивы объектами есть — примитивы имеют свойства и методы, поведение которых во многом схоже со свойствами и методами объектов. В статье рассмотрим, чем примитивы, на самом деле, отличаются от объектов и почему это так важно.

Что за треугольник?

2 Февраля 2016

Всего существует 3 вида треугольников: остроугольные, прямоугольные и тупоугольные. В задаче требуется написать функцию, которая будет тестировать треугольники и сообщать, к какому виду они относятся.

Перебирающие методы массивов изнутри

1 Февраля 2016

forEach, map, filter, some, every и reduce являются ключевыми методами массивов в JavaScript, так как большая часть данных, например приходящая с сервера, в JSON формате подразумевает их использование для удобной фильтрации и преобразований. В статье будет рассмотрено применение каждого метода, а также рассмотрены способы их реализации в виде функций.

Дайджест лучших материалов за январь

29 Января 2016

Дайджест лучших материалов из группы за первый месяц 2016 года.

Измерение производительности блоков кода

28 Января 2016

Измерять производительность блоков кода очень просто с помощью инструментов разработчика и функций console.time() и console.timeEnd().

Пара двойников

28 Января 2016

В задаче напишем функцию, возвращающую переданное число, увеличенное вдвое. Если же переданное число состоит из двойников, функция вернет исходное число.

ES6: Расширение литерала объектов

28 Января 2016

Краткие формы записи свойств и методов объектов немного сократят код и сделают его немного более читабельным относительно аналогичного кода в ES5. Тем не менее новые краткие формы записи накладывают некоторые ограчения при работе с рекурсией и передаче методов объекта в качестве callback функции.

ES6: Цикл for .. of

24 Января 2016

Цикл for .. of во многом похож на метод массивов forEach, но имеет ряд преимуществ над ним. С появлением нового вида циклов отпадает необходимость использовать конструкцию [].forEach.call(elements, function(){}) для итераций по коллекции DOM элементов.

Простой chaining

22 Января 2016

Chaining — приём, при котором после вызова каждого метода возвращается исходный объект, таким образом, появляется возможность выполнять несколько методов последовательно, а не вызывать их по отдельности. На его использовании построены методы многих библиотек, например, jQuery.

ES6: Стрелочные функции

22 Января 2016

Стрелочные функции не просто "синтаксический сахар", как это может показаться на первый взгляд. Главная причина их появления в ES6 — недопонимание, которое возникает у большинства разработчиков при работе с ключевым словом this. С релизом нового стандарта отпадает необходимость писать var self = this при использовании колбэков, что в значительной степени упрощает чтение кода и понимание происходящего.

Найди анаграммы

21 Января 2016

Анаграммы — слова, которые получаются при перестановке букв или звуков местами в исходном слове. Например, апельсин и спаниель, старорежимность и нерасторжимость, равновесие и своенравие. В задаче напишем функцию для проверки являются ли два переданных ей слова анаграммами или нет.

Проверка нахождения значения в массиве

21 Января 2016

До релиза ES2016 ещё долго, а, значит, и метод массивов Array.prototype.includes использовать можно будет ещё не скоро. Сейчас же можно немного сократить свой код, используя побитовый оператор ~.

Передача аргументов в колбэки

19 Января 2016

По умолчанию в callback-функцию нельзя передавать аргументы, что в некоторых случаях приводит к очень неприятным проблемам. В статье расскажем, как обойти это ограничение.

Стилизация плэйсхолдеров

18 Января 2016

Применение стилей к тексту плэйсхолдеров не самое лёгкое занятие. Необходимо учитывать все префиксы для разных браузеров, в результате чего приходится писать достаточно объемное количество кода. К счастью CSS препроцессоры значительно облегчат его создание. В статье рассмотрим основы применения стилей к плэйсхолдерам, принципы их анимации, а также напишем небольшую библиотеку миксинов на Sass, которая значительно упростит работу с плэйсхолдерами.

ES6: Интерполяция

18 Января 2016

С выходом стандарта ES6 появилась возможность использовать строковую шаблонизацию. Новый вид строк, создаваемый с помощью символов ` поддерживает интерполяцию переменных и любых логических выражений.

ES6: Перед тем, как вы начнёте

28 Декабря 2015

Перед изучением нового стандарта ES6 необходимо помнить, что многие нововведения базируются на прошлом стандарте ES5. Для полного понимания многих новых конструкций и особенностей синтаксиса ES6 необходимо знание основ JavaScript. В статье вы найдете подборку книг и несколько воспросов для проверки своей готовности изучения нового стандарта.