Есть такая «секретная» ссылка: www.youtube.com/get_video_info?video_id=XXXXXX
Вместо XXXXXX подставьте хэш видео, который в ссылке на ролик, типа youtu.be/BWCiWZtrWXU после слеша.

По этой (первой) ссылке вернутся URL-encoded данные. Распакуйте их и возьмите параметр url_encoded_fmt_stream_map. Его значение опять надо распаковать как URL-параметры. И из результата вытащить параметр url – это ссылка на единый скачивабельный видеофайл.

Например, в консоли браузера:

function getUrlParams(search) {
    let hashes = search.slice(search.indexOf('?') + 1).split('&')
    let params = {}
    hashes.map(hash => {
        let [key, val] = hash.split('=')
        params[key] = decodeURIComponent(val)
    })

    return params
}
var s = '------'; // здесь длиннющая строка из ответа /get_video_info
var a = getUrlParams(s);
var b = getUrlParams(a.url_encoded_fmt_stream_map);
console.log(b.url); // эту ссылку открываем в браузере - это скачиваемый видеофайл

Очень надеюсь, что вы покопаетесь в этих данных более подробно, разберётесь, как получать прямые ссылки на скачиваемые файлы во всех форматах и размерах, которые предлагает YouTube, и напишете короткий материал на Хабр по результатам, а также опубликуете gist с рабочим кодом для консоли браузера.

Сокращалка, удобная для indexOf(), который возвращает -1 если не найдено, или индекс от 0 и больше.

Для логики приложения часто бывает нужно узнать только, найдено или нет: т.е. -1 или иное значение. Можно просто сравнивать if (a.indexOf(b) > -1) { /* найдено! */ } но иногда хочется короче.

Битовый оператор НЕ ~ хорош тем, что выделяет -1: только -1 с этим оператором даст 0. Прочие числа дадут какое-то ненулевое значение.

~(-1) === 0

Остаётся привести значение из численного в булево. Для этого два воскл. знака — два логических НЕ.

• для варианта «найдено» из числа от 0 и больше получилось тоже ненулевое число, и !! даст true
  
• для варианта «не найдено» из -1 получится уникальный 0, и !!0 вернёт false
  

Попробую на пальцах объяснить.

Событие – это конверт, на котором написано его название. Внутрь конверта можете вложить что-нибудь, а можете оставить конверт пустым.

Элемент – это столик. Кто угодно может подойти и положить на столик свой конверт.

Слушатель – это мужик, который топчется около столика и смотрит, нет ли чего с интересующим его названием. Может несколько человек поджидать конвертики с определённым названием – прочтут все, если только в конверте не написано «по прочтении съесть» – тогда кто-то съест и дальше не передаст.

Как создать/отправить конверт. В любом месте кода создайте конверт и дайте ему название: var myEvent = new Event('teaTime'); Остается положить конверт на нужный столик:

document.getElementById('stolik').dispatchEvent(myEvent);

Чтобы в событие вложить какие-то данные, нужно использовать другой конструктор и передать нагрузку в поле detail:

var event = new CustomEvent('saySomething', { detail: "Hello there!" });

Для чего нужно создавать свои события? Чтобы развязать куски кода. Например, в разных местах документа можно нажать на кнопку повторяющегося виджета. Виджет создаст на document событие "widgetClicked". А ещё несколько одинаковых компонентов в странице, слушающих document на предмет события "widgetClicked", получат пинок и что-нибудь вытворят.

CSS свойство background – это просто сокращение, позволяющее одним значением установить сразу несколько из свойств background-*:

• background-clip
  
• background-color
  
• background-image
  
• background-origin
  
• background-position
  
• background-repeat
  
• background-size
  
• background-attachment

Указанные значения (в любом порядке) устанавливают свойства точно так же, как и отдельные инструкции. Не указанные сохраняют значения по умолчанию.

Таким образом, background: #F90 полностью эквивалентен background-color: #F90

Например, background: #F90 url(fon.jpg) repeat-x равен

background-color: #F90;
background-image: url(fon.jpg);
background-repeat: repeat-x;

Цвета – разные цветовые модели бывают удобны для разных задач. Например, в модели HSL легко «гасить» свет, изменяя только его компоненту L (яркость), или только уменьшая насыщенность S. Или получить палитру из нескольких цветов, одинаково ярких-сочных, но равномерно разбросанных по кругу оттенков, равномерно раскидав их H по цветовому кругу, а S и L оставив одинаковыми.