Оформление кода → Атомы

Клиентское приложение принято разделять на 3 основных слоя: данные, поведение и оформление. Для каждого слоя используется свой язык: html, javascript и css, соответственно. Связь между ними осуществляется через некоторые идентификаторы: имена тэгов, классов, идентификаторов. Но к сожалению, в большинстве случаев они сильно завязаны на контекст использования, что усложняет поддержку и рефакторинг.

Несколько примеров:

1. var user= new User( 'tenshi' )
2. var isUser= anElement.hasClassName( 'user' )
3. var container= document.getElementById( 'user' )

Тут мы видим много различных сущностей имеющих одно имя: имя переменной, имя конструктора, имя класса, идентификатор. Что если вы заглянули в исходный код страницы и обнаружили у одного элемента класс 'user', которого там быть недолжно? Из-за того, что имя класса не является для вашего приложения атомарной сущностью (то есть требует дополнительный контекст типа var, new, hasClassName, getElementById, чтобы обрести смысл), поиск по строке «user» выдаст вам гору всякого мусора, который придётся разгребать руками.

Чтобы решить описанную проблему вводятся пространства имён. Например:

1. var user= new User( 'tenshi' )
2. var isUser= anElement.hasClassName( 'm-user' )
3. var container= document.getElementById( 'id-user' )

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

1. <div id="id-user">Tenshi</div>
2. <div class="b-person-info m-user">ahtung! tenshi is a user!</div>

1. #id-user { font-size: 24pt }
2. .b-person-info { border: 1px solid transparent }
3. .b-person-info.m-user { border-color: red }

1. var anUserElement= $( 'id-user' )
2. var aPersonElement= anUserElement.select( '.b-person' )[0]
3. aPersonElement.addClassName( 'm-user' )

Наиболее употребительные префиксы:
id- для идентификаторов
b- для цсс блоков
m- для модификаторов блоков

Для имён, используемых в рамках одного языка, префиксы как правило не используют. Хотя, встречается, например, что имена конструкторов начинают с префиксов T или С, либо помещают в единое пространство имён типа $ или YMaps:

1. var aMapList= new CMapList
2. (       $$( '#id-map-list .b-map' )
3.         .map
4.         (       YMaps.Map.bind
5.                 (       YMaps
6.                 ,       {       propagateEvents: true
7.                         ,       coordSystem: new CCoordSystem
8.                         }
9.                 )
10.         )
11. )

А какие атомы используются в ваших проектах?