Обновить
256K+

JavaScript *

Прототипно-ориентированный язык программирования

248,48
Рейтинг
Сначала показывать
Порог рейтинга
Уровень сложности

«Банда четырёх» была неправа, а вы не знаете, что такое делегирование

Время на прочтение6 мин
Охват и читатели73K
«Банда четырёх» была неправа, стандартная библиотека Ruby тоже ошибочна, и Rails – также. Но является ли нечто неправильным, если все так делают?

Да.

Книга «Банды четырёх» "Шаблоны проектирования" даёт нам общий словарь для понимания базовых шаблонов ООП. Она помогает нам использовать одинаковую терминологию при обсуждении софта. К сожалению, она же является причиной путаницы.

Они говорят: «композиция прежде наследования». Отлично, в этом есть смысл. Они говорят: «используйте делегирование». Отлично. Хотя в книге нет ни единого примера делегирования.

Делегирование – это приём, которому приписывают возможность внесения гибкости в программы. Обычно говорят, что делегирование – это способ достичь композиции. Но делегирование – это не то, что вы думаете, и «Банда четырёх» ввела вас в заблуждение. Хуже того, почти все упоминания о делегировании содержат лишь совместную работу объектов с пересылкой (forwarding) сообщений. Это примеры вызовов методов, а не делегирования.

Наверняка ваш учитель программирования сказал бы вам, что вам необходимо хорошо понимать основные концепции в программировании. И понимать их правильно.
Читать дальше →

Konami code или читайте между строк

Время на прочтение5 мин
Охват и читатели64K

История Konami Code


Еще в 1986 году японская компания Konami – один из ведущих разработчиков и издателей видеоигр – запрограммировала секретную комбинацию клавиш в версии игры Gradius для игровой консоли NES.



Однако настоящую популярность данная комбинация клавиш получила благодаря американской версии игры Contra (как «код на 30 жизней»).



В разных играх этот код имеет разное предназначение:
  • Увеличение количества попыток
  • Полное вооружение в начале игры
  • Добавление жизней
  • Прочее

Дальше больше

Удобная вставка многострочных шаблонных литералов в код на JavaScript

Время на прочтение4 мин
Охват и читатели18K

Описание проблемы


Появившиеся в ES6 шаблонные литералы (или шаблонные строки — template literals, template strings) помимо долгожданной интерполяции переменных и выражений принесли возможность вставки многострочного текста без дополнительных ухищрений, усложняющих вид кода.

Однако то, что красиво смотрится в разнообразных примерах на эту тему, в реальном коде порой облекается в новый вид безобразия.

Впрочем, проблемы видны, даже если присмотреться к примерам. Возьмём замечательную статью об этом нововведении из известной серии «ES6 In Depth».

Видите досадные «оспинки»? Лёгкие перекосы в симметрии и стройности?

Маленький пример
var text = (
`foo
bar
baz`)

Большой пример
var html = `<article>
  <header>
    <h1>${title}</h1>
  </header>
  <section>
    <div>${teaser}</div>
    <div>${body}</div>
  </section>
  <footer>
    <ul>
      ${tags.map(tag => `<li>${tag}</li>`).join('\n      ')}
    </ul>
  </footer>
</article>`

Возьмём какой-нибудь простой случай и посмотрим на проблемы внимательнее.
Читать дальше →

RING буфер — 2D cлучай

Время на прочтение7 мин
Охват и читатели13K
RING (кольцевой) буфер — 2D cлучай.
!NEW полнофункциональный модуль с гайдом, ссылка на на github в конце статьи!

Давно собирался написать на Хабр несколько алгоритмических трюков, почерпнутых из увлечений демосценой, из экспериментов с алгоритмами. Надеюсь, получится в олдскульном духе необычного использования интересных алгоритмов потому, что для меня Хабр являет интерес именно такими статьями.

Структура данных RING буфер (кольцевой буфер) чаще всего встречается в реализации сетевых протоколов, и в Concurrency структурах (синхронизация данных между потоками).

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

Начнем с того, что же такое кольцевой буфер, и что он дает как абстрактный алгоритм:
Читать дальше →

Дайджест интересных материалов из мира веб-разработки и IT за последнюю неделю №205 (28 марта — 3 апреля 2016)

Время на прочтение7 мин
Охват и читатели25K
Предлагаем вашему вниманию подборку с ссылками на полезные ресурсы, интересные материалы и IT-новости


Читать дальше →

Как сделать многослойную Parallax иллюстрацию на CSS & JavaScript

Время на прочтение5 мин
Охват и читатели58K
image
Рисунок используемый для parallax эффекта. Автор Patryk Zabielski

Привет друзья, я покажу вам как создать простою многослойную иллюстрацию с глубиной, которая переходит к контенту. Мы будем использовать метод, в котором необходим только css и чистый JS(coffeescript) (Никаких jQuery!).

Этот урок для начинающих, с начальным знанием JS и CSS, так что я буду объяснять большинство вещей и ссылаться на внешние источники.

Финальное демо
Читать дальше →

Как мы разогнали мобильную Lenta.ru до скорости света

Время на прочтение9 мин
Охват и читатели42K
image

AMP — наверняка, вы уже слышали об этой технологии, продвигаемой Google. Казалось бы, еще одна модная технология для хипстеров, о которой скоро все забудут. Однако, в реальности эта фича уже работает в продакшне значительного числа новостных сайтов, среди которых такие гиганты, как the Guardian, Times, Washington Post, и прочая, прочая, прочая. Краткий рассказ о плюшках AMP уже был на страницах “Хабра”, а я хотел бы чуть более подробно сфокусироваться на том, как внедрять это в проект, и какой профит в действительности можно получить.
Читать дальше →

Как один программист Jocly подковал

Время на прочтение17 мин
Охват и читатели8.4K
— Ученик Почтальона Стэнли — пробормотал Грош
— Сирота, сэр. Очень печальная история… Хороший мальчик, если его не злить,
… если вы понимаете, что я имею в виду.
— Э… возможно. — сказал Мокрист и поспешно повернулся к Стэнли
— Итак, знаешь кое-что о булавках?…
— Нетсэр! — ответил Стэнли…
— О булавках я знаю всё!  
 
                            сэр Терри Пратчетт "Опочтарение".
 

В далёком 1998 году, Zillions of Games произвела фурор в среде любителей настольных игр, но она не была лишена недостатков. Главным её недостатком являлась закрытость. Для того, чтобы играть во что-то сверх набора из 48 игр, входящих в демо-комплект, приходилось платить деньги за активацию программы. Было невозможно запустить ZoG на чём-то кроме Windows (с некоторыми версиями этой ОС вполне могли возникнуть проблемы). Сетевой режим был, но только по локальной сети или через модем, Web не подразумевался. С этим ничего нельзя поделать, это закрытый продукт! Кроме того, в настоящее время, он практически не поддерживается. Я думаю, что многие будут рады услышать, что существует альтернатива, свободная от перечисленных выше недостатков. Знакомьтесь, это Jocly.
Читать дальше →

NPM запретил отзывать без разрешения open-source модули старше 24 часов

Время на прочтение2 мин
Охват и читатели27K
Пакетный менеджер NPM на прошлой неделе стал причиной сумятицы в связи с исчезновением маленького модуля left-pad, на который были установлены зависимости в Node, React, Babel и тысячах других пакетов. Чтобы не допустить такого в будущем, сейчас администрация NPM внесла изменения в правила. По новым правилам, автоматический отзыв модуля возможен только в течение 24 часов после публикации на сервере NPM. После этого времени отзыв допускается только с разрешения администрации.
Читать дальше →

Анатомия редакторов документов: общий код для онлайн и оффлайн-версий редакторов ONLYOFFICE

Время на прочтение5 мин
Охват и читатели11K
Если бы кто-то спросил нас, какой сегодня день, мы бы ответили, что сегодня Большой День. День, когда мы наконец-то релизим десктопные редакторы ONLYOFFICE. Tе самые, что работают без браузера/интернета и отправляют документ прямо на принтер.

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

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


Читать дальше →

Советы, библиотеки и дополнительные материалы по CSS-анимации

Время на прочтение25 мин
Охват и читатели68K
Советы, библиотеки и дополнительные материалы по CSS-анимации

Введение


Была глубокая ночь. В темную комнату через деревянные окна проникал лунный свет. Он недостаточно освещал мой деревянный стол с ноутбуком, блокнотом и синей ручкой. Поэтому я протянул свою руку к настольной лампе и включил её.

На компьютере был открыт текстовой файл со списком статей и библиотек про веб-разработку. Он постоянно пополнялся новыми данными.

Свернув его, я пошел на улицу в поисках кинотеатра с Deadpool'ом запустил браузер и стал блуждать по окрестностям интернета. Во время прогулки я наткнулся на интересную js-библиотеку по созданию css-анимации, которую добавил в открытый до этого текстовой документ… Как оказалось, по этой теме у меня уже набралось больше 40 ссылок на материалы и библиотеки.
Читать дальше →

Интерактивное видео и с чем его едят

Время на прочтение8 мин
Охват и читатели16K
Полгода назад за чашечкой кофе программист, режиссер и геймдизайнер вели дружескую беседу на тему того, что кинематограф становится скучным. «Да, спецэффекты становятся круче, количество D становится больше, но этим сейчас малого кого можно удивить. Людей цепляет сюжет. А теперь представьте, что когда-нибудь мы будем смотреть смотреть фильмы, которыми можно управлять?»
— Я бы убил Джона Коннора.
— А я бы не выбросил бузинную палочку и стал плохим волшебником.
— А я бы на месте Поттера воспользовался маховиком времени, чтобы спасти его родителей, а не клювокрыла.



И, как говорится, понеслось…

На прошлой неделе мы спросили Хабражителей интересно ли узнать о технических аспектах создания игры. Сейчас мы готовы представить плоды нашей работы и рассказать с какими трудностями столкнулись, как с ними боролись и какие результаты получили.
Читать дальше →

Как ESLint реагирует на ситуацию с удалением пакетов из NPM

Время на прочтение3 мин
Охват и читатели13K
После того, как произошла ситуация с удалением пакетов из NPM, которая затронула огромное количество пользователей пакетов babel, jscs и многих других (об этом можно почитать здесь: «A discussion about the breaking of the Internet»), многие разработчики Open Source начали рассуждать о будущем NPM и экосистемы JS в целом.

Мнения разделились:


Ну а команды крупных Open Source пакетов, на которые свалилось огромное количество тикетов в github, всерьез задумались о том, как не допустить такой ситуации в будущем. Особенно пострадали те проекты, которые часто используются в CI, так как именно пользователи CI в первую очередь заметили проблемы с отсутствующими зависимостями. Одним из таких проектов является ESLint, имеющий порядка 70 тысяч установок в день, большинство из которых приходится на CI-сборки.
Читать дальше →

Ближайшие события

Дайджест интересных материалов из мира веб-разработки и IT за последнюю неделю №204 (21 — 27 марта 2016)

Время на прочтение7 мин
Охват и читатели26K
Предлагаем вашему вниманию подборку с ссылками на полезные ресурсы, интересные материалы и IT-новости


Читать дальше →

Не пропусти js-ошибку

Время на прочтение2 мин
Охват и читатели27K
Разрабатывая и тестируя сайт, зачастую замечаешь не все js-ошибки. Это происходит по ряду причин:
  • отсутствие консоли в некоторых мобильных и планшетных браузерах;
  • открытая консоль мешает при тестировании, перекрывая видимую часть страницы;
  • консоль открывают когда страница уже загрузилась и ошибки, возникающие при загрузке, теряются (Firebug в Firefox, Internet Explorer);
  • при разработке часто отключают логирование ошибок в системах аналитики, чтобы не было лишнего «шума» при анализе ошибок;
  • и прочее.
Читать дальше →

Стандарт ECMA-262 (JavaScript) в картинках, часть 3

Время на прочтение2 мин
Охват и читатели14K

В предыдущих частях рассматривались структуры execution context, объекты Function и указатель this. В третьей части речь пойдет о прототипном наследовании.
Читать дальше →

NPM и left-pad: мы разучились программировать?

Время на прочтение4 мин
Охват и читатели116K
Автор — Дэвид Хейни (David Haney), ведущий инженер-программист Stack Overflow

Итак, разработчики, время для серьёзного разговора. Вы уже наверное в курсе, что на этой неделе React, Babel и куча других популярных пакетов на NPM сломались. Причина довольно удивительная.

Простой пакет NPM под названием left-pad был установлен как зависимость в React, Babel и других пакетах. Модуль, который на момент написания этого поста, имеет 11 звёзд на Github (сейчас 323 — прим.пер). Весь пакет состоит из 11 простых строчек, которые реализуют примитивную функцию вставки пробелов в левой части строк. Если какие-то из ссылок когда-нибудь умрут, вот его код:

module.exports = leftpad;
function leftpad (str, len, ch) {
  str = String(str);
  var i = -1;
  if (!ch && ch !== 0) ch = ' ';
  len = len - str.length;
  while (++i < len) {
    str = ch + str;
  }
  return str;
}
Что меня беспокоит, так это такое большое количество пакетов, где установлена зависимость от простой функции набивки строки пробелами, вместо того чтобы потратить 2 минуты и написать эту базовую функцию самому.
Читать дальше →

Один разработчик чуть не «сломал» пакетный менеджер NPM

Время на прочтение2 мин
Охват и читатели101K
Веб-разработчик Азер Кочулу (Azer Koçulu), автор более 250 модулей для Node.js, попал в неприятную ситуацию. В своём блоге он пишет, что несколько недель назад получил письмо от юриста компании Kik (мессенджер) с требованием отозвать модуль с аналогичным названием kik из пакетного менеджера NPM (Node Package Manager).

Программист отказался, тогда юрист обратился напрямую в NPM, и администрация проекта удовлетворила его требование, сменив владельца kik без разрешения автора.

Азер Кочулу был крайне недоволен этим. Настолько недоволен, что решил в ответ «освободить» (то есть отозвать) все свои модули — более 250 модулей NPM. К сожалению, среди них оказался и left-pad — маленький модуль из 11 строк кода на JavaScript. Он используется при установке зависимостей между пакетами через NPM, в том числе в Node.js, JavaScript-транскомпиляторе Babel и огромном количестве других билдов. Только за прошлый месяц left-pad скачали 2 486 696 с сервера NPM, по их статистике.
Читать дальше →

Вышел новый JavaScript фреймворк: DAAJS

Время на прочтение4 мин
Охват и читатели4.8K
На днях вышел первый релиз нового многообещающего open source JavaScript фреймворка «DAAJS». Он может быть интересен front-end разработчикам в качестве базы для создания веб- и мобильных приложений.



В основе идеологии фреймворка лежат class-oriented и event-driven подходы. Вся функциональность реализована в виде классов. Классы представлений на основе шаблонов и алгоритмов генерируют компоненты пользовательского интерфейса и инкапсулируют непосредственно связанное с ними поведение (такое как разворачивание ветвей древовидных списков, раскрытие пунктов меню, перемещение элементов и т.п.). Механизм событий служит для организации как взаимодействия пользователя с интерфейсами — на уровне классов, а не отдельных DOM-элементов — так и для реализации сложного поведения, требующего участия множества методов или других классов. Любые события внутри фреймворка представлены в едином, унифицированном формате.

Читать дальше →

Автоматическое дополнение JS-кода из базы Stack Overflow

Время на прочтение1 мин
Охват и читатели24K
Пару недель назад Stack Overflow выложил в открытый доступ дамп всего контента, опубликованного на сайтах в сети Stack Exchange за 2014-2016 гг, в формате XML. Там все вопросы и ответы, комментарии и оценки: всего 33,8 ГБ в архиве.

Разработчик веб-приложений Эмиль Шутте (Emil Schutte) нашёл полезное применение этому дампу. Он извлёк оттуда фрагменты кода, которые соответствуют критериям (одобренные ответы с более 50 голосов и тегом "javascript") и проиндексировал их.



Так появилась программка Autocomplete from Stack Overflow. Если написать что-то в форме, то она ищет подходящий фрагмент в базе Stack Overflow — и автоматически его предлагает.
Читать дальше →