Изучаем программирование на JavaScript

Если до этого момента вы не написали ни строчки кода, не беда – эта книга поможет в доступной форме войти в курс дела. Вы узнаете, почему браузеры по-разному реагируют на программы JavaScript и как писать универсальный, понятный всем код. Учебник подойдёт начинающим программистам – формат не покажется скучным или однообразным.

Напишите функцию, которая принимает массив из цифр и строк и возвращает массив только из цифр.

Примеры:

 filter_list([1,2,'a','b'])
 //[1,2]

 filter_list([1,'a','b',0,15])
 //[1,0,15]

 filter_list([1,2,'aasf','1','123',123])
 //[1,2,123]

Д. Крокфорд – Как устроен JavaScript

Специалист в области JS в доходчивой форме объясняет основы и устройство языка: имена, числа, логические значения, символы и прочее. У всех новичков бывают трудности с типизацией – эта книга поможет научиться их избегать. В конце вас ждут объектно-ориентированный подход, программирование без классов и функции высшего порядка.

Как изучить React и построить международную карьеру?

🔥Максим Иванов, разработчик Minecraft и Battlefield, запускает авторский курс по React.

Курс стартует 1 ноября, но уже можно начать учиться бесплатно не выходя из Телеграма:
⭐️Как сделать клон Minecraft на React (делаем 3d-игру на компонентах)
⭐️Как делать формы любой сложности на React и react-hook-form
⭐️Как освоить реакт быстро, не тратя время на булщит? 💩
⭐️Как попасть в интересный проект? Самая короткая дорога от hello world до удаленки за баксы 🔥
⭐️Как справиться с застреванием в процессе обучения и в карьере
💥Инсайт: Как всех обогнать. Прокачиваем карьеру. Как в этом помогает блог и привычка описывать свои шаги.📝

Чтобы получить доступ материалам, переходи в наш Телеграм-бот. Он заботливо выдаст все видео.

Что такое БЭМ и в чем его польза?
БЭМ (Блок, Элемент, Модификатор) — компонентный подход к веб-разработке. В его основе лежит принцип разделения интерфейса на независимые блоки. Он позволяет легко и быстро разрабатывать интерфейсы любой сложности и повторно использовать существующий код, избегая «Copy-Paste».

Что такое Блок?
Это Функционально независимый компонент страницы, который может быть повторно использован. В HTML блоки представлены атрибутом class.

Что такое элемент?
Составная часть блока, которая не может использоваться в отрыве от него.

Элементы можно вкладывать друг в друга.
Допустима любая вложенность элементов.
Элемент — всегда часть блока, а не другого элемента

Что такое data-атрибуты, и привести примеры, когда они полезны?

data - атрибуты позволяют хранить дополнительную информацию в стандартных элементах HTML
любой атрибут, чьё имя начинается с data-, является data - атрибутом
<article
id="electriccars"
data-columns="3"
data-index-number="12314"
data-parent="cars">
</article>
Чтобы получить data-атрибут можно взять свойство объекта dataset с именем, равным части имени атрибута после data- (обратите внимание, что дефисы в имени преобразуются в camelCase).
var article = document.getElementById('electriccars');
article.dataset.columns // "3"
article.dataset.indexNumber // "12314"
article.dataset.parent // "cars"
Каждое свойство является строкой и может быть прочитано и записано.

Также можно использовать селекторы атрибутов в CSS для изменения стилей в соответствии с данным:

 article[data-columns='3']{ width: 400px; }
 article[data-columns='4']{ width: 600px; }

Напишите функцию, которая будет обрабатывать url, удаляя в нем всё после знака #

Примеры:

// returns 'www.codewars.com'
removeUrlAnchor('www.codewars.com#about')

// returns 'www.codewars.com?page=1'
removeUrlAnchor('www.codewars.com?page=1')

Что такое doctype и зачем он нужен?

Элемент <!doctype> — DTD (document type definition, описание типа документа) указывает тип документа, который используется при написании html кода. Это непарный тег, который должен стоять самым первым в коде каждой страницы вашего сайта.

Директива doctype необходима, чтобы браузер понимал как обрабатывать текущую веб-страничку, так как существует несколько версий языка HTML, а еще имеется XHTML (EXtensible HyperText Markup Language, расширенный язык разметки гипертекста), который похож на HTML, но различается с ним по синтаксису.

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

Для чего нужна директива use strict?

Режим strict (строгий режим), введенный в ECMAScript 5, позволяет использовать более строгий вариант JavaScript

Во первых, строгий режим делает невозможным случайное создание глобальных переменных.

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

 var undefined = 5; // выдаст TypeError

В-третьих, в строгом режиме попытки удалить неудаляемые свойства будут вызывать исключения (в то время как прежде такая попытка просто не имела бы эффекта):

 "use strict";
  delete Object.prototype; // выдаст TypeError

В-четвёртых, строгий режим требует, чтобы все свойства, перечисленные в сериализованном объекте, встречались только один раз.

 "use strict"; var o = { p: 1, p: 2 }; // !!! синтаксическая ошибка

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

 function sum(a, a, c) { // !!! синтаксическая ошибка 
 "use strict";
  return a + a + c; // ошибка

Что такое тернарный оператор?

Условный (тернарный) оператор - единственный оператор в JavaScript, принимающий три операнда: условие, за которым следует знак вопроса (?), затем выражение, которое выполняется, если условие истинно, сопровождается двоеточием (:), и, наконец, выражение, которое выполняется, если условие ложно. Он часто используется в качестве укороченного варианта условного оператора if.

Синтаксис:

 let result = условие ? значение1 : значение2;