TrainHard

Здесь используется самовызывающая функция, а для нее механизм замыканий работает по-другому. Она вызывается не в контексте цикла, а в самом корне. Ей попросту не передаются локальные переменные. Если нужно передать, добавьте ей эти переменные как аргументы.

берется извне переменная i и присваивается переменной i

Там не так, имя "i" захватывается не в момент var, а с начала блока и до конца, тот же результат будет если var i переместить в конец:

for (var i = 0; i < 10; i++) {
  (function() {
      console.log(i);
      var i;
  })();
}

То же самое с именованными функциями, они создаются сразу, а не с точки где опубликованы:

foo();  // вызов
function foo() {console.log('FOO') }  // объявление

вот

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

//module = [undefined] значит создаем новый с пустого объекта 
      var module = (function (obj) {
          obj.x=1;
          obj.z=3;
          return obj;
      })(module || {});

//module = [object] продолжаем работать с уже созданным 
      var module = (function (obj) {
          obj.x=2;
          obj.y=1;
          return obj;
      })(module || {});

      console.dir(module);

Шаблон проектирования Модуль

Так более понятно будет?

function f(obj){
  //code
}
var module = f(f() || {});

У вас среди вопросов уже был подобный и в нём уже указан приоритет технологий для изучения (ответ).

А Petja указал правильный подход изучения каждой отдельной технологии (ответ)

Я хотел бы раскрыть пункт "4. Практика и еще раз практика, решение множества конкретных задач"

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

Для примера были взяты свежие задачи с бирж фрилансеров weblancer.net и fl.ru типа "создать тему к CMS", "сделать посадочную страницу" (landing page) или "разработать сайт-визитку".

Были рассмотрены следующие способы изучения:

1. Повторить работы опытных фрилансеров. Исходные макеты либо не дали, либо они уже отличаются от того, что есть на сайте.
2. Включиться в открытый проект. Проблема в том, что сверстать страницы HTML можно несколькими способами, вплоть до image map или таблиц. А сравнить-то результат вёрстки не с чем.
3. Взять где-нибудь бесплатно или купить шаблон, к которому прилагается макет PSD, изучить свёрстанный вариант и повторить. Это оказался самый эффективный способ. Платные шаблоны делают профессионалы, "вылизывают" их, доводят до совершенства. И бесплатные шаблоны есть очень крутые, но их мало.

Мы использовали шаблоны с templatemonster. Там есть шаблоны под популярные CMS и просто HTML шаблоны. Также позже брали примеры из обзоров (35 примеров прекрасных посадочных страниц...) и повторяли несколько из них. Несложный макет в итоге верстается за сутки.

Это покрывает темы (из указанного же списка):

• XHTML, HTML4, HTML5
• CSS2.1, CSS3
• JavaScript, Ajax
• jQuery
• Twitter Bootstrap
• CSS Grids
• CSS Frameworks
• Progressive Enhancement, Graceful Degradation
• Responsive Web Design
• CSS Pre-Processors (LESS / Sass)
• CMS (WordPress, Joomla)
• Data Formats (JSON, XML)
• Internationalization / Localization
• Image Editing Tools (Photoshop, Fireworks, etc.)
• работа со шрифтами

Задачи типовые, а охват тем сразу вот какой обширный. Изучение в интенсивном темпе заняло 2...4 месяца. Профессионалом так быстро не станешь, но на позицию junior уже можно претендовать.

Так что мои советы:
1. Чтобы получить бесценную практику, занимайся реальными вещами, а не учебными примерами
2. Используй опыт профессионалов, чтобы повторять и копировать лучшие решения

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

Я скажу вам так: даже если вы изучите все существующие на свете книги по самым лучшим методологиям, практического опыта вам не заменит ничего. Теоретические знания - это важно, они предотвращают большую часть говнокода. Особенно в этом помогают шаблоны проектирования. Но вопрос был немного не в этом, поэтому возвращаюсь к теме: я бы рекомендовал вам купить подписку на ресурсы а-ля codeschool и т.п., такие ресурсы помогают получить правильную базу. Как ни крутите, но лучший расклад - это "знать по чуть-чуть", на большее вы не сможете рассчитывать в первое время. Я искрине желаю вам удачи, и верю, что у вас всё получится!