JavaScript *

— Здра…
— А-а-а!
— Ну ты чего?
— Я вас боюсь!
— Чего это?
— Вы вечно меня унижаете…
— Хех, ну ладно, больше не буду.
— Правда?
— Доо, хочешь конфетку с аяксом?
— Конечно!
— Тада давай, лети к нам в Питер. Вот список авиарейсов на которые есть билеты отсортированный по цене: rasp.yandex.ru/search?cityFrom=Санкт-Петербург&cityTo=Москва
— Эм… что-то вы наврали дяденька — там вообще все рейсы из Москвы в Питер, отсортированные по времени отправления.
— Гм… действительно, не хорошо получилось… а значешь почему?
— Нэ?
— Потому что состояние приложения не отражается на uri. Поэтому каждый раз заходя на эту страницу из закладок, тебе придётся заново устанавливать фильтрацию и сортировку.
— Блоо, как же быть?

Я думаю многие пользуются DataBinding`ом в .NET, она же привязка данных. Она позволяет, при выделенной модели данных и независимом визуальном представлении, забыть о синхронизации данных с формой. Привязав один раз properties модели к элементам представления, мы избавляемся от десятков обработчиков onChange и подобных для изменения полей модели, а в случае изменения поля вне gui-интерфейса (например синхронизация модели с базой), мы не будем мешать уровни абстрации, чтобы обновить textBox.text. Давайте данные будут отдельно, gui отдельно. Плюс мы получаем наглядный, легко переносимый код на asp.net или даже на другой язык/платформу.

 

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

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

— Здравствуй, дружок…
— Дяденька, вы снова расскажете мне сказку?
— Конечно! Какой умненький мальчик!
— А про что?
— М… сегодня я расскажу тебе о том, куда пропадают чересчур самостоятельные мальчики вроде тебя…
— Э! Что значит пропадают?
— Вот то и значит… На, держи огнелиса *протянул, держа за хвост, пылающее пламенем животное* Только осторожно — он горячий!
— Ай-ай-ай! Он брыкается!
— Посади на него огненного жука — мигом успокоится.
— Класс! Действует!
— Ато! Теперь скажи ему:

function throwException( ){
    (void 0)()
}
throwException()

Здравствуй Храбрачеловек,

сегодня я решил поделиться с тобой Plugin'ом для Notepad++, который позволит тебе спомощью JavaScript автоматизировать некоторые действия над текстом

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

1. // getRectangleArea(x1, y1, x2, y2) или
2. // getRectangleArea(width, height)
3. function getRectangleArea(x1, y1, x2, y2) {
4.   if(arguments.length==2) return x1*y1;
5.   return (x2-x1)*(y2-y1);
6. }

* This source code was highlighted with Source Code Highlighter.

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

Пост про (вполне логичные) особенности javascript ( habrahabr.ru/blogs/javascript/84311 ) вызвал бурное обсуждение. Я вслед за автором WTFJS.com сильно облажался, считая эти странности действительно чем-то мистическим ) Большое спасибо всем тем, кто объяснил, почему так происходит на самом деле или для чего так сделано. Понимание таких тонкостей позволяет перейти в общении с языком на «ты». Кто-то скажет, что это должен знать любой программист, хоть как-то владеющий JS? Возможно. Но, как оказалось, многие не знали, и я в их числе.

Считаете себя гуру JS'а? Попробуйте предсказать результаты следующих операций:

Number.MIN_VALUE > 0; // true or false?

typeof null; // what type?
null === Object; // true or false?

// и самый сок

NaN === NaN; // true or false?

typeof NaN; // what type?


* This source code was highlighted with Source Code Highlighter.

Сомневаетесь? Тогда именно для вас Брайан Леру (Brian Leroux) создал WTFJS — сайт, содержащий коллекцию странностей JS. «JavaScript — это язык, который мы любим несмотря на все его ненавистные особенности».

Для нетерпеливых ответы под катом.

Добрый вечер уважаемые читатели,

На хабре последнее время проскакивало несколько упоминаний о node, быстрой платформе для создания вэб приложений на javascript, обладающей довольно уникальной на сегодняшний день особенностью, неблокирующим I/O (вводом/выводом).

Для начала о nodeJS:

1) В качестве языка используется JavaScript
2) Для выполнения JavaScript используется движок V8 от Google, который работает довольно быстро благодаря компиляции в машинный код перед выполнением.
3) Для реализации неблокирующего I/O используются libev и libeio, (libev показывает более хорошие результаты по сравнению с libevent)
4) Для реализации подключения библиотек выбран синтаксис commonJS
5) Есть возможность писать модули ещё и на C/C++, при этом подключаются они точно так-же как и js модули, это позволит Вам, к примеру, любое узкое место в вашем приложении переписать на C++ без каких либо трудностей.

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

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

UPD

Подготовил версию 3.2.5. Теперь галерея стабильно работает в IE9. Пофиксены все найденные баги.

Внезапно потребовалось выводить на странице виджет Яндекс.Карт с какими-то накладываемыми слоями. Проблема заключалась в необходимости дать пользователю редактировать эти слои.

Быстрый поиск редакторов накладываемых примитивов дал только конструктор схем проезда от Яндекса и какой-то убогий php'шный конструктор карт (к тому же ещё и платный). А редактор был нужен. По этому пришлось сесть и быстренько написать.

Наткнулся вчера на этот инструмент и не смог пройти мимо, провел ночь за написанием тестов, а теперь хочу поделиться находкой. QUnit — это библиотека от разработчиков jQuery, позволяющая писать unit-тесты для кода на javascript. Удобна в использовании, ничего лишнего, осваивается за 20 минут, выгода от применения — колоссальная.

Самым нетерпеливым сразу ссылки:
Официальная документация на сайте jquery: docs.jquery.com/QUnit
Реальные примеры тестов (для модулей jquery): view.jquery.com/trunk/jquery/test/unit
Руководство для начинающих (англ): www.swift-lizard.com/2009/11/24/test-driven-development-with-jquery-qunit
Система распределенного тестирования (гениально и просто): testswarm.com

Под катом информация о преимуществах юнит-тестирования применительно к js и разбор возможностей библиотеки на примерах.

Те, кто пишут на C# очень хорошо знают и часто используют механизм String.Format, которого сильно не хватает в JavaScript. Несмотря на его простоту и удобство, на просторах Сети мало что можно накопать, в основном вариации на тему sprintf (привет сишникам). Достаточно давно был написан скрипт, который позволял форматировать строки на JavaScript и был похож на String.Format C#. Форматирование стало использоваться коллегами достаточно плотно в скриптах и я решил немного причесать код и опубликовать для тех, кто хочет получить String.Format в JavaScript.

Викторина для тех, кто любит JavaScript больше ECMAScript. Главный приз: пирожок на полке.

Update: Пояснение. Для тех кто совсем не в теме. ECMAScript — это стандарт языка, на котором основаны реализации JavaScript в современных браузерах. Именно этот стандарт определяет поведение программ в этой статье. JavaScript является «надстройкой» над ECMAScript.

Пояснение номер 2. Глюки IE не имеют прямого отношения к викторине поскольку это ошибки (ну или «особенности») реализации стандартов.

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

Диаграмма Ганта (англ. Gantt chart, также ленточная диаграмма, график Ганта) — это популярный тип столбчатых диаграмм, который используется для иллюстрации плана, графика работ по какому-либо проекту. Является одним из методов планирования проектов.

Без малого год назад, я уже писал (http://habrahabr.ru/blogs/javascript/50544/) о самом коротком способе определение браузера Internet Explorer, но вот некто Aleko нашел еще более короткий вариант:

-[1,]

Всего 5 байт. Пример использования:
if(-[1,]){
alert("Not IE!");
}

Продолжаем тему визуализации данных в интернете.

Предыдущие топики:

• Изумительные диаграммы с новым Chart контролом
• Визуализация направленных графов в вебе
• Список Javascript библиотек для рисования графиков и диаграмм — habrahabr.ru/blogs/javascript/79960 (публикация в блоге — msug.vn.ua/blogs/akrakovetsky/archive/2010/01/04/javascript-charting-libraries.aspx)

О визуализация графов в вебе говорили здесь, навеяно этой статьей.

Под катом обзор JavaScript библиотек для рисования графов, диаграмм и прочей красоты.

Однажды я зашел на rememberthemilk.com и понял, что хочу такое же контекстное autocomplete меню в свой проект. В результате получился небольшой jquery плагин, который хочу презентовать в этом посте. Работает в ie6+, opera, safari, firefox, chrome (тестировал в последних версиях). В кратце расскажу в чем суть «контекстного» меню в RTM-стиле.

Это меню присоединяется к input-элементу, но, в отличие от обычных autocomplete меню, оно «всплывает» не для ввода всего значения элемента, а для какой-то логической части поля ввода. При этом меню позиционируется непосредственно под автодополняемым текстом. Вот как это выглядит:



Лицензия проекта — MIT / beerware.
Скачать библиотеку с примерами можно тут: js-context-autocomplete.googlecode.com/files/js-autocomplete-v5.tar
Последнюю ревизию забираем тут: svn checkout js-context-autocomplete.googlecode.com/svn/trunk js-context-autocomplete-read-only
Кому интересно поучаствовать в проекте — пишите в личку.
Временное online-demo (upd)

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

Обратите внимание на вот эту иллюстрацию:



Красиво, правда?