Ява скрипт программирование: Страница не найдена

Содержание

бесплатное обучение онлайн, 39 уроков

Включено в курс

39 уроков (видео и/или текст)

47 упражнений в тренажере

133 проверочных теста

Дополнительные материалы

Помощь в «Обсуждениях»

Чему вы научитесь

Создавать программы, используя основные конструкции языка (условия, циклы, функции и другие)
Составлять программы, состоящие из нескольких модулей
Правильно анализировать ошибки в коде и пользоваться отладочной печатью при их поиске

Описание

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

модули импорты отладка программы ошибки

Уроки курса

Продолжительность 50 часов

Введение
Познакомиться с курсом
теория
Hello, World!
Написать первую программу
теория
тесты
упражнение
Инструкции
Изучить азы построения программ на JavaScript
теория
тесты
упражнение
Арифметические операции
Переведем арифметические действия на язык программирования
теория
тесты
упражнение
Ошибки оформления (синтаксиса и линтера)
Изучить виды ошибок и способы их решения
теория
тесты
упражнение
Строки
Научиться работать со строками
теория
тесты
упражнение
Переменные
Научиться хранить информацию и переиспользовать уже существующие данные
теория
тесты
упражнение
Выражения в определениях
Научиться упрощать код, используем переменные
теория
тесты
упражнение
Именование
Научимся правильно именовать переменные
теория
тесты
упражнение
Интерполяция
Изучить еще один способ работать со строками в JavaScript

теория
тесты
упражнение
Извлечение символов из строки
Научиться получать значения из строк
теория
тесты
упражнение
Типы данных
Умножим число на строку, познакомимся с типами данных
теория
тесты
упражнение
Неизменяемость и примитивные типы
Узнаем, может ли JavaScript преобразовывать строки или числа
теория
тесты
упражнение
Функции и их вызов
Научиться использовать готовые функции
теория
тесты
упражнение
Сигнатура функции
Узнать, как функция принимает и возвращает значения

теория
тесты
упражнение
Вызов функции — выражение
Научиться использовать результат работы функций
теория
тесты
упражнение
Функции с переменным числом параметров
Познакомиться с расширенными возможностями функций
теория
тесты
упражнение
Детерминированность
Изучить некоторые свойства функций и особенности их работы
теория
тесты
упражнение
Стандартная библиотека
Познакомимся со стандартной библиотекой
теория
тесты
упражнение
Свойства и методы

Научиться использовать встроенные в JavaScript атрибуты данных.
теория
тесты
упражнение
Цепочка вызовов
Научиться выстраивать методы в цепочки
теория
тесты
упражнение
Определение функций
Научиться создавать функции
теория
тесты
упражнение
Возврат значений
Научиться использовать результат работы функции
теория
тесты
упражнение
Параметры функций
Научиться передавать данные в функцию
теория
тесты
упражнение
Необязательные параметры функций

Задаём значения по умолчанию
теория
тесты
упражнение
Упрощенный синтаксис функций
Научиться писать лаконичный код
теория
тесты
упражнение
Логика
Изучить, что такое логический тип и как применять логические операции
теория
тесты
упражнение
Логические операторы
Учимся писать составные условия
теория
тесты
упражнение
Результат логических операций
Глубже про логические операции
теория
тесты
упражнение
Условные конструкции
Научиться задавать поведение программы в зависимости от разных условий
теория

тесты
упражнение
Тернарный оператор
Научиться писать лаконичный код для условий
теория
тесты
упражнение
Конструкция Switch
Изучить специальную версию if для множественных условий
теория
тесты
упражнение
Цикл while
Научиться писать программы для выполнения повторяющихся действий
теория
тесты
упражнение
Агрегация данных
Познакомиться с отдельным классом задач, где применяются циклы
теория
тесты
упражнение
Обход строк в цикле
Научиться обрабатывать и собирать строки в цикле
теория
тесты
упражнение
Условия внутри тела цикла
Научиться управлять поведением программы в цикле
теория
тесты
упражнение
Инкремент и декремент
Познакомиться с унарными операциями
теория
тесты
упражнение
Цикл for
Изучим еще один цикл в JavaScript
теория
тесты
упражнение
Модули
Знакомимся с модулями — способом разделения программ на составные части и переиспользования частей.
теория
тесты
упражнение

Формат обучения

Испытания

Это практические задания, которые мы советуем выполнить после завершения курса. Задания помогут вам получить дополнительный опыт в программировании и закрепить полученные навыки. Обычно мы рекомендуем выполнить 3-5 испытаний. Но если не получается, не отчаивайтесь. Просто вернитесь к ним позже

Все

Алсу09 августа 2022

Спасибо! Прошла последний урок в курсе. Я в целом прохожу все медленно, и пока я проходила массивы, предыдущий курс по введению в программированию был заменен на данный курс. Такое ощущение, будто замечания по старому курсу действительно учли в этом новом, некоторые темы объясняются более удобно и последовательно, как раз там, где этого не хватало (на мой взгляд). Но здесь не было рекурсии. Видимо, ее включили в другие курсы?

Рекомендуемые программы

С нуля до разработчика. Возвращаем деньги, если не удалось найти работу.

Профессия

Фронтенд-разработчик

Разработка фронтенд-компонентов для веб-приложений

20 октября 10 месяцев

Профессия

Node.js-разработчик

Разработка бэкенд-компонентов для веб-приложений

20 октября 10 месяцев

Профессия

Fullstack-разработчик

Разработка фронтенд- и бэкенд-компонентов для веб-приложений

20 октября 16 месяцев

JavaScript — Прототипно-ориентированный язык программирования / Хабр

Прототипно-ориентированный язык программирования

Статьи Авторы Компании

Сначала показывать

Порог рейтинга

Mstikh 000Z» title=»2022-10-17, 17:48″>

вчера в 17:48

JavaScript *PostgreSQL *C++ *DevOps *VueJS *

Почти три года назад мы запустили сервис для управления проектами, но без ошибок не обошлось. Делюсь опытом, чтобы на наши грабли больше никто не наступил.

Всего голосов 8: ↑5 и ↓3 +2

Просмотры

1.5K

Комментарии 10

ganqqwerty вчера в 09:49

PHP *JavaScript *Программирование *Java *Регулярные выражения *

Tutorial

Хороший код читается легко, как проза. Многие книги учат нас тому, как важно делить код на небольшие, повторно используемые, легко потребляемые блоки.

Но почему-то, в случае с регэкспами у программистов как будто появляется слепое пятно на чувстве стиля. Вот такая регулярка – совершенно обычное дело:

/^(0[1-9]|1[012])[- /. ](0[1-9]|[12][0-9]|3[01])[- /.]((19|20)\d\d)$/

А чо не так-то?

Всего голосов 18: ↑11 и ↓7 +4

Просмотры

2.7K

Комментарии 43

TourmalineCore 16 октября в 09:01

Тестирование IT-систем *JavaScript *Криптовалюты

Из песочницы

Тестирование приложений через сквозные (end-to-end) тесты сейчас довольно популярно. Этот вид тестирования позволяет оценить работоспособность приложения со стороны пользователя. Поэтому компания, в которой я работаю, внедряет этот вид тестирования в проекты.

Летом 2022 года мы разрабатывали блокчейн приложение. Моя задача заключалась в проведении E2E тестирования DApp [Децентрализованное приложение — приложение, которое базируется на технологии блокчейн совместно с механизмом распределенного выполнения необходимых инструкций]. Но мы столкнулись с проблемой — готовых решений для проведения end-to-end тестирования DApp под нашу конкретную задачу не было. Эта статья о том, как мы решали эту проблему.

Всего голосов 6: ↑6 и ↓0 +6

Просмотры

792

Комментарии 0

savvaleukhin 15 октября в 17:05

JavaScript *ReactJS *

Из песочницы

Создадим приложение с использованием фреймворка Next.js, настроим облачные сервисы Amazon S3, Amazon CloudFront, AWS Lambda@Edge, развернем приложение и настроим маршрутизацию доменного имени.

Всего голосов 10: ↑10 и ↓0 +10

Просмотры

1.8K

Комментарии 1

aio350 000Z» title=»2022-10-13, 15:34″>13 октября в 15:34

Блог компании Timeweb Cloud Разработка веб-сайтов *JavaScript *ReactJS *

Перевод

Привет, друзья!

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

Дорогой React, мы встречаемся уже почти 10 лет. Мы прошли долгий путь вместе. Но ситуация вышла из-под контроля. Нам нужно поговорить.

Читать дальше →

Всего голосов 37: ↑35 и ↓2 +33

Просмотры

11K

Комментарии 27

Yorick 12 октября в 13:37

JavaScript *Node.JS *Биллинговые системы *

Если вы делаете финансовый проект или проект в сфере крипты, в котором сохраняются финансовые данные, вам понадобится модуль, который будет отвечать за правильную работу с финансовыми данными.

Правильное решение — это со старта внедрять бухгалтерию с двойной записью (double ledger).

Людям, не знакомым с принципами бухгалтерии, кажется, что бухгалтерия это сложно. На самом деле это не так, и я покажу вам, почему.

Всего голосов 10: ↑8 и ↓2 +6

Просмотры

1.8K

Комментарии 2

melkor_morgoth 11 октября в 09:38

Блог компании Норд Клан JavaScript *

Есть MVC-приложение на frontend, которое активно расширяется: создаются новые модели, представления и контроллеры.
Со временем такое приложение начинает напоминать лабиринт из моделей, а баги, живущие в этом лабиринте превращаются в настоящих минотавров. Но все не так плохо, похоже есть нить, которая ведет из этого лабиринта…

Выбраться из лабиринта

Всего голосов 7: ↑4 и ↓3 +1

Просмотры

1. 2K

Комментарии 10

anador 10 октября в 19:43

Разработка веб-сайтов *JavaScript *Расширения для браузеров

Всем привет! Сталкивались ли вы с ситуацией, когда в вашей админке пользователям трудно интуитивно разобраться, возможности быстро исправить это нет, а существующую документацию по ней никто не читает? Знакомы ли вам частые вопросы вида «А как это настроить?» или «А можно ли сделать настройками X?», ответы на которые уже описаны?

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

Всего голосов 7: ↑7 и ↓0 +7

Просмотры

1. 4K

Комментарии 0

amorev 10 октября в 16:11

JavaScript *Управление проектами *Управление продуктом *Лайфхаки для гиков

Реализация автоматического импорта событий из календаря Notion в свой Google Calendar. Также, под катом, ссылка на npm пакет, упрощающий данную процедуру и пример запуска данного решения без аренды своего сервера.

Всего голосов 9: ↑9 и ↓0 +9

Просмотры

1.1K

Комментарии 2

upronin 9 октября в 21:03

JavaScript *HTML *Maps API *Визуализация данных *DIY или Сделай сам

Идея создать проект «По местам съёмок фильма «Брат» пришла спонтанно, когда я собирался в поездку в Санкт-Петербург. Подумал о том, что я могу объединить профессиональные знания в картографии и своё почтительное отношение к фильму, тем более, что совсем недавно было 25 лет со дня выпуска фильма. Стандартные туристические маршруты надоели. Мне не нравится гулять там, где ходят толпы туристов, делая одни и те же фотографии.

Первый этап — это понимание того, где конкретно снят тот или иной фрагмент. Информацию искал в интернете, но многие точки были описаны очень неконкретно. Двор на такой-то улице или Морская набережная, 15Б, а по факту этот дом на 29 подъездов. Приходилось на месте искать точки съемки и делать фото, потом уточнять точки в геоинформационной программе на карте QGIS.

Всего голосов 93: ↑84 и ↓9 +75

Просмотры

10K

Комментарии 8

Bright_Translate 9 октября в 13:00

Блог компании RUVDS. com JavaScript *Периферия Физика DIY или Сделай сам

Перевод

Tutorial

Небольшой и доступный проект по сборке лазерного сканирующего микроскопа на основе двух оптических головок и многофункционального инструмента “Analog Discovery”. Одно из преимуществ такого микроскопа в возможности выравнивания лазерного пятна относительно изучаемого образца с точностью до микрометра.

Читать дальше →

Всего голосов 71: ↑66 и ↓5 +61

Просмотры

16K

Комментарии 29

alikinSV 8 октября в 16:42

JavaScript *Программирование *

Из песочницы

В голове почти любого человека начиная с 2018-2019 года появляются мысли о том, чтобы поменять профессию на что-то около IT. Эти мысли сразу разбиваются о скалы нескольких больших мифов.

Всего голосов 46: ↑24 и ↓22 +2

Просмотры

34K

Комментарии 129

dunai12 7 октября в 10:57

Блог компании Альфа-Банк JavaScript *Программирование *Проектирование и рефакторинг *ReactJS *

Tutorial

Я люблю сталкиваться с трудностями. Но с такими, которые можно решить, подумать над интересным решением, подобрать технологию. Люблю быть в потоке, а после решения чувствую себя настоящим профессионалом.

Но есть кое-что, из-за чего я не люблю программировать. Как ни странно, это тоже трудности, только другого рода. Например, когда, чтобы пофиксить баг, приходится разбираться с легаси-компонентом, который написан на классах на 300 строк кода. Разбираясь уже второй час, ловлю себя на мысли, что уже 10 минут просто смотрю в экран, а в голове «из-за угла» выглядывает мысль «Псс, парень, программирование — это не твое». Такие задачи не вызывают удовлетворения.

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

Всего голосов 15: ↑15 и ↓0 +15

Просмотры

2.8K

Комментарии 4

aio350 7 октября в 08:49

Блог компании Timeweb Cloud Разработка веб-сайтов *JavaScript *

Перевод

Привет, друзья!

Представляю вашему вниманию перевод этой замечательной статьи, посвященной 4 малоизвестным API, которые в некоторых ситуациях могут оказаться весьма полезными:

Page Visibility API;
Web Share API;
Broadcast Channel API;
Internationalization API.

Код примеров на GitHub.

Читать дальше →

Всего голосов 41: ↑41 и ↓0 +41

Просмотры

6.6K

Комментарии 0

Kilor 4 октября в 15:50

Блог компании Тензор Высокая производительность *JavaScript *Программирование *Node.JS *

Tutorial

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

Но мы рассматривали все-таки идеальную ситуацию, когда основной поток больше ничем не занимался, кроме обмена с «подчиненными» уже заранее готовыми данными. В реальных же приложениях такое встречается достаточно редко — обычно эти самые данные приходится готовить непосредственно перед передачей. И, бывает, в этом участвует существенная доля синхронного кода, что для JavaScript крайне неприятно, но иногда неизбежно — например, при вычислении регулярных выражений.

Давайте оценим, насколько синхронные операции «роняют» производительность нашего тестового приложения. И узнаем, как можно в разы улучшить ее, «скрестив ужа с ежом», используя

выделенный поток-координатор из позапрошлой части статьи совместно с разделяемой памятью.

Всего голосов 15: ↑13 и ↓2 +11

Просмотры

1.9K

Комментарии 12

qmzik 3 октября в 18:56

CSS *JavaScript *HTML *

Перевод

Браузеры постоянно добавляют новые функции HTML, JavaScript и CSS. Вот несколько полезных дополнений к работе с формами, которые вы могли пропустить…

Всего голосов 20: ↑18 и ↓2 +16

Просмотры

11K

Комментарии 11

andrejsharapov 000Z» title=»2022-10-03, 00:53″>3 октября в 00:53

Веб-дизайн *CSS *JavaScript *GitHub *VueJS *

Из песочницы

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

Всего голосов 11: ↑9 и ↓2 +7

Просмотры

2.9K

Комментарии 10

OldNileCrocodile 2 октября в 00:26

JavaScript *Программирование *Алгоритмы *

Tutorial

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

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

Начать реализацию.

Всего голосов 17: ↑9 и ↓8 +1

Просмотры

3.8K

Комментарии 14

frimuchkov 30 сентября в 17:32

Разработка веб-сайтов *JavaScript *Программирование *Node.JS *Визуализация данных *

Всем привет. Меня зовут Андрей, я работаю в компании SegmentStream, занимаюсь вопросами архитектуры, инфраструктуры и написанием кода. Сегодня я расскажу как мы адаптировали Cube под наши нужды. В рамках статьи я не буду подробно рассказывать про сам Cube, если вы не знакомы с Cube, то лучше сначала немного почитать про него на официальном сайте cube.dev/docs. Если говорить про SegmentStream, то мы разрабатываем SaaS-платформу для оптимизации рекламных кампаний на основе машинного обучения. Звучит просто, но я рекомендую почитать, там много интересных вещей.

Также, в статье будет достаточное количество кода на TypeScript, который можно при желании не стесняться заимствовать. Я постараюсь оставлять объяснения к нему.

Рейтинг 0

Просмотры

190

Комментарии 0

vileven 30 сентября в 09:10

Блог компании VK JavaScript *Разработка под MacOS *Разработка под Linux *Разработка под Windows *

Если у вас есть компьютер и вы используете его по назначению, то скорее всего вы так или иначе работали с приложениями на Electron (даже если об этом не знали).

Меня зовут Сергей Володин, я руковожу командой разработки VK WorkMail. В этой статье я расскажу, как на основе Electron мы за две недели создали PoC кроссплатформенного настольного приложения Почты, что узнали о технологии и к каким выводам пришли.

Всего голосов 34: ↑30 и ↓4 +26

Просмотры

4.8K

Комментарии 31

JavaScript — Дока

Статьи раздела «JavaScript» по темам

Основы

Порядок выполнения
Переменные const, let и var
const
if…else
switch
Цикл
while
for
Выражения и инструкции
Хранение по ссылке и по значению
Функция
Области видимости
use strict

Продвинутый синтаксис

Тернарный оператор
Спред-синтаксис . ..
for…in
Поверхностное и глубокое копирование
Итератор
Date

Примитивные типы данных

Число
Строка
Булев тип
undefined
null
Большое целое
Символ
Преобразование типов

Коллекции

Объект
Массив
Функция как тип данных
Set
Map

Числа

Число
parseInt()
parseFloat()
Обёртка Number
.toString()
Number. isNaN()
Number.isFinite()

Строки

Строка
Обёртка String
Шаблонные строки
.indexOf()
.includes()
.length

Булев тип

Булев тип
Логические операторы
Преобразование типов

Функции

Функция
return
this: контекст выполнения функций
Области видимости
Рекурсия
Объект arguments

Массивы

Массив
.forEach()
. map()
.reduce()
.filter()
.find()
.findIndex()
.flat()
.flatMap()
.every()
.some()
.reverse()
.includes()
.indexOf()
.length
Array.from()
Array. isArray()

Объекты

Объект
.toString()
Дескрипторы
Почти всё в JavaScript — объект

Множества (

Set)

Set
Конструктор
.add()
.delete()
.has()
.forEach()
.clear()
.values()
.keys()
.entries()
. size

Обработка исключений

try…catch
Error и стандартные ошибки

Math

Объект Math
Math.floor(), Math.round(), Math.ceil() и Math.trunc()
Math.random()

Браузерное окружение и API

Браузерное окружение, BOM
DOM
fetch()
FormData
console.log()
window. history
window.location
window.navigator
Geolocation API
window.matchMedia
URLSearchParams
localStorage
sessionStorage
performance
alert()
prompt()
confirm()
queueMicrotask()
setTimeout()
clearTimeout()
setInterval()
clearInterval()
window. print()
Intersection Observer

О браузере

Как браузер рисует страницы
Координаты
Хранение данных в браузере

Объектная модель документа DOM

DOM
Element
Событийная модель
HTMLCollection и NodeList

Объект страницы (

document)

.addEventListener()
.removeEventListener()
.getElementById()
.getElementsByClassName()
. getElementsByTagName()
.querySelector()
.querySelectorAll()
.forms
.cookie

Элемент на странице (

Element)

Element
.addEventListener()
.removeEventListener()
.getElementsByClassName()
.getElementsByTagName()
.querySelector()
. querySelectorAll()
.getAttribute()
.focus()
.blur()
.scrollBy()
.scrollIntoView()
.scrollTo()
.classList
.dataset
.style
.innerHTML
.outerHTML
.innerText
.textContent
. hidden

События

Событийная модель
Объект события Event
.preventDefault()
click
submit
DOMContentLoaded
load
unload
beforeunload
keydown
keyup
mouseout
mouseover
scroll
wheel
touch

Хранение данных в браузере

Хранение данных в браузере
.cookie
localStorage
sessionStorage

Асинхронный код

Асинхронность в JS
Promise
. then()
.catch()
.finally()
Promise.all()
Promise.allSettled()
Promise.any()
Promise.race()
async/await

Обмен данными с API

Что такое API
fetch()
async/await

Парадигмы программирования

Парадигмы программирования
Объектно-ориентированное программирование
Функциональное программирование

Веб-приложение

Виды веб-приложений
Как работают веб-приложения
Безопасность веб-приложений и распространённые атаки
Версии языка, транспайлеры, бандлеры
Модули, import/export
React и альтернативы
Реактивность в программировании
Архитектура и паттерны проектирования
Что такое технический долг
Стиль написания кода в команде

Архитектура приложения

Трёхслойная архитектура
Организация потоков данных
Архитектурный паттерн MVC
Архитектура и паттерны проектирования
Порождающие паттерны проектирования
Структурные паттерны проектирования
Поведенческие паттерны проектирования

Тестирование

Как и зачем писать тесты
Разработка через тестирование (TDD)
Как упростить тестирование
Фиктивные объекты и данные, моки, стабы
Интеграционное и системное тестирование

Типовые решения

Работа с формами
Подгрузка контента при прокрутке
Позиционирование элементов с помощью JS
Debounce на примере формы поиска
Throttle на примере изменения страницы при прокрутке

Статьи раздела «JavaScript» по алфавиту

a

. add() Относится к теме: Множества (Set)
.addEventListener() Относится к темам: Объект страницы (document) Элемент на странице (Element)
alert() Относится к теме: Браузерное окружение и API
Array.from() Относится к теме: Массивы
Array.isArray() Относится к теме: Массивы
async/await Относится к темам: Асинхронный код Обмен данными с API

b

beforeunload Относится к теме: События
.blur() Относится к теме: Элемент на странице (Element)

c

. catch() Относится к теме: Асинхронный код
.classList Относится к теме: Элемент на странице (Element)
.clear() Относится к теме: Множества (Set)
clearInterval() Относится к теме: Браузерное окружение и API
clearTimeout() Относится к теме: Браузерное окружение и API
click Относится к теме: События
confirm() Относится к теме: Браузерное окружение и API
console.log() Относится к теме: Браузерное окружение и API
const Относится к теме: Основы
.cookie Относится к темам: Объект страницы (document) Хранение данных в браузере

d

. dataset Относится к теме: Элемент на странице (Element)
Date Относится к теме: Продвинутый синтаксис
Debounce на примере формы поиска Относится к теме: Типовые решения
.delete() Относится к теме: Множества (Set)
DOM Относится к темам: Браузерное окружение и API Объектная модель документа DOM
DOMContentLoaded Относится к теме: События

e

Element Относится к темам: Объектная модель документа DOM Элемент на странице (Element)
.entries() Относится к теме: Множества (Set)
Error и стандартные ошибки Относится к теме: Обработка исключений
.every() Относится к теме: Массивы

f

fetch() Относится к темам: Браузерное окружение и API Обмен данными с API
. filter() Относится к теме: Массивы
.finally() Относится к теме: Асинхронный код
.find() Относится к теме: Массивы
.findIndex() Относится к теме: Массивы
.flat() Относится к теме: Массивы
.flatMap() Относится к теме: Массивы
.focus() Относится к теме: Элемент на странице (Element)
for Относится к темам: Формы Основы
.forEach() Относится к теме: Массивы
.forEach() Относится к теме: Множества (Set)
for. ..in Относится к теме: Продвинутый синтаксис
FormData Относится к теме: Браузерное окружение и API
.forms Относится к теме: Объект страницы (document)

g

Geolocation API Относится к теме: Браузерное окружение и API
.getAttribute() Относится к теме: Элемент на странице (Element)
.getElementById() Относится к теме: Объект страницы (document)
.getElementsByClassName() Относится к темам: Объект страницы (document) Элемент на странице (Element)
.getElementsByTagName() Относится к темам: Объект страницы (document) Элемент на странице (Element)

h

. has() Относится к теме: Множества (Set)
.hidden Относится к теме: Элемент на странице (Element)
HTMLCollection и NodeList Относится к теме: Объектная модель документа DOM

i

if…else Относится к теме: Основы
.includes() Относится к темам: Строки Массивы
.indexOf() Относится к темам: Строки Массивы
.innerHTML Относится к теме: Элемент на странице (Element)
.innerText Относится к теме: Элемент на странице (Element)
Intersection Observer Относится к теме: Браузерное окружение и API

k

keydown Относится к теме: События
. keys() Относится к теме: Множества (Set)
keyup Относится к теме: События

l

.length Относится к теме: Массивы
.length Относится к теме: Строки
load Относится к теме: События
localStorage Относится к темам: Браузерное окружение и API Хранение данных в браузере

m

.map() Относится к теме: Массивы
Map Относится к теме: Коллекции
Math.floor(), Math.round(), Math.ceil() и Math.trunc() Относится к теме: Math
Math. random() Относится к теме: Math
mouseout Относится к теме: События
mouseover Относится к теме: События

n

null Относится к теме: Примитивные типы данных
Number.isFinite() Относится к теме: Числа
Number.isNaN() Относится к теме: Числа

o

.outerHTML Относится к теме: Элемент на странице (Element)

p

parseFloat() Относится к теме: Числа
parseInt() Относится к теме: Числа
performance Относится к теме: Браузерное окружение и API
. preventDefault() Относится к теме: События
Promise Относится к теме: Асинхронный код
Promise.all() Относится к теме: Асинхронный код
Promise.allSettled() Относится к теме: Асинхронный код
Promise.any() Относится к теме: Асинхронный код
Promise.race() Относится к теме: Асинхронный код
prompt() Относится к теме: Браузерное окружение и API

q

.querySelector() Относится к темам: Объект страницы (document) Элемент на странице (Element)
. querySelectorAll() Относится к темам: Объект страницы (document) Элемент на странице (Element)
queueMicrotask() Относится к теме: Браузерное окружение и API

r

React и альтернативы Относится к теме: Веб-приложение
.reduce() Относится к теме: Массивы
.removeEventListener() Относится к темам: Объект страницы (document) Элемент на странице (Element)
return Относится к теме: Функции
.reverse() Относится к теме: Массивы

s

scroll Относится к теме: События
.scrollBy() Относится к теме: Элемент на странице (Element)
. scrollIntoView() Относится к теме: Элемент на странице (Element)
.scrollTo() Относится к теме: Элемент на странице (Element)
sessionStorage Относится к темам: Браузерное окружение и API Хранение данных в браузере
Set Относится к темам: Коллекции Множества (Set)
setInterval() Относится к теме: Браузерное окружение и API
setTimeout() Относится к теме: Браузерное окружение и API
.size Относится к теме: Множества (Set)
.some() Относится к теме: Массивы
.style Относится к теме: Элемент на странице (Element)
submit Относится к теме: События
switch Относится к теме: Основы

t

. textContent Относится к теме: Элемент на странице (Element)
.then() Относится к теме: Асинхронный код
this: контекст выполнения функций Относится к теме: Функции
Throttle на примере изменения страницы при прокрутке Относится к теме: Типовые решения
.toString() Относится к теме: Числа
.toString() Относится к теме: Объекты
touch Относится к теме: События
try…catch Относится к теме: Обработка исключений

u

undefined Относится к теме: Примитивные типы данных
unload Относится к теме: События
URLSearchParams Относится к теме: Браузерное окружение и API
use strict Относится к теме: Основы

v

. values() Относится к теме: Множества (Set)

w

wheel Относится к теме: События
while Относится к теме: Основы
window.history Относится к теме: Браузерное окружение и API
window.location Относится к теме: Браузерное окружение и API
window.matchMedia Относится к теме: Браузерное окружение и API
window.navigator Относится к теме: Браузерное окружение и API
window.print() Относится к теме: Браузерное окружение и API

а

Архитектура и паттерны проектирования Относится к темам: Веб-приложение Архитектура приложения
Архитектурный паттерн MVC Относится к теме: Архитектура приложения
Асинхронность в JS Относится к теме: Асинхронный код

б

Безопасность веб-приложений и распространённые атаки Относится к теме: Веб-приложение
Большое целое Относится к теме: Примитивные типы данных
Браузерное окружение, BOM Относится к теме: Браузерное окружение и API
Булев тип Относится к темам: Примитивные типы данных Булев тип

в

Версии языка, транспайлеры, бандлеры Относится к теме: Веб-приложение
Виды веб-приложений Относится к теме: Веб-приложение
Выражения и инструкции Относится к теме: Основы

д

Дескрипторы Относится к теме: Объекты

и

Интеграционное и системное тестирование Относится к теме: Тестирование
Итератор Относится к теме: Продвинутый синтаксис

к

Как браузер рисует страницы Относится к теме: О браузере
Как и зачем писать тесты Относится к теме: Тестирование
Как работают веб-приложения Относится к теме: Веб-приложение
Как упростить тестирование Относится к теме: Тестирование
Конструктор Относится к теме: Множества (Set)
Координаты Относится к теме: О браузере

л

Логические операторы Относится к теме: Булев тип

м

Массив Относится к темам: Коллекции Массивы
Модули, import/export Относится к теме: Веб-приложение

о

Области видимости Относится к темам: Основы Функции
Объект Относится к темам: Интерактив Коллекции Объекты
Объект arguments Относится к теме: Функции
Объект Math Относится к теме: Math
Объектно-ориентированное программирование Относится к теме: Парадигмы программирования
Объект события Event Относится к теме: События
Обёртка Number Относится к теме: Числа
Обёртка String Относится к теме: Строки
Организация потоков данных Относится к теме: Архитектура приложения

п

Парадигмы программирования Относится к теме: Парадигмы программирования
Переменные const, let и var Относится к теме: Основы
Поведенческие паттерны проектирования Относится к теме: Архитектура приложения
Поверхностное и глубокое копирование Относится к теме: Продвинутый синтаксис
Подгрузка контента при прокрутке Относится к теме: Типовые решения
Позиционирование элементов с помощью JS Относится к теме: Типовые решения
Порождающие паттерны проектирования Относится к теме: Архитектура приложения
Порядок выполнения Относится к теме: Основы
Почти всё в JavaScript — объект Относится к теме: Объекты
Преобразование типов Относится к темам: Примитивные типы данных Булев тип

р

Работа с формами Относится к теме: Типовые решения
Разработка через тестирование (TDD) Относится к теме: Тестирование
Реактивность в программировании Относится к теме: Веб-приложение
Рекурсия Относится к теме: Функции

с

Символ Относится к теме: Примитивные типы данных
Событийная модель Относится к темам: Объектная модель документа DOM События
Спред-синтаксис . .. Относится к теме: Продвинутый синтаксис
Стиль написания кода в команде Относится к теме: Веб-приложение
Строка Относится к темам: Примитивные типы данных Строки
Структурные паттерны проектирования Относится к теме: Архитектура приложения

т

Тернарный оператор Относится к теме: Продвинутый синтаксис
Трёхслойная архитектура Относится к теме: Архитектура приложения

ф

Фиктивные объекты и данные, моки, стабы Относится к теме: Тестирование
Функциональное программирование Относится к теме: Парадигмы программирования
Функция Относится к темам: Основы Функции
Функция как тип данных Относится к теме: Коллекции

х

Хранение данных в браузере Относится к темам: О браузере Хранение данных в браузере
Хранение по ссылке и по значению Относится к теме: Основы

ц

Цикл Относится к теме: Основы

ч

Число Относится к темам: Примитивные типы данных Числа
Что такое API Относится к теме: Обмен данными с API
Что такое технический долг Относится к теме: Веб-приложение

ш

Шаблонные строки Относится к теме: Строки

Программирование на JavaScript с помощью кода Visual Studio

Редактировать

Visual Studio Code включает встроенный JavaScript IntelliSense, отладку, форматирование, навигацию по коду, рефакторинг и многие другие расширенные функции языка.

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

IntelliSense

IntelliSense показывает интеллектуальное завершение кода, информацию о наведении курсора и информацию о подписи, чтобы вы могли писать код быстрее и правильнее.

К сожалению, ваш браузер не поддерживает видео HTML 5.

VS Code обеспечивает IntelliSense в ваших проектах JavaScript; для многих библиотек npm, таких как React , lodash и express ; и для других платформ, таких как , узел , без сервера или IoT.

См. Работа с JavaScript, чтобы получить информацию о IntelliSense для JavaScript в VS Code, о том, как его настроить, и помочь в устранении распространенных проблем с IntelliSense.

Проекты JavaScript (jsconfig.json)

Файл jsconfig.json определяет проект JavaScript в VS Code. Хотя файлы jsconfig.json не требуются, вам потребуется создать их в таких случаях, как:

Если не все файлы JavaScript в вашей рабочей области следует рассматривать как часть одного проекта JavaScript. Файлы jsconfig.json позволяют исключить некоторые файлы из отображения в IntelliSense.
Чтобы убедиться, что подмножество файлов JavaScript в вашей рабочей области рассматривается как один проект. Это полезно, если вы работаете с устаревшим кодом, который использует неявные глобальные зависимости вместо импорта для зависимостей.
Если ваша рабочая область содержит более одного контекста проекта, например внешний и внутренний код JavaScript. Для многопроектных рабочих пространств создайте jsconfig.json в корневой папке каждого проекта.
Вы используете компилятор TypeScript для компиляции исходного кода JavaScript нижнего уровня.

Чтобы определить базовый проект JavaScript, добавьте jsconfig.json в корень рабочей области:

 {
  "Параметры компилятора": {
    "модуль": "commonjs",
    "цель": "es6"
  },
  "исключить": ["node_modules"]
}

Дополнительные сведения о конфигурации jsconfig.json см. в разделе Работа с JavaScript.

Совет: Чтобы проверить, является ли файл JavaScript частью проекта JavaScript, просто откройте файл в VS Code и выполните команду JavaScript: Перейти к конфигурации проекта . Эта команда открывает файл jsconfig.json , который ссылается на файл JavaScript. Уведомление отображается, если файл не является частью какого-либо проекта jsconfig. json .

Фрагменты

VS Code включает базовые фрагменты JavaScript, которые предлагаются при вводе;

К сожалению, ваш браузер не поддерживает видео HTML 5.

Существует множество расширений, предоставляющих дополнительные сниппеты, в том числе сниппеты для популярных фреймворков, таких как Redux или Angular. Вы даже можете определить свои собственные фрагменты.

Совет : Чтобы отключить предложения фрагментов, установите editor.snippetSuggestions на «none» в файле настроек. Параметр editor.snippetSuggestions также позволяет изменить расположение фрагментов в предложениях: вверху ( "сверху" ), внизу ( "снизу" ) или встроены в алфавитном порядке ( "встроены" ). По умолчанию "встроенный" .

Поддержка JSDoc

VS Code понимает многие стандартные аннотации JSDoc и использует эти аннотации для предоставления расширенных возможностей IntelliSense. При желании вы даже можете использовать информацию о типе из комментариев JSDoc, чтобы проверить свой JavaScript.

К сожалению, ваш браузер не поддерживает видео HTML 5.

Быстро создавайте комментарии JSDoc для функций, набрав /** перед объявлением функции и выберите комментарий JSDoc предложение фрагмента:

К сожалению, ваш браузер не поддерживает видео HTML 5.

Чтобы отключить предложения комментариев JSDoc, установите "javascript.suggest.completeJSDocs": false .

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

Сочетание клавиш ⌘K ⌘I (Windows, Linux Ctrl+K Ctrl+I) показывает эту информацию при наведении на текущую позицию курсора.

Когда вы пишете вызовы функций JavaScript, VS Code показывает информацию о сигнатуре функции и выделяет параметр, который вы сейчас заполняете:

Справка по подписи отображается автоматически, когда вы вводите ( или , внутри функции вызов. Нажмите ⇧⌘Пробел (Windows, Linux Ctrl+Shift+Пробел), чтобы вручную вызвать справку по подписи. предложения, VS Code автоматически добавляет импорт для него в начало файла.0003

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

Если вы выберете одно из этих предложений автоматического импорта, VS Code добавит для него импорт.

В этом примере VS Code добавляет импорт для Button из material-ui в начало файла:

Чтобы отключить автоматический импорт, установите "javascript.suggest.autoImports" на ложь .

Совет: VS Code пытается определить наилучший стиль импорта. Вы можете явно настроить предпочтительный стиль кавычек и стиль пути для импорта, добавленного в ваш код, с помощью параметров javascript.preferences.quoteStyle и javascript. preferences.importModuleSpecifier .

Форматирование

Встроенный модуль форматирования JavaScript в VS Code обеспечивает базовое форматирование кода с приемлемыми значениями по умолчанию.

javascript.format.* настройки настраивают встроенный форматтер. Или, если встроенный модуль форматирования мешает, установите "javascript.format.enable" на false , чтобы отключить его.

Чтобы получить более специализированные стили форматирования кода, попробуйте установить одно из расширений форматирования JavaScript из Marketplace.

JSX и автоматически закрывающиеся теги

Все функции JavaScript VS Code также работают с JSX:

Вы можете использовать синтаксис JSX как в обычном *.js файлов и *.jsx файлов.

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

К сожалению, ваш браузер не поддерживает видео HTML 5.

Установите "javascript.autoClosingTags" на false , чтобы отключить закрытие тега JSX.

Навигация по коду

Навигация по коду позволяет быстро перемещаться по проектам JavaScript.

Перейти к определению F12 — Перейти к исходному коду определения символа.
Определение просмотра ⌥F12 (Windows Alt+F12, Linux Ctrl+Shift+F10) — открыть окно просмотра, в котором показано определение символа.
Перейти к ссылкам ⇧F12 (Windows, Linux Shift+F12) — Показать все ссылки на символ.
Перейти к определению типа — Перейти к типу, определяющему символ. Для экземпляра класса это покажет сам класс, а не место, где определен экземпляр.

Вы можете перемещаться с помощью поиска по символам, используя Перейти к командам Symbol из палитры команд (⇧⌘P (Windows, Linux Ctrl+Shift+P)).

Перейти к символу в файле ⇧⌘O (Windows, Linux Ctrl+Shift+O)
Перейти к символу в рабочей области ⌘T (Windows, Linux Ctrl+T)

Переименовать

Нажмите F2, чтобы переименовать символ под курсором в вашем проекте JavaScript:

Рефакторинг

VS Code включает несколько удобных рефакторингов для JavaScript, таких как Функция извлечения и Извлечение константы . Просто выберите исходный код, который вы хотите извлечь, а затем щелкните лампочку в поле или нажмите (⌘. (Windows, Linux Ctrl+.)) для просмотра доступных рефакторингов.

Доступные рефакторинги включают:

Извлечение в метод или функцию.
Извлечь в константу.
Преобразование между именованным импортом и импортом пространства имен.
Перейти к новому файлу.

Дополнительные сведения о рефакторингах и о том, как настроить сочетания клавиш для отдельных рефакторингов, см. в разделе Рефакторинг.

Неиспользуемые переменные и недостижимый код

Неиспользуемый код JavaScript, такой как блок else оператора if , который всегда истинен или импорт без ссылки, исчезает в редакторе:

Вы можете быстро удалить этот неиспользуемый код наведя на него курсор и выполнив команду Quick Fix (⌘. (Windows, Linux Ctrl+.)) или щелкнув лампочку.

Чтобы отключить исчезновение неиспользуемого кода, установите "editor.showUnused" на false . Вы также можете отключить исчезновение неиспользуемого кода только в JavaScript, установив:

 "[javascript]": {
    "editor.showUnused": ложь
},
"[javascriptреакция]": {
    "editor.showUnused": ложь
},

Организовать импорт

Организовать импорт Исходное действие сортирует импорт в файле JavaScript и удаляет все неиспользуемые импорты:

К сожалению, ваш браузер не поддерживает видео HTML 5.

Вы можете запустить Организовать импорт из исходного действия или с помощью сочетания клавиш ⇧⌥O (Windows, Linux Shift+Alt+O).

Организовать импорт также можно автоматически при сохранении файла JavaScript, установив:

 "editor.codeActionsOnSave": {
    "source.organizeImports": правда
}

Действия кода при сохранении

Параметр editor.codeActionsOnSave позволяет настроить набор действий кода, которые выполняются при сохранении файла. Например, вы можете включить организацию импорта при сохранении, установив:

 // При сохранении запустите исходные действия fixAll и OrganizeImports
"editor.codeActionsOnSave": {
    "source.fixAll": правда,
    "source.organizeImports": правда,
}

Вы также можете установить editor.codeActionsOnSave для массива кодовых действий, которые будут выполняться по порядку.

Вот некоторые исходные действия:

"organizeImports" — Позволяет организовать импорт при сохранении.
"fixAll" — Автоматическое исправление при сохранении вычисляет все возможные исправления за один раунд (для всех поставщиков, включая ESLint).
"fixAll.eslint" — Автоматическое исправление только для ESLint.
"addMissingImports" — Добавляет все отсутствующие импорты при сохранении.

Дополнительные сведения см. в разделе Node.js/JavaScript.

Предложения кода

VS Code автоматически предлагает некоторые распространенные упрощения кода, такие как преобразование цепочки .then вызывает обещание использовать async и await

К сожалению, ваш браузер не поддерживает видео HTML 5.

Установите "javascript.suggestionActions.enabled" на false , чтобы отключить предложения.

Подсказки-вкладыши

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

Вложенные подсказки имени параметра показывают имена параметров в вызовах функций:

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

Чтобы включить подсказки имени параметра, установите javascript.inlayHints.parameterNames . Возможны три значения:

нет — отключить подсказки вкладки параметров.
literals — Показывать подсказки вкладок только для литералов (строка, число, логическое значение).
все — показывать подсказки для всех аргументов.

Подсказки вкладок типов переменных показывают типы переменных, которые не имеют явных аннотаций типов.

Параметр: javascript.inlayHints.variableTypes.enabled

Подсказки вкладок типа свойства показывают тип свойств класса, которые не имеют явной аннотации типа.

Параметр: javascript.inlayHints.propertyDeclarationTypes.enabled

Подсказки типов параметров показывают типы неявно типизированных параметров.

Настройка: javascript.inlayHints.parameterTypes.enabled

Подсказки вкладок типа возвращаемого значения показывают возвращаемые типы функций, которые не имеют явной аннотации типа.

Параметр: javascript.inlayHints.functionLikeReturnTypes.enabled

Ссылки CodeLens

Ссылки JavaScript CodeLens отображает встроенный счетчик ссылок для классов, методов, свойств и экспортированных объектов: 9002

2 Включить thes CodeLens, установите

 "javascript.referencesCodeLens.enabled" 9от 0016 до  верно  .
 Нажмите на счетчик ссылок, чтобы быстро просмотреть список ссылок:
 Обновить импорт при перемещении файла 
 Когда вы перемещаете или переименовываете файл, который импортируется другими файлами в вашем проекте JavaScript, VS Code может автоматически обновлять все пути импорта, которые ссылаются на перемещенный файл:
 К сожалению, ваш браузер не поддерживает видео HTML 5. Параметр  javascript.updateImportsOnFileMove.enabled  управляет этим поведением. Допустимые значения параметров:
  "подсказка"  — значение по умолчанию. Спрашивает, следует ли обновлять пути для каждого перемещения файла.
  "всегда"  — всегда автоматически обновлять пути.
  "никогда"  – Не обновлять пути автоматически и не запрашивать.
 Линтеры 
 Линтеры выдают предупреждения о подозрительном коде. Хотя в VS Code нет встроенного линтера JavaScript, на рынке доступно множество расширений линтера JavaScript.
  Совет:  Этот список динамически запрашивается из VS Code Marketplace. Прочтите описание и отзывы, чтобы решить, подходит ли вам расширение.
 Проверка типов 
 Вы также можете использовать некоторые расширенные функции проверки типов и отчетов об ошибках TypeScript в обычных файлах JavaScript. Это отличный способ выявить распространенные ошибки программирования. Эти проверки типов также позволяют использовать несколько замечательных быстрых исправлений для JavaScript, в том числе  Добавить отсутствующий импорт  и  Добавить отсутствующее свойство  .
 TypeScript пытался вывести типы в файлах  .js  так же, как и в файлах  .ts . Когда типы невозможно вывести, их можно указать явно с помощью комментариев JSDoc. Вы можете узнать больше о том, как TypeScript использует JSDoc для проверки типов JavaScript, в разделе Работа с JavaScript.
 Проверка типов JavaScript является необязательной и необязательной. Существующие инструменты проверки JavaScript, такие как ESLint, можно использовать вместе со встроенными функциями проверки типов.
 Отладка 
 VS Code поставляется с отличной поддержкой отладки для JavaScript. Устанавливайте точки останова, проверяйте объекты, перемещайтесь по стеку вызовов и выполняйте код в консоли отладки. Дополнительные сведения см. в разделе Отладка.
 Отладка на стороне клиента 
 Вы можете отлаживать код на стороне клиента с помощью отладчика браузера, такого как встроенный отладчик для Edge и Chrome или отладчик для Firefox.
 Отладка на стороне сервера 
 Отладка Node.js в VS Code с помощью встроенного отладчика. Настройка проста, и вам поможет руководство по отладке Node.js.
 Популярные расширения 
 VS Code поставляется с отличной поддержкой JavaScript, но вы можете дополнительно установить отладчики, фрагменты кода, линтеры и другие инструменты JavaScript через расширения.
  Совет:  Указанные выше расширения запрашиваются динамически. Нажмите на плитку расширения выше, чтобы прочитать описание и отзывы, чтобы решить, какое расширение лучше всего подходит для вас. Смотрите больше на торговой площадке.
 Следующие шаги 
 Читайте дальше, чтобы узнать о:
 Работа с JavaScript — более подробная информация о поддержке JavaScript в VS Code и способах устранения распространенных проблем.
 jsconfig.json — Подробное описание файла проекта  jsconfig.json .
 IntelliSense — узнайте больше об IntelliSense и о том, как его эффективно использовать для вашего языка.
 Отладка — узнайте, как настроить отладку для вашего приложения.
 Node.js — пошаговое руководство по созданию экспресс-приложения Node.js.
 TypeScript — VS Code отлично поддерживает TypeScript, что обеспечивает структуру и строгую типизацию кода JavaScript.
 Общие вопросы 
 Поддерживает ли VS Code JSX и React Native? 
 VS Code поддерживает  JSX  и  React Native . Вы получите IntelliSense для  React/JSX  и  React Native  из автоматически загруженных файлов объявления типов из репозитория файлов объявлений типов npmjs. Кроме того, вы можете установить популярное расширение React Native из Marketplace.
 Чтобы включить операторы импорта ES6 для  React Native  , необходимо установить для параметра компилятора  allowSyntheticDefaultImports  значение  true  . Это говорит компилятору создать синтетические элементы по умолчанию, и вы получаете IntelliSense.  React Native  использует  Babel  за кулисами для создания надлежащего кода времени выполнения с членами по умолчанию. Если вы также хотите выполнить отладку кода  React Native , вы можете установить расширение React Native.
 Поддерживает ли VS Code язык программирования Dart и платформу Flutter? 
 Да, существуют расширения VS Code для разработки Dart и Flutter. Вы можете узнать больше в документации Flutter.dev.
 IntelliSense не работает для внешних библиотек 
  Автоматическое получение типов  работает для зависимостей, загруженных npm (указан в  package.json  ), Bower (указан в  bower.json  ) и для многих наиболее распространенных библиотеки, перечисленные в вашей структуре папок (например,  jquery-3.1.1.min.js  ).
  Импорт стилей ES6 не работает. 
 Если вы хотите использовать импорт в стиле ES6, но в некоторых файлах объявлений типов еще не используется экспорт в стиле ES6, установите для параметра компилятора TypeScript  allowSyntheticDefaultImports  значение true.
 {
  "Параметры компилятора": {
    "модуль": "commonjs",
    "цель": "es6",
    // Это строка, которую вы хотите добавить
    "allowSyntheticDefaultImports": правда
  },
  "исключить": ["node_modules", "**/node_modules/*"]
}
 
 Можно ли отлаживать минимизированный/упрощенный JavaScript? 
 Да, можно. Вы можете увидеть, как это работает, используя исходные карты JavaScript в разделе Отладка Node.js.
 Как отключить проверку синтаксиса при использовании конструкций, отличных от ES6? 
 Некоторые пользователи хотят использовать синтаксические конструкции, такие как предложенный оператор конвейера (  |>  ). Однако в настоящее время они не поддерживаются языковой службой JavaScript VS Code и помечаются как ошибки. Для пользователей, которые все еще хотят использовать эти будущие функции, мы предоставляем  Настройка javascript.validate.enable .
 С помощью  javascript.validate.enable: false  вы отключаете все встроенные проверки синтаксиса. Если вы сделаете это, мы рекомендуем вам использовать линтер, такой как ESLint, для проверки вашего исходного кода.
 Могу ли я использовать другие инструменты JavaScript, такие как Flow? 
 Да, но некоторые функции языка Flow, такие как проверка типов и ошибок, могут мешать встроенной поддержке JavaScript в VS Code. Чтобы узнать, как отключить встроенную поддержку JavaScript в VS Code, см. раздел Отключение поддержки JavaScript.
 06.10.2022
 Что такое язык программирования Javascript? 
  В этом посте из серии «Языки программирования для облака» мы познакомимся с надежным и универсальным языком программирования JavaScript. Читайте дальше, чтобы узнать об истории JavaScript, примерах его использования и причинах, по которым вы захотите его изучить. Приготовьтесь узнать, почему JavaScript стал сегодня одним из самых популярных языков программирования для разработки в облаке! 
 />
  Ваши ключи к лучшей карьере 
 Начните работу с ACG сегодня, чтобы изменить свою карьеру с помощью курсов и реальных практических занятий в AWS, Microsoft Azure, Google Cloud и не только.
 Начать бесплатную пробную версию
 История JavaScript  В 1995 году Брендан Эйх создал JavaScript для Netscape Navigator, доминирующего веб-браузера того времени. JavaScript позволил веб-разработчикам делать веб-сайты более динамичными, изменяя визуальные элементы на экране в режиме реального времени по мере взаимодействия пользователей с сайтом. В течение первых шести месяцев JavaScript было несколько изменений имени. Первоначально он назывался Mocha, а затем LiveScript, прежде чем был назван JavaScript.
 Забавный факт: несмотря на свое название, JavaScript на самом деле не связан с языком программирования Java. Название появилось благодаря партнерству между Netscape и Sun Microsystems, создателем Java.
 Сегодня JavaScript превратился в нечто большее, чем просто язык сценариев для Интернета. Это надежный и универсальный язык, который можно использовать по-разному, поэтому независимо от того, предпочитаете ли вы императивное программирование, более объектно-ориентированный стиль, функциональный подход или даже модель, управляемую событиями, вы можете сделать все это в JavaScript.
 Для чего я могу использовать JavaScript?  JavaScript — это рабочая лошадка. Он может:
  Добавлять динамическое и интерактивное содержимое на веб-сайты 
 JavaScript остается №1, когда речь идет о добавлении динамического и интерактивного содержимого на веб-сайты. Сегодня он управляет почти каждой страницей в Интернете и почти так же важен для Интернета, как HTML.
  Создание веб-приложений и мобильных приложений 
 JavaScript также используется для создания полнофункциональных веб-приложений и мобильных приложений.
  Написание кода на стороне сервера 
 JavaScript больше не просто на стороне клиента — теперь он также часто используется для написания кода на стороне сервера.
  Разработка видеоигр 
 Благодаря своей универсальности и способности работать на самых разных устройствах JavaScript даже играет важную роль в разработке видеоигр.
  Получить облачный словарь боли  
 Говорить в облаке не должно быть сложно. Мы проанализировали миллионы ответов, чтобы определить основные концепции, которые сбивают людей с толку. Воспользуйтесь этим руководством по облачным технологиям , чтобы получить краткие определения некоторых наиболее болезненных облачных терминов.
 Получить товар
 Почему JavaScript так популярен?  Согласно опросу разработчиков Stack Overflow за 2020 год, JavaScript является наиболее широко используемым языком программирования. Давайте посмотрим, почему это так:
  Универсальность 
 Одной из причин популярности JavaScript является его центральная роль, когда дело доходит до сети: JavaScript везде и поддерживается всеми широко используемыми веб-браузерами. Многие разработчики сначала знакомятся с JavaScript благодаря своему опыту веб-разработки, а затем продолжают использовать язык для других видов проектов.
  Простота в освоении 
 JavaScript — относительно простой язык для начала работы. Новичку довольно просто делать такие вещи, как печатать «hello world» или добавлять некоторые динамические элементы на веб-страницу, поэтому барьер для входа низкий.
  Универсальность 
 Другая причина популярности JavaScript — его универсальность. JavaScript довольно открыт и ничем не ограничен по сравнению с такими языками, как Java, C# и Go. Это упрощает кодирование с помощью JavaScript в различных стилях программирования и в различных сценариях. Вы можете использовать JavaScript как для внешней, так и для внутренней части ваших приложений.
  Сообщество и ресурсы 
 JavaScript имеет большое полезное сообщество и множество мощных и надежных библиотек и фреймворков для работы. Если вы хотите создать веб-сайт, серверное приложение или игру, вы найдете фреймворк и поддержку сообщества, которые помогут вам на этом пути.
 Совместимость с облаком JavaScript  Если вы программируете в облаке, все основные платформы отдают приоритет поддержке JavaScript. JavaScript особенно эффективен в контексте бессерверных предложений, таких как AWS Lambda, Azure Functions и облачные функции GCP.
 Зачем мне изучать JavaScript?  JavaScript необходим для Интернета. Если вы хотите заниматься какой-либо веб-разработкой, вам, вероятно, потребуется использовать JavaScript. Но это также очень полезный язык вне веб-браузера. Если вы знакомы с JavaScript, вы можете использовать его для создания любых приложений.
 Если вам все еще нужно больше убедительности, в опросе разработчиков Stack Overflow за 2020 год указана средняя зарплата разработчика JavaScript в США в размере 112 тысяч долларов в год. Итак, если вы хотите изучить мощный, универсальный и готовый к работе в облаке язык программирования, JavaScript — отличный выбор.
 Начало работы с JavaScript  Готовы начать свое путешествие по JavaScript? Ознакомьтесь с Учебником по современному JavaScript и курсом ACG Introduction to JavaScript! 
 На данный момент это весь JavaScript! Ждите новых выпусков из нашей серии «Языки программирования для облака». А пока начните бесплатную пробную версию ACG или ознакомьтесь с бесплатным обучением работе с облачными технологиями в этом месяце. Вы также можете подписаться на A Cloud Guru на YouTube, чтобы получать еженедельные новости об облачных технологиях, поставить лайк на нас в Facebook, подписаться на нас в Twitter и присоединиться к обсуждению в Discord.
 Введение в JavaScript (бесплатный учебник) 
 Веб-разработка для начинающих >
 Урок 5: Введение в JavaScript
 1
 Учебник 1 2
 Учебник 2 3
 Учебник 3 4 Учебник 4 
 Учебник 5 6 Финальный тест 
 Веб-разработка для начинающих Предыдущий 
 Учебник 
 Финальная викторина 
 💬  «В некотором смысле программирование похоже на рисование. Вы начинаете с чистого холста и некоторых основных материалов. Вы используете комбинацию науки, искусства и ремесла, чтобы определить, что с ними делать».  (Эндрю Хант)
 Почему JavaScript? 
 Добро пожаловать на пятый и последний день вашего краткого курса веб-разработки! Сегодня мы коснемся JavaScript и попытаемся немного импровизировать, узнавая больше об этом третьем и последнем столпе Интернета.
 JavaScript, как вы, возможно, знаете, повсеместно используется в современном мире разработки программного обеспечения. Это основа фронтенд-разработки и ключевой компонент таких фреймворков, как ReactJS, Angular и VueJS. Он также может помочь в создании надежной серверной части с такими платформами, как Nodejs, запускать настольные приложения, такие как Slack, Atom и Spotify, и работать на мобильных телефонах как прогрессивные веб-приложения (PWA).
 Короче говоря, он повсюду — и не зря. Во-первых, по сравнению с другими языками, такими как C и Java, JavaScript, как правило, легче изучать. Когда мы говорим «проще», мы имеем в виду, как быстро вы можете превратиться из новичка в JavaScript в того, кто действительно может зарабатывать на жизнь написанием профессионального высококачественного кода JavaScript. Так что в этом смысле он более доступен, чем некоторые другие языки, такие как C и Java.
 JavaScript — это также увлекательный и полезный язык, что особенно важно, когда вы только начинаете заниматься разработкой программного обеспечения. Поддержка сообщества очень хорошая, поэтому, если вы застряли, есть большая вероятность, что проблема и ее решение уже существуют в Интернете.
 Введение 
 Теперь, когда мы получили представление о JavaScript с высоты птичьего полета, давайте перейдем к более техническим деталям. JavaScript был создан, чтобы оживить веб-страницы. Так же, как HTML и CSS, JavaScript записывается в виде простых текстовых файлов с расширением .js.
 Как упоминалось ранее, JavaScript можно использовать для выполнения многих полезных операций во внешнем интерфейсе, таких как проверка форм, оповещение пользователей, сохранение временных данных и выполнение вычислений — и это лишь некоторые из них.
  😎Совет от профессионала:  Помимо самого названия, JavaScript не имеет никакого отношения к Java. Новички часто путаются между двумя языками. Помните, что Java — это совершенно другой язык, созданный для другой цели (хотя вы все равно обнаружите, что он работает на некоторых бэкендах веб-сайтов).
 Наконец, прежде чем мы рассмотрим сегодняшний маршрут, помните, что JavaScript, так же, как HTML и CSS (а может быть, даже больше), — обширный язык. Мы будем изучать только те части, которые имеют отношение к нам сегодня, поэтому мы перечислим некоторые полезные ресурсы в конце, если вы хотите узнать больше.
 Что мы будем делать сегодня? 
 Основы использования JavaScript: переменные, функции и операторы
 Выберите элементы HTML с JavaScript
 Прикрепите прослушиватель кликов к элементам HTML-формы
 Получить некоторые введенные пользователем значения
 Проверить нашу форму с помощью JavaScript
 Наконец-то ожидание закончилось! Давайте перейдем к делу.
 1. Основы JavaScript 
 JavaScript — это язык программирования, и, как и большинство языков программирования, он имеет некоторые основные конструкции, которые мы рассмотрим. Программа на JavaScript похожа на последовательность шагов. Подобно тому, как мы даем указания незнакомцу, компьютеру нужны подробные инструкции, определенные как шаги, для выполнения любого простого или сложного действия.
 Давайте начнем с некоторых основ.
 Написание Javascript 
 Как и для CSS, мы создадим новый файл для написания JavaScript с именем  ‘script.js’  в каталоге портфолио. Теперь откройте файл index.html и вставьте эту строку непосредственно перед закрывающим тегом body (  ).
 Посмотреть изменения кода на GitHub >
 Вот и все. Мы связали наш файл сценария в нашем HTML. Чтобы убедиться, что это работает, напишите следующий код в файл script.js.
 Сохраните и обновите страницу.
 Посмотреть изменения кода на GitHub >
 Обратите внимание на диалоговое окно вверху? Это ваша первая строка JavaScript, код предупреждения, выполняемый. Попробуйте изменить текст и обновить. Вы также можете сделать это в CodePen ниже!
 Если вы выполнили действия, описанные в предыдущем разделе, вы правильно настроили файл сценария. Мы готовы написать немного JavaScript! Давайте рассмотрим некоторые важные понятия.
 Переменные 
 Переменные — это понятные имена, содержащие данные. Подумайте о том, как вы называете человека по имени, а не «человек» или «одна голова, два глаза, один нос…» и так далее. Переменные — это просто понятные (и описательные) имена для фрагментов данных. Рассмотрим пример.
 Здесь мы определяем переменную с именем «приветствие» и присваиваем ей значение «Привет, мир». Это звучит почти как по-английски: «пусть , приветствие , будет , привет, мир, » — видите? Теперь приветствие содержит в себе значение «Hello world» и может использоваться вместо обычного текста «Hello world».
 Вы можете написать:
 Обновите страницу, и результат должен быть таким же. Хотя кажется, что мы делаем больше для достижения того же результата, в реальном мире переменные чрезвычайно полезны для хранения данных. Переменные также можно использовать для хранения различных типов данных, таких как числа, строки и другие переменные.
 Вы заметили, что мы написали «let» перед именем переменной? Это один из способов объявления переменной в JavaScript. Вы можете узнать больше в этом руководстве Mozilla по объявлениям.
 Также обратите внимание, что каждая строка заканчивается точкой с запятой (;). Это не обязательно (за исключением некоторых конкретных случаев), но рекомендуется использовать их, поэтому мы рекомендуем вам это сделать.
 Арифметические операторы 
 JavaScript также можно использовать в качестве калькулятора. На самом деле, большая часть кода, который вы увидите в дикой природе, будет везде содержать базовые вычисления. Он поддерживает все обычные функции, называемые операторами, такие как плюс (+), минус (-), умножение (*), деление (/) и так далее. Вы можете сделать что-то вроде следующего, и он должен сказать 5, как и следовало ожидать. Попробуйте запустить CodePen ниже, и вы должны увидеть всплывающее окно в текущем окне браузера.
 Вы также можете сохранить значения в своих собственных переменных, а затем результат в другой переменной.
 Попробуйте запустить; ты снова получил 5? Нет? Откройте Инструменты разработчика Chrome и перейдите на вкладку Консоль. Это что-нибудь говорит?
 Ааа, ошибка в файле script.js в строке 4 (обратите внимание на  script.js:4  в правом углу этого красного сообщения об ошибке). Вы заметили ошибку в строке 4? Это предупреждение, в котором отсутствует закрывающая скобка. Исправьте это и попробуйте снова запустить код.
 Операторы сравнения 
 Операторы сравнения сравнивают два объекта вместе. На английском и других языках мы часто задаем такие вопросы, как «Сегодня теплее, чем вчера» или «Эти два здания одного размера?». Ответ на эти вопросы либо да, либо нет, и они обычно сравнивают две вещи (сегодня и вчера, здание 1 и здание 2 и т. д.). В терминах программирования это либо «истина», либо «ложь».
 Мы можем задавать вопросы, подобные тем, что и в JavaScript! В JavaScript у нас есть следующие операторы сравнения:
 Оператор  Вопрос в задании
 ===  Две вещи равны?*
 !==  Две вещи неравны?*
 >=  Является ли первое значение больше или равно второму?
 <=  Является ли первое значение меньше или равно второму?
 >  Первое больше второго?
 <  Первое меньше второго?
 
 *Есть менее строгие варианты, а именно == и !=, которые позволяют сравнивать две вещи, которые могут быть разных типов.
 «1» == 1 верно, но «1» === 1 неверно, так как «1» — это строка, а 1 — это число.
 Мы рекомендуем придерживаться строгого равенства/не равенства (=== и !==) и избегать использования == и !=
 Функции 
 Функции — это блоки кода, которым мы присваиваем имя, чтобы их можно было использовать повторно. Скажем, добавление двух чисел — обычная операция для нашего веб-сайта. Мы можем написать приведенный выше код внутри функции следующим образом:
 Посмотрите, как функция принимает два числа (число1 и число2, формально называемые параметрами функции), складывает их и «возвращает» результат; другими словами, отправляет вам результат. Здесь мы определили, как должна вести себя функция «добавить», но мы ее не используем. Чтобы использовать этот код, нам нужно его «вызвать». Вызов функции — это просто запись ее имени и использование круглых скобок для передачи «аргументов» (фактических параметров).
 Возьмем другой пример. Рассмотрим функцию, которая «оповещает» обо всем, что ей отправляется.
 В этой функции  alertMessage  — это имя функции,  message  — это параметр, и у нас нет возвращаемого значения (обратите внимание на отсутствие оператора return).
 Когда мы вызываем его как  alertMessage('Hello World')  , часть «Hello World» является аргументом функции. Это лишь верхушка айсберга в мире функций, но этого достаточно, чтобы двигаться вперед.
 Возвращаясь к функции добавления, мы будем использовать ее следующим образом:
 Она работает нормально? Если нет, загляните в консоль и посмотрите, нет ли у вас синтаксических ошибок.
 Повторяя то, что мы говорили о переменных, снова может показаться, что это требует дополнительной работы, чтобы сделать то же самое, и вы будете правы, говоря это. Однако это поможет нам подготовиться к чему-то большему, чем простое сложение двух чисел.
 Управление потоком 
 Как правило, программа на JavaScript выполняется построчно. Но бывают случаи, когда мы хотим выполнить оператор на основе некоторого условия или выполнить группу операторов несколько раз. Такое изменение порядка выполнения кода называется управлением потоком.
 На примере будет понятнее. Предположим, вы хотите показывать своим пользователям разные сообщения в зависимости от того, достигли они 18-летнего возраста или нет. На простом английском языке ваша логика будет следующей:
  Если  age меньше 18  , отобразите «Вы не взрослый», иначе отобразите «Вы взрослый» 
 В JavaScript вы 'написал бы код следующим образом:
 Обратите внимание, насколько простая английская версия похожа на код JavaScript. То, что мы только что написали, является примером оператора if..else. Обратите внимание на  возраст < 18 лет  часть. Это условие. Здесь мы использовали оператор  меньше  из раздела  Операторы сравнения  выше.
 Общий синтаксис if..else:
 Мы будем использовать if..else всякий раз, когда нам нужно будет принять решение в коде, например, убедиться, что наши пользователи ввели правильные данные.
 Объекты 
 Последним важным понятием, необходимым для нашего веб-сайта, является объект JavaScript. Объекты — это просто контейнеры для пар ключ-значение, похожие на то, что вы найдете в словаре. В словаре ключ — это слово, а значение — это значение слова. В объекте JavaScript ключ — это имя, а значением может быть что угодно, даже другие объекты. Давайте рассмотрим пример:
 В нашем примере объекта, который называется «fullName», firstName и lastName являются ключами, а «John» и «Doe» — значениями.
 Мы можем получить доступ к firstName, используя нотацию с точкой (.). Далее будет показано предупреждение «Джон».
 Как уже упоминалось, внутри объектов могут быть другие объекты и функции.
 Мы можем отправить предупреждение, в данном случае с помощью:
 Вы увидите, что этот шаблон используется повсюду, как только мы перейдем к следующему разделу.
 2. Выбор элементов HTML 
 Сила JavaScript в Интернете заключается в его способности выбирать и изменять HTML-код. Например, мы можем написать функцию на JavaScript, которая вызывается, когда мы нажимаем кнопку «Отправить» в нашей форме нижнего колонтитула.
 Для этого давайте сначала выберем нашу кнопку отправки и прикрепим к ней функцию «прослушивания кликов». Когда мы прикрепляем прослушиватель кликов к элементу, он будет вызывать эту функцию прослушивателя при нажатии кнопки. Чтобы иметь возможность выбрать нашу кнопку, мы дадим ей атрибут ID с уникальным идентификатором в нашем файле HTML.
 Теперь, когда у нас есть идентификатор для выбора, давайте перейдем к нашему файлу JavaScript и используем функцию JavaScript, document.querySelector(), чтобы выбрать наш элемент. Точно так же, как мы могли бы выбирать элементы HTML по их именам, атрибутам класса или идентификаторам в CSS, мы можем сделать то же самое в JavaScript, используя эту функцию.
  document.querySelector  принимает селектор в качестве параметра и возвращает HTML-элемент, соответствующий селектору, в форме объекта (помните, что объект — это просто контейнер для пар ключ-значение данных). Затем мы можем сохранить этот HTML-элемент в переменной и выполнять с ним всевозможные операции.
 Обратите внимание, что идентификатор должен начинаться с символа решетки (#), точно так же, как при выборе идентификаторов в CSS. Если бы это было имя класса, вы бы использовали (как вы уже догадались) точку (.), например  .submit-button 
  Совет для профессионалов:  Если вы сомневаетесь, попробуйте console.log() to ' log», то есть для отображения определенного сообщения в консоли разработчика Chrome — переменной в JavaScript. Например, после написания предыдущей строки попробуйте записать переменную submitButton с
 и проверьте вывод. Если вы видите «undefined» или «null», это означает, что что-то не так.
 В общем, попробуйте поковыряться с инструментами разработчика. Это требует времени, но как только вы освоитесь, выяснение того, что пошло не так («отладка»), станет проще.
 3. Присоединение прослушивателя кликов 
 Теперь, когда мы выбрали элемент HTML и сохранили его в переменной JavaScript, давайте добавим к нему функцию прослушивателя кликов. Слушатель кликов, как следует из названия, слушает или ждет клика. Мы прикрепляем прослушиватели кликов к определенным элементам, которые нас интересуют, например к кнопкам отправки формы. При нажатии на указанный элемент HTML вызывается функция прослушивания кликов.
 Обратите внимание, что функция прослушивания кликов — это обычная функция, которую мы передаем функции addEventListener() (да, передача функций другим функциям в качестве аргументов возможна и очень распространена в JavaScript!).
 Но прежде чем мы попытаемся запустить это, нам нужно внести некоторые изменения в приведенный выше код, чтобы убедиться, что он работает правильно.
 Вы также можете попробовать запустить фрагмент кода CodePen. Нажмите кнопку «Отправить сообщение», а затем откройте консоль разработчика в том же окне, в котором вы читаете этот курс. Вы должны увидеть текст, нажатый в консоли.
 По сути, мы берем параметр события, предоставленный нашей функции, который содержит сведения о событии клика (например, что было нажато, свойства кнопки и т. д.), и предотвращаем обновление страницы формой с помощью event.preventDefault()
 Сохранить и перезагрузить. Откройте Инструменты разработчика, вкладку Консоль и попробуйте нажать кнопку.
 Ура!! Оно работает.
 Наш следующий шаг — получить значения, введенные в форму, с помощью JavaScript.
 4. Получение введенных пользователем значений 
 У нас есть форма на нашей веб-странице, но мы не говорили о том, как мы будем извлекать данные, которые пользователь может ввести в нашу форму. Чтобы заставить любую форму «работать», мы обычно получаем данные (то есть текст в нашем случае) внутри элементов формы (вводные данные, текстовые области и т. д.) в переменные JavaScript, а затем отправляем их на сервер. При желании многие разработчики любят выполнять некоторые проверки (то есть проверки) данных перед их отправкой на сервер. Примером проверки может быть проверка формата введенного электронного письма.
 Помните document.querySelector, который мы использовали в предыдущем разделе? Мы использовали его для выбора элементов HTML. Поскольку входные данные формы — это не что иное, как HTML-элементы, а данные, которые пользователь может ввести в эти входные данные, хранятся внутри HTML-элементов, мы могли бы использовать тот же document.querySelector и выбирать наши HTML-элементы.
 Тогда нам нужно узнать важную информацию. Доступ к значению ввода HTML или данным внутри него можно получить с помощью ключа «значение». Помните объекты? Объект элемента ввода HTML будет иметь ключ «значение», который содержит текущий текст внутри элемента.
 Наконец, мы выполним console.log значения из input и textarea и посмотрим, что мы получим в переменных emailText и messageText.
 Посмотреть изменения кода на GitHub >
 Отлично! Вы видели, как сообщение просто регистрируется, безупречно? Красиво, говорим мы. Вместо того, чтобы просто печатать emailText и messageText, мы немного отформатировали его, используя  console.log('email:', emailText,  …), который будет красиво печатать с меткой  email: , напечатанной как есть.
 Возможно, на этом этапе вы увидите некоторые ошибки. Просто вернитесь и убедитесь, что вы вводите его точно так, как есть. Поиграйте и попробуйте разные входы. Вы заметили какие-либо проблемы?
  Совет:  Важно делать ошибки. Вы должны привыкнуть видеть сообщения об ошибках и знать, что они означают. Поначалу это может показаться немного загадочным, но практика — это ключ. Получается ли у вас это сразу или после некоторых попыток, всегда есть чему поучиться.
 5. Проверка JavaScript 
 Если вы немного поиграли в предыдущем разделе, то заметили кое-что странное. Хотя в полях ввода написано электронная почта и сообщение, вы можете ввести в него что угодно, и оно все равно примет и распечатает его.
 На самом деле, он даже позволяет вам ввести пустой адрес электронной почты и сообщение. Это не хорошо. Нам нужно будет установить некоторые ограничения на то, что вводится, особенно поле электронной почты. Для наших целей достаточно проверить, содержит ли текст, введенный в поле электронной почты, символ «@». В реальном мире вы захотите проводить более строгие проверки данных.
 Для проверки электронной почты нам нужно написать функцию проверки. Валидация, как упоминалось в предыдущем разделе, — это проверки. Это могут быть проверки, чтобы убедиться, что данные находятся в том формате, который мы ожидаем, или чтобы отфильтровать любые нежелательные слова из текста, или что-то еще. Они служат простым способом сообщить пользователям о любых ошибках при отправке данных.
 В нашем примере проверки адреса электронной почты наша проверка на «@» может выявить случай, когда наши пользователи забывают набирать «@» или опечатываются в своих адресах электронной почты.
 Эта функция проверяет, содержит ли предоставленный текстовый параметр электронной почты символ «@». Он использует нечто, называемое условным оператором («если» и «иначе», которые вы видите). Вы можете прочитать это как, если да, он возвращает true. В противном случае возвращается ложь. Давайте проверим это в нашей функции clickListener, выполнив вход в консоль.
 Ладно, работает! Он не идеален, но демонстрирует, насколько выразительным является JavaScript. Теперь мы можем собрать все вместе внутри нашей функции clickListener и отобразить соответствующее сообщение.
 Попробуйте в CodePen и просмотрите результаты в консоли инструментов разработчика браузера.
 Здесь мы сначала проверяем электронную почту. Если это не удается, мы регистрируем сообщение об ошибке и возвращаем false (это один из способов предотвращения дальнейшего выполнения функции, означающий, что наш последний console.log не будет выполнен).
 Если блок if не выполняется (это означает, что  return false  не был обнаружен и функция все еще работает), мы предполагаем, что все прошло хорошо, и отображаем сообщение об успешном выполнении. Довольно мило, да?
 Посмотреть изменения кода на GitHub >
 Вы правильно поняли? Отличная работа! Если нет, просто внимательно посмотрите. Вы найдете ошибку. Помните, что отладка является важным навыком разработчика!
 Резюме 
 Поздравляем! Вы достигли конца своего краткого курса веб-разработки. Последние несколько дней были очень захватывающими, и мы надеемся, что вам понравилось это маленькое путешествие так же, как и нам.
 Мы начали с настройки вашей среды разработки и написания в ней первых нескольких строк кода. Затем мы добавили к нему HTML и данные, а затем немного CSS. Затем было больше CSS, чтобы сделать страницу красивой. Наконец, мы добавили немного магии JavaScript и оживили страницу.
 Мы гордимся тем, что вы дошли до конца, и надеемся, что это только начало вашего замечательного пути в веб-разработке.
 🧐Ежедневное задание 
 Итак, мы наконец подошли к нашему последнему ежедневному заданию. Вы в восторге от огромного мира веб-разработки, который лежит за пределами этого краткого курса? Мы уверены!
 Вот задачи для сегодняшней задачи:
 1. Подобно нашей функции  emailValidate , напишите новую функцию  validateNSFW  (Not Safe For Work), которая будет принимать  messageText  и вернуть true, если сообщение безопасно для работы. Функция должна возвращать false, если в тексте есть слово «дерьмо». Вы можете использовать функцию .includes() для задачи.
 Используйте ранее написанную функцию и подключите ее к функции  clickListener  аналогично тому, как мы сделали это для  emailValidate  и  messageValidate  , показывая ошибку при сбое  validateNSFW .
 👋Отходящие слова - Пока до свидания! 
 Сегодня был финишный отрезок этого курса, и мы очень рады, что вы прошли его. Конечно, это было нелегко, и мы надеемся, что вы узнали и получили удовольствие от этого опыта.
 У этого курса нет шестого дня, так что пока прощаемся. Но нам нравится думать об этом как о начале чего-то интересного, нового начала для вас. Если вы решите заняться веб-разработкой в качестве карьеры, годы спустя вы будете вспоминать тот момент, когда успешно создали свой самый первый веб-сайт и сделали его красивым и функциональным.
 Если вы хотите быть в курсе новых и интересных тем, связанных с веб-разработкой, рекомендуем вам заглянуть в наш блог! Наконец, помните, что бы ни случилось, никогда не переставайте учиться! Увидимся!
 📗Ссылки 
 Переменные
 if. .else (поток управления)
 Функции
 Объекты
 ❓ Часто задаваемые вопросы 
  В. JavaScript сильно отличается от того, что мы делали до сих пор. Почему это? 
 A. HTML, CSS и JavaScript имеют свое уникальное назначение в мире веб-разработки. JavaScript — это язык программирования, а это означает, что на нем можно писать очень подробные инструкции (и алгоритмы), чего нельзя сделать с помощью HTML и CSS. Прямо сейчас может показаться, что вы учите трехлетнего ребенка чему-то, но компьютеры — по большей части — нуждаются в таких подробных инструкциях!
  В. Это руководство было труднее понять, чем предыдущие? 
 A. Вы не одиноки, и это то, что чувствует каждый, когда впервые видит JavaScript. Но, как и во всем, вы можете улучшить это с практикой. Медленно, но верно он будет казаться таким же естественным, как английский.
  В. Разве мы не должны использовать «функцию» для написания функций? Так было написано в некоторых примерах, которые я читал в Интернете.
No related posts.

Оператор	Вопрос в задании
===	Две вещи равны?*
!==	Две вещи неравны?*
>=	Является ли первое значение больше или равно второму?
<=	Является ли первое значение меньше или равно второму?
>	Первое больше второго?
<	Первое меньше второго?

Ява скрипт программирование: Страница не найдена

бесплатное обучение онлайн, 39 уроков

Включено в курс

Чему вы научитесь

Описание

Уроки курса

Введение

Hello, World!

Инструкции

Арифметические операции

Ошибки оформления (синтаксиса и линтера)

Строки

Переменные

Выражения в определениях

Именование

Интерполяция

Извлечение символов из строки

Типы данных

Неизменяемость и примитивные типы

Функции и их вызов

Сигнатура функции

Вызов функции — выражение

Функции с переменным числом параметров

Детерминированность

Стандартная библиотека

Свойства и методы

Цепочка вызовов

Определение функций

Возврат значений

Параметры функций

Необязательные параметры функций

Упрощенный синтаксис функций

Логика

Логические операторы

Результат логических операций

Условные конструкции

Тернарный оператор

Конструкция Switch

Цикл while

Агрегация данных

Обход строк в цикле

Условия внутри тела цикла

Инкремент и декремент

Цикл for

Модули

Формат обучения

Испытания

JavaScript — Прототипно-ориентированный язык программирования / Хабр

JavaScript — Дока

Статьи раздела «JavaScript» по темам

Основы

Продвинутый синтаксис

Примитивные типы данных

Коллекции

Числа

Строки

Булев тип

Функции

Массивы

Объекты

Множества (

Обработка исключений

Браузерное окружение и API

О браузере

Объектная модель документа DOM

Объект страницы (

Элемент на странице (

События

Хранение данных в браузере

Асинхронный код

Обмен данными с API

Парадигмы программирования

Веб-приложение

Архитектура приложения

Тестирование

Типовые решения

Статьи раздела «JavaScript» по алфавиту

a

b

c