Notes

Ограничения
файловая система (есть песочница)
заходить на иные сервера
лазить в другие вкладки

HTML 5
Чтение/запись файлов на диск (в специальной «песочнице», то есть не любые).
Встроенная в браузер база данных, которая позволяет хранить данные на компьютере пользователя.
Многозадачность с одновременным использованием нескольких ядер процессора.
Проигрывание видео/аудио, без Flash.
2D и 3D-рисование с аппаратной поддержкой, как в современных играх.

babel - новые возможности в старые версии
cofee script
type script

Спецификации http://learn.javascript.ru/pre-coding

Встраивание
в html
<script> # Пред версии html требвоали атрибут type="text/javascript"
alert( 'Привет, Мир!' );
</script>

Браузер, когда видит <script>:
1. Начинает отображать страницу, показывает часть документа до script
2. Встретив тег script, переключается в JavaScript-режим и не показывает, а исполняет его содержимое.
3. Закончив выполнение, возвращается обратно в HTML-режим и только тогда отображает оставшуюся часть документа.

Атрибут <script language=…>
Этот атрибут предназначен для указания языка, на котором написан скрипт. По умолчанию, язык – JavaScript, так что и этот атрибут ставить необязательно.

В совсем старых руководствах и книгах иногда рекомендуют использовать HTML-комментарии внутри SCRIPT, чтобы спрятать Javascript от браузеров, которые не поддерживают его.
Уже не актуально

Внещний файл
<script src="/path/to/script.js"></script>
Чтобы подключить несколько скриптов, используйте несколько последовательно идущих тегов <script>

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

В одном теге SCRIPT нельзя одновременно подключить внешний скрипт и указать код. Если указан атрибут src, то содержимое тега игнорируется.


При интерпритации html браузер не ждет пока подгрузятся внещние фйлы (картинки, видео и тд) и отображается страницу дальше.
Если же встречается javascript, то браузер приостанавливает интерпритацию (рендер???) html на предыдущей строке, подгружает и исполняет скрипт и после этого продолжает исполнять html


Атрибуты асинхронности
async
defer - сохраняет порядок исполнения, скрипты начинают исполнятся после полной интерпритации html (важно, если скрипт взаимодействует с домом)
При одновременном указании async и defer в современных браузерах будет использован только async, в IE9- – только defer (не понимает async).
IE9 не поддерживает async
Работают только для внешних скриптов

Для продвинутого читателя, который знает, что теги <script> можно добавлять на страницу в любой момент при помощи самого javascript, заметим, что скрипты, добавленные таким образом, ведут себя так же, как async. То есть, выполняются как только загрузятся, без сохранения относительного порядка.
Если же нужно сохранить порядок выполнения, то есть добавить несколько скриптов, которые выполнятся строго один за другим, то используется свойство script.async = false.

function addScript(src){
var script = document.createElement('script');
script.src = src;
script.async = false; // чтобы гарантировать порядок
document.head.appendChild(script);
}

addScript('1.js'); // загружаться эти скрипты начнут сразу
addScript('2.js'); // выполнятся, как только загрузятся
addScript('3.js'); // но, гарантированно, в порядке 1 -> 2 -> 3


[1, 2].forEach(alert)



alert("Сейчас будет ошибка")
[1, 2].forEach(alert)
Выведется только первый alert, а дальше – ошибка. Потому что перед квадратной скобкой JavaScript точку с запятой не ставит, а как раз здесь она нужна (упс!).


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

//коммент

/*
коммент
*/


Вложенные комментарии не поддерживаются!
В этом коде будет ошибка:
/*
/* вложенный комментарий ?!? */
*/
alert('Мир');



Используйте горячие клавиши!
В большинстве редакторов комментарий можно поставить горячей клавишей, обычно это Ctrl+/ для однострочных и что-то вроде Ctrl+Shift+/ – для многострочных комментариев (нужно выделить блок и нажать сочетание клавиш). Детали смотрите в руководстве по редактору.

существуют инструменты сжатия JavaScript, которые при публикации кода легко удалят коменты и тем самым уменьшат размер итого файла

Так было до появления стандарта ECMAScript 5 (ES5), который одновременно добавил новые возможности и внёс в язык ряд исправлений, которые могут привести к тому, что старый код, который был написан до его появления, перестанет работать.
Чтобы этого не случилось, решили, что по умолчанию эти опасные изменения будут выключены, и код будет работать по-старому. А для того, чтобы перевести код в режим полного соответствия современному стандарту, нужно указать специальную директиву use strict.
Эта директива не поддерживается IE9-.

Директива выглядит как строка "use strict"; или 'use strict'; и ставится в начале скрипта.
Отменить действие use strict никак нельзя
use strict также можно указывать в начале функций, тогда строгий режим будет действовать только внутри функции.

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


Можно даже объявить несколько переменных сразу:
var user = 'John', age = 25, message = 'Hello';

ссылки на изменяющиеся объекты
m1 = [1, 2, 3]
m2 = m1
m1[1] = 99
m1
// (1, 99, 3)
m2
// (1, 99, 3)
m1 === m3
//True

Изучение какого-нибудь функционального языка рекомендуется для расширения кругозора.

На имя переменной в JavaScript наложены всего два ограничения.
Имя может состоять из: букв, цифр, символов $ и _
Первый символ не должен быть цифрой.
Что особенно интересно – доллар '$' и знак подчеркивания '_' являются такими же обычными символами, как буквы:
var $ = 1;
var _ = 2;

Регистр букв имеет значение. Переменные apple и AppLE – две разные переменные.
Русские буквы допустимы, но не рекомендуются (из-за традиций и мультиязычности)

Существует список зарезервированных слов, которые нельзя использовать для переменных, так как они используются самим языком, например: var, class, return, export и др.

В старом стандарте JavaScript разрешалось создавать переменную и без var, просто присвоив ей значение num = 5; // переменная num будет создана, если ее не было. В режиме "use strict" так делать уже нельзя.

Константа – это переменная, которая никогда не меняется. Как правило, их называют большими буквами, через подчёркивание. Например:
var COLOR_RED = "#F00";
Технически, константа является обычной переменной, то есть её можно изменить. Но мы договариваемся этого не делать.

Зачем нужны константы? Почему бы просто не писать var color = "#FF7F00"?
Во-первых, константа COLOR_ORANGE – это понятное имя. По присвоению var color="#FF7F00" непонятно, что цвет – оранжевый. Иными словами, константа COLOR_ORANGE является «понятным псевдонимом» для значения #FF7F00.
Во-вторых, опечатка в строке, особенно такой сложной как #FF7F00, может быть не замечена, а в имени константы её допустить куда сложнее.

Технически, можно просто записать значение и без объявления (ver) переменной, однако по ряду причин (каких???) это не рекомендуется.

Правила именования переменных
1. Никакого транслита, только инглиш
2. Короткие неосмысленные имена (i, j, k) применяться только в небольших фрагментах кода, где их значение самоочевидно
3. Использовать верблюжьюНотациюБезПробелов (корче, учже юзается в дфеолтных именах)
4. Релевантность имени хранимому содержмому. Имя переменной должно максимально чётко соответствовать хранимым в ней данным


Позвольте поделиться одним небольшим секретом, который очень прост, но позволит улучшить названия переменных и сэкономит время.
Бывает так, что, написав код, мы через некоторое время к нему возвращаемся, надо что-то поправить. И мы примерно помним, что переменная, в которой хранится нужное вам значение, называется… Ну, скажем, borderLeftWidth. Мы ищем её в коде, не находим, но, разобравшись, обнаруживаем, что на самом деле переменная называлась вот так: leftBorderWidth.
Если мы ищем переменную с одним именем, а находим – с другим, то зачастую самый лучший ход – это переименовать переменную, чтобы имя было тем, которое вы искали.
То есть, в коде leftBorderWidth, а мы её переименуем на ту, которую искали: borderLeftWidth.
Зачем? Дело в том, что в следующий раз, когда вы захотите что-то поправить, то вы будете искать по тому же самому имени. Соответственно, это сэкономит вам время.
Есть причина и поважнее. Поскольку именно это имя переменной пришло в голову – скорее всего, оно больше соответствует хранимым там данным, чем то, которое мы придумали изначально. Исключения бывают, но в любом случае – такое несовпадение – это повод задуматься.

Храните в переменной то, что следует
Бывают ленивые программисты, которые, вместо того чтобы объявить новую переменную, используют существующую.
В результате получается, что такая переменная – как коробка, в которую кидают то одно, то другое, то третье, при этом не меняя название. Что в ней лежит сейчас? А кто его знает… Нужно подойти, проверить.
Сэкономит такой программист время на объявлении переменной – потеряет в два раза больше на отладке кода.
"Лишняя" переменная – добро, а не зло.



ТИПЫ ДАННЫХ
ПРИМИТИВНЫЕ
1. число
2. строка
3. булево
4. null
5. undefined
6. symbol # ES6
ОСОБЫЕ
7. object

---number

Единый для целых/дробных
Существуют специальные числовые значения Infinity (бесконечность) и NaN (ошибка вычислений).

Например, бесконечность Infinity получается при делении на ноль:
alert( 1 / 0 ); // Infinity
Ошибка вычислений NaN будет результатом некорректной математической операции, например:
alert( "нечисло" * 2 ); // NaN, ошибка

--string

В JavaScript одинарные и двойные кавычки равноправны. Тип символ не существует, есть только строка.

--null
Значение null не относится ни к одному из типов выше, а образует свой отдельный тип, состоящий из единственного значения null:
var age = null;
В JavaScript null не является «ссылкой на несуществующий объект» или «нулевым указателем», как в некоторых других языках. Это просто специальное значение, которое имеет смысл «ничего» или «значение неизвестно».
В частности, код выше говорит о том, что возраст age неизвестен.

--undefined
Значение undefined, как и null, образует свой собственный тип, состоящий из одного этого значения. Оно имеет смысл «значение не присвоено».
Если переменная объявлена, но в неё ничего не записано, то её значение как раз и есть undefined:
var x;
alert( x ); // выведет "undefined"
Можно присвоить undefined и в явном виде, хотя это делается редко:
var x = 123;
x = undefined;
alert( x ); // "undefined"
В явном виде undefined обычно не присваивают, так как это противоречит его смыслу. Для записи в переменную «пустого» или «неизвестного» значения используется null.


--object

Используется для коллекций данных и для объявления более сложных сущностей.
Объявляются объекты при помощи фигурных скобок {...}, например:
var user = { name: "Вася" };


Оператор typeof возвращает тип аргумента.
У него есть два синтаксиса: со скобками и без:
Синтаксис оператора: typeof x.
Синтаксис функции: typeof(x).
Работают они одинаково, но первый синтаксис короче.


typeof null // "object" (1)
typeof function(){} // "function" (2)

1. Результат typeof null == "object" – это официально признанная ошибка в языке, которая сохраняется для совместимости. На самом деле null – это не объект, а отдельный тип данных.
2. Функции мы пройдём чуть позже. Пока лишь заметим, что функции не являются отдельным базовым типом в JavaScript, а подвидом объектов. Но typeof выделяет функции отдельно, возвращая для них "function". На практике это весьма удобно, так как позволяет легко определить функцию.