forked from maksrom/javascript-nodejs
-
Notifications
You must be signed in to change notification settings - Fork 0
Expand file tree
/
Copy pathtutorial.js
More file actions
executable file
·84 lines (81 loc) · 32.6 KB
/
tutorial.js
File metadata and controls
executable file
·84 lines (81 loc) · 32.6 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
require('users').User;
require('tutorial').Article;
exports.User = [
{ "_id": "000000000000000000000001",
"created": new Date(2014,0,1),
"displayName": "ilya kantor",
"email": "iliakan@gmail.com",
"password": "1234",
"verifiedEmail": true
},
{ "_id": "000000000000000000000002",
"created": new Date(2014,0,1),
"displayName": "tester",
"email": "tester@mail.com",
"password": "1234",
"verifiedEmail": true
},
{ "_id": "000000000000000000000003",
"created": new Date(2014,0,1),
"displayName": "vasya",
"email": "vasya@mail.com",
"password": "1234",
"verifiedEmail": false
}
];
exports.Article = [
{
"_id": '000000000000000000000010',
"isFolder" : true,
"content" : "# JS",
"weight" : 1,
"slug" : "js",
"title" : "JavaScript",
"githubLink": "http://not.exists.com"
},
{
"_id": '000000000000000000000011',
"isFolder" : true,
"content" : "# UI",
"weight" : 2,
"slug" : "ui",
"title" : "Интерфейсы",
"githubLink": "http://not.exists.com"
},
{
"_id": '000000000000000000000012',
"isFolder" : true,
"content" : "# UI",
"weight" : 3,
"slug" : "more",
"title" : "Дополнительно",
"githubLink": "http://not.exists.com"
},
{
"parent" : '000000000000000000000010',
"_id": '000000000000000000000013',
"content" : "# Введение в JavaScript\n\nДавайте посмотрим, что такого особенного в JavaScript, почему именно он, и какие еще технологии существуют, кроме JavaScript.\n[cut]\n## Что такое JavaScript? \n\n*JavaScript* изначально создавался для того, чтобы сделать web-странички \"живыми\". \nПрограммы на этом языке называются *скриптами*. Они подключаются напрямую к HTML и, как только загружается страничка -- тут же выполняются.\n\n**Программы на JavaScript -- обычный текст**. Они не требуют какой-то специальной подготовки.\n\nВ этом плане JavaScript сильно отличается от другого языка, который называется Java.\n\n[smart header=\"Почему <u>Java</u>Script?\"]\nКогда создавался язык JavaScript, у него изначально было другое название: \"LiveScript\". Но тогда был очень популярен язык Java, и маркетологи решили, что схожее название сделает новый язык более популярным.\n\nПланировалось, что JavaScript будет эдаким \"младшим братом\" Java. Однако, история распорядилась по-своему, JavaScript сильно вырос, и сейчас это совершенно независимый язык, со своей спецификацией, которая называется <a href=\"http://en.wikipedia.org/wiki/ECMAScript\">ECMAScript</a>, и к Java не имеет никакого отношения.\n\nУ него много особенностей, которые усложняют освоение, но по ходу учебника мы с ними разберемся.\n[/smart]\n\nЧтобы читать и выполнять текст на JavaScript, нужна специальная программа -- [интерпретатор](http://ru.wikipedia.org/wiki/%D0%98%D0%BD%D1%82%D0%B5%D1%80%D0%BF%D1%80%D0%B5%D1%82%D0%B0%D1%82%D0%BE%D1%80). Процесс выполнения скрипта называют *\"интерпретацией\"*.\n\n[smart header=\"Компиляция и интерпретация, для программистов\"]\nСтрого говоря, для выполнения программ существуют \"компиляторы\" и \"интерпретаторы\". \n\nКомпиляторы преобразуют программу в машинный код. Этот машинный код затем распространяется и запускается. \n\nА интерпретаторы, в частности, встроенный JS-интерпретатор браузера -- получают программу в виде исходного кода. При этом распространяется именно сам исходный код (скрипт).\n\nСовременные интерпретаторы перед выполнением преобразуют JavaScript в машинный код или близко к нему, а уже затем выполняют. \n[/smart]\n\nВо все основные браузеры встроен интерпретатор JavaScript, именно поэтому они могут выполнять скрипты на странице.\n\nНо, разумеется, этим возможности JavaScript не ограничены. Это полноценный язык, программы на котором можно запускать и на сервере, и даже в стиральной машинке, если в ней установлен соответствующий интерпретатор.\n\n## Что умеет JavaScript? \n\nСовременный JavaScript -- это \"безопасный\" язык программирования общего назначения. Он не предоставляет низкоуровневых средств работы с памятью, процессором, так как изначально был ориентирован на браузеры, в которых это не требуется.\n\nЧто же касается остальных возможностей -- они зависят от окружения, в котором запущен JavaScript. \n\nВ браузере JavaScript умеет делать все, что относится к манипуляции со страницей, взаимодействию с посетителем и, в какой-то мере, с сервером: \n\n<ul>\n<li>Создавать новые HTML-теги, удалять существующие, менять стили элементов, прятать, показывать элементы и т.п.</li>\n<li>Реагировать на действия посетителя, обрабатывать клики мыши, перемещение курсора, нажатие на клавиатуру и т.п. </li>\n<li>Посылать запросы на сервер и загружать данные без перезагрузки страницы(эта технология называется "AJAX").</li>\n<li>Получать и устанавливать cookie, запрашивать данные, выводить сообщения...</li>\n<li>...и многое, многое другое!</li> \n</ul>\n\n## Что НЕ умеет JavaScript? \n\nJavaScript -- быстрый и мощный язык, но браузер накладывает на его исполнение некоторые ограничения.. \n\nЭто сделано для безопасности пользователей, чтобы злоумышленник не мог с помощью JavaScript получить личные данные или как-то навредить компьютеру пользователя. \n\nЭтих ограничений нет там, где JavaScript используется вне браузера, например на сервере. Кроме того, различные браузеры предоставляют свои механизмы по установке плагинов и расширений, которые обладают расширенными возможностями, но требуют специальных действий по установке от пользователя\n\n**Большинство возможностей JavaScript в браузере ограничено текущим окном и страницей.**\n\n<img src=\"jslimit.jpg\">\n\n<ul>\n<li>JavaScript не может читать/записывать произвольные файлы на жесткий диск, копировать их или вызывать программы. Он не имеет прямого доступа к операционной системе.\n\nСовременные браузеры могут работать с файлами, но эта возможность ограничена специально выделенной директорией -- *\"песочницей\"*. Возможности по доступу к устройствам также прорабатываются в современных стандартах и частично доступны в некоторых браузерах.\n</li>\n<li>JavaScript, работающий в одной вкладке, не может общаться с другими вкладками и окнами, за исключением случая, когда он сам открыл это окно или несколько вкладок из одного источника (одинаковый домен, порт, протокол).\n\nЕсть способы это обойти, и они раскрыты в учебнике, но они требуют внедрения специального кода на оба документа, которые находятся в разных вкладках или окнах. Без него, из соображений безопасности, залезть из одной вкладки в другую при помощи JavaScript нельзя. \n</li>\n<li>Из JavaScript можно легко посылать запросы на сервер, с которого пришла страница. Запрос на другой домен тоже возможен, но менее удобен, т.к. и здесь есть ограничения безопасности. \n</li>\n</ul>\n\n## В чем уникальность JavaScript? \n\nЕсть как минимум *три* замечательных особенности JavaScript:\n\n[compare]\n+Полная интеграция с HTML/CSS.\n+Простые вещи делаются просто.\n+Поддерживается всеми распространенными браузерами и включен по умолчанию.\n[/compare]\n\n**Этих трёх вещей одновременно нет больше ни в одной браузерной технологии.** Поэтому JavaScript и является самым распространенным средством создания браузерных интерфейсов.\n\n## Тенденции развития. \n\nПеред тем, как вы планируете изучить новую технологию, полезно ознакомиться с ее развитием и перспективами. Здесь в JavaScript всё более чем хорошо.\n\n### HTML 5\n\n*HTML 5* -- эволюция стандарта HTML, добавляющая новые теги и, что более важно, ряд новых возможностей браузерам.\n\nВот несколько примеров:\n<ul>\n<li>Чтение/запись файлов на диск (в специальной \"песочнице\", то есть не любые).</li>\n<li>Встроенная в браузер база данных, которая позволяет хранить данные на компьютере пользователя.</li>\n<li>Многозадачность с одновременным использованием нескольких ядер процессора.</li>\n<li>Проигрывание видео/аудио, без Flash.</li>\n<li>2d и 3d-рисование с аппаратной поддержкой, как в современных играх.</li>\n</ul>\n\nМногие возможности HTML5 всё ещё в разработке, но браузеры постепенно начинают их поддерживать.\n\n[summary]Тенденция: JavaScript становится всё более и более мощным и возможности браузера растут в сторону десктопных приложений.[/summary]\n\n### EcmaScript 6\n\nСам язык JavaScript улучшается. Современный стандарт EcmaScript 5 включает в себя новые возможности для разработки, EcmaScript 6 будет шагом вперёд в улучшении синтаксиса языка.\n\nСовременные браузеры улучшают свои движки, чтобы увеличить скорость исполнения JavaScript, исправляют баги и стараются следовать стандартам.\n\n[summary]Тенденция: JavaScript становится всё быстрее и стабильнее.[/summary]\n\nОчень важно то, что новые стандарты HTML5 и ECMAScript сохраняют максимальную совместимость с предыдущими версиями. Это позволяет избежать неприятностей с уже существующими приложениями.\n\nВпрочем, небольшая проблема с HTML5 всё же есть. Иногда браузеры стараются включить новые возможности, которые еще не полностью описаны в стандарте, но настолько интересны, что разработчики просто не могут ждать. \n\n...Однако, со временем стандарт меняется и браузерам приходится подстраиваться к нему, что может привести к ошибкам в уже написанном (старом) коде. Поэтому следует дважды подумать перед тем, как применять на практике такие \"супер-новые\" решения.\n\nПри этом все браузеры сходятся к стандарту, и различий между ними уже гораздо меньше, чем всего лишь несколько лет назад.\n\n[summary]Тенденция: всё идет к полной совместимости со стандартом.[/summary]\n\n## Недостатки JavaScript\n\nЗачастую, недостатки подходов и технологий -- это обратная сторона их полезности. Стоит ли упрекать молоток в том, что он -- тяжелый? Да, неудобно, зато гвозди забиваются лучше.\n\nВ JavaScript, однако, есть вполне объективные недоработки, связанные с тем, что язык, по выражению его автора (Brendan Eich) делался \"за 10 бессонных дней и ночей\". Поэтому некоторые моменты продуманы плохо, есть и откровенные ошибки (которые признает тот же Brendan). \n\nКонкретные примеры мы увидим в дальнейшем, т.к. их удобнее обсуждать в процессе освоения языка.\n\nПока что нам важно знать, что некоторые \"странности\" языка не являются чем-то очень умным, а просто не были достаточно хорошо продуманы в своё время. В этом учебнике мы будем обращать особое внимание на основные недоработки и \"грабли\". Ничего критичного в них нет, если знаешь -- не наступишь.\n\n**В новых версиях JavaScript (ECMAScript) эти недостатки постепенно убирают.** \n\nПроцесс внедрения небыстрый, в первую очередь из-за старых версий IE, но они постепенно вымирают. Современный IE в этом отношении несравнимо лучше.", "isFolder" : false,
"weight" : 1,
"slug" : "article",
"title" : "Введение в JavaScript",
"githubLink": "http://not.exists.com"
},
{
"parent" : '000000000000000000000011',
"_id": '000000000000000000000014',
"content" : "# Введение в JavaScript\n\nДавайте посмотрим, что такого особенного в JavaScript, почему именно он, и какие еще технологии существуют, кроме JavaScript.\n[cut]\n## Что такое JavaScript? \n\n*JavaScript* изначально создавался для того, чтобы сделать web-странички \"живыми\". \nПрограммы на этом языке называются *скриптами*. Они подключаются напрямую к HTML и, как только загружается страничка -- тут же выполняются.\n\n**Программы на JavaScript -- обычный текст**. Они не требуют какой-то специальной подготовки.\n\nВ этом плане JavaScript сильно отличается от другого языка, который называется Java.\n\n[smart header=\"Почему <u>Java</u>Script?\"]\nКогда создавался язык JavaScript, у него изначально было другое название: \"LiveScript\". Но тогда был очень популярен язык Java, и маркетологи решили, что схожее название сделает новый язык более популярным.\n\nПланировалось, что JavaScript будет эдаким \"младшим братом\" Java. Однако, история распорядилась по-своему, JavaScript сильно вырос, и сейчас это совершенно независимый язык, со своей спецификацией, которая называется <a href=\"http://en.wikipedia.org/wiki/ECMAScript\">ECMAScript</a>, и к Java не имеет никакого отношения.\n\nУ него много особенностей, которые усложняют освоение, но по ходу учебника мы с ними разберемся.\n[/smart]\n\nЧтобы читать и выполнять текст на JavaScript, нужна специальная программа -- [интерпретатор](http://ru.wikipedia.org/wiki/%D0%98%D0%BD%D1%82%D0%B5%D1%80%D0%BF%D1%80%D0%B5%D1%82%D0%B0%D1%82%D0%BE%D1%80). Процесс выполнения скрипта называют *\"интерпретацией\"*.\n\n[smart header=\"Компиляция и интерпретация, для программистов\"]\nСтрого говоря, для выполнения программ существуют \"компиляторы\" и \"интерпретаторы\". \n\nКомпиляторы преобразуют программу в машинный код. Этот машинный код затем распространяется и запускается. \n\nА интерпретаторы, в частности, встроенный JS-интерпретатор браузера -- получают программу в виде исходного кода. При этом распространяется именно сам исходный код (скрипт).\n\nСовременные интерпретаторы перед выполнением преобразуют JavaScript в машинный код или близко к нему, а уже затем выполняют. \n[/smart]\n\nВо все основные браузеры встроен интерпретатор JavaScript, именно поэтому они могут выполнять скрипты на странице.\n\nНо, разумеется, этим возможности JavaScript не ограничены. Это полноценный язык, программы на котором можно запускать и на сервере, и даже в стиральной машинке, если в ней установлен соответствующий интерпретатор.\n\n## Что умеет JavaScript? \n\nСовременный JavaScript -- это \"безопасный\" язык программирования общего назначения. Он не предоставляет низкоуровневых средств работы с памятью, процессором, так как изначально был ориентирован на браузеры, в которых это не требуется.\n\nЧто же касается остальных возможностей -- они зависят от окружения, в котором запущен JavaScript. \n\nВ браузере JavaScript умеет делать все, что относится к манипуляции со страницей, взаимодействию с посетителем и, в какой-то мере, с сервером: \n\n<ul>\n<li>Создавать новые HTML-теги, удалять существующие, менять стили элементов, прятать, показывать элементы и т.п.</li>\n<li>Реагировать на действия посетителя, обрабатывать клики мыши, перемещение курсора, нажатие на клавиатуру и т.п. </li>\n<li>Посылать запросы на сервер и загружать данные без перезагрузки страницы(эта технология называется "AJAX").</li>\n<li>Получать и устанавливать cookie, запрашивать данные, выводить сообщения...</li>\n<li>...и многое, многое другое!</li> \n</ul>\n\n## Что НЕ умеет JavaScript? \n\nJavaScript -- быстрый и мощный язык, но браузер накладывает на его исполнение некоторые ограничения.. \n\nЭто сделано для безопасности пользователей, чтобы злоумышленник не мог с помощью JavaScript получить личные данные или как-то навредить компьютеру пользователя. \n\nЭтих ограничений нет там, где JavaScript используется вне браузера, например на сервере. Кроме того, различные браузеры предоставляют свои механизмы по установке плагинов и расширений, которые обладают расширенными возможностями, но требуют специальных действий по установке от пользователя\n\n**Большинство возможностей JavaScript в браузере ограничено текущим окном и страницей.**\n\n<img src=\"jslimit.jpg\">\n\n<ul>\n<li>JavaScript не может читать/записывать произвольные файлы на жесткий диск, копировать их или вызывать программы. Он не имеет прямого доступа к операционной системе.\n\nСовременные браузеры могут работать с файлами, но эта возможность ограничена специально выделенной директорией -- *\"песочницей\"*. Возможности по доступу к устройствам также прорабатываются в современных стандартах и частично доступны в некоторых браузерах.\n</li>\n<li>JavaScript, работающий в одной вкладке, не может общаться с другими вкладками и окнами, за исключением случая, когда он сам открыл это окно или несколько вкладок из одного источника (одинаковый домен, порт, протокол).\n\nЕсть способы это обойти, и они раскрыты в учебнике, но они требуют внедрения специального кода на оба документа, которые находятся в разных вкладках или окнах. Без него, из соображений безопасности, залезть из одной вкладки в другую при помощи JavaScript нельзя. \n</li>\n<li>Из JavaScript можно легко посылать запросы на сервер, с которого пришла страница. Запрос на другой домен тоже возможен, но менее удобен, т.к. и здесь есть ограничения безопасности. \n</li>\n</ul>\n\n## В чем уникальность JavaScript? \n\nЕсть как минимум *три* замечательных особенности JavaScript:\n\n[compare]\n+Полная интеграция с HTML/CSS.\n+Простые вещи делаются просто.\n+Поддерживается всеми распространенными браузерами и включен по умолчанию.\n[/compare]\n\n**Этих трёх вещей одновременно нет больше ни в одной браузерной технологии.** Поэтому JavaScript и является самым распространенным средством создания браузерных интерфейсов.\n\n## Тенденции развития. \n\nПеред тем, как вы планируете изучить новую технологию, полезно ознакомиться с ее развитием и перспективами. Здесь в JavaScript всё более чем хорошо.\n\n### HTML 5\n\n*HTML 5* -- эволюция стандарта HTML, добавляющая новые теги и, что более важно, ряд новых возможностей браузерам.\n\nВот несколько примеров:\n<ul>\n<li>Чтение/запись файлов на диск (в специальной \"песочнице\", то есть не любые).</li>\n<li>Встроенная в браузер база данных, которая позволяет хранить данные на компьютере пользователя.</li>\n<li>Многозадачность с одновременным использованием нескольких ядер процессора.</li>\n<li>Проигрывание видео/аудио, без Flash.</li>\n<li>2d и 3d-рисование с аппаратной поддержкой, как в современных играх.</li>\n</ul>\n\nМногие возможности HTML5 всё ещё в разработке, но браузеры постепенно начинают их поддерживать.\n\n[summary]Тенденция: JavaScript становится всё более и более мощным и возможности браузера растут в сторону десктопных приложений.[/summary]\n\n### EcmaScript 6\n\nСам язык JavaScript улучшается. Современный стандарт EcmaScript 5 включает в себя новые возможности для разработки, EcmaScript 6 будет шагом вперёд в улучшении синтаксиса языка.\n\nСовременные браузеры улучшают свои движки, чтобы увеличить скорость исполнения JavaScript, исправляют баги и стараются следовать стандартам.\n\n[summary]Тенденция: JavaScript становится всё быстрее и стабильнее.[/summary]\n\nОчень важно то, что новые стандарты HTML5 и ECMAScript сохраняют максимальную совместимость с предыдущими версиями. Это позволяет избежать неприятностей с уже существующими приложениями.\n\nВпрочем, небольшая проблема с HTML5 всё же есть. Иногда браузеры стараются включить новые возможности, которые еще не полностью описаны в стандарте, но настолько интересны, что разработчики просто не могут ждать. \n\n...Однако, со временем стандарт меняется и браузерам приходится подстраиваться к нему, что может привести к ошибкам в уже написанном (старом) коде. Поэтому следует дважды подумать перед тем, как применять на практике такие \"супер-новые\" решения.\n\nПри этом все браузеры сходятся к стандарту, и различий между ними уже гораздо меньше, чем всего лишь несколько лет назад.\n\n[summary]Тенденция: всё идет к полной совместимости со стандартом.[/summary]\n\n## Недостатки JavaScript\n\nЗачастую, недостатки подходов и технологий -- это обратная сторона их полезности. Стоит ли упрекать молоток в том, что он -- тяжелый? Да, неудобно, зато гвозди забиваются лучше.\n\nВ JavaScript, однако, есть вполне объективные недоработки, связанные с тем, что язык, по выражению его автора (Brendan Eich) делался \"за 10 бессонных дней и ночей\". Поэтому некоторые моменты продуманы плохо, есть и откровенные ошибки (которые признает тот же Brendan). \n\nКонкретные примеры мы увидим в дальнейшем, т.к. их удобнее обсуждать в процессе освоения языка.\n\nПока что нам важно знать, что некоторые \"странности\" языка не являются чем-то очень умным, а просто не были достаточно хорошо продуманы в своё время. В этом учебнике мы будем обращать особое внимание на основные недоработки и \"грабли\". Ничего критичного в них нет, если знаешь -- не наступишь.\n\n**В новых версиях JavaScript (ECMAScript) эти недостатки постепенно убирают.** \n\nПроцесс внедрения небыстрый, в первую очередь из-за старых версий IE, но они постепенно вымирают. Современный IE в этом отношении несравнимо лучше.", "isFolder" : false,
"weight" : 2,
"slug" : "article2",
"title" : "Введение в JavaScript",
"githubLink": "http://not.exists.com"
},
{
"parent" : '000000000000000000000012',
"_id": '000000000000000000000015',
"content" : "# И ещё про JavaScript\n\n ...", "isFolder" : false,
"weight" : 3,
"slug" : "article3",
"title" : "И ещё про JavaScript",
"githubLink": "http://not.exists.com"
}
];