Возврат значений | Основы JavaScript
Для перемещения по курсу нужно зарегистрироваться
1. Введение ↳ теория
2. Hello, World! ↳ теория / тесты / упражнение
3. Инструкции ↳ теория / тесты / упражнение
4. Арифметические операции ↳ теория / тесты / упражнение
5. Ошибки оформления (синтаксиса и линтера) ↳ теория / тесты / упражнение
6. Строки ↳ теория / тесты / упражнение
7. Переменные ↳ теория / тесты / упражнение
8. Выражения в определениях ↳ теория / тесты / упражнение
9. Именование ↳ теория / тесты / упражнение
10. Интерполяция ↳ теория / тесты / упражнение
11. Извлечение символов из строки ↳ теория / тесты / упражнение
12. Типы данных ↳ теория / тесты / упражнение
13. Неизменяемость и примитивные типы ↳ теория / тесты / упражнение
14. Функции и их вызов ↳ теория / тесты / упражнение
15. Сигнатура функции ↳ теория / тесты / упражнение
16. Вызов функции — выражение ↳ теория / тесты / упражнение
17.
18. Детерминированность ↳ теория / тесты / упражнение
19. Стандартная библиотека ↳ теория / тесты / упражнение
20. Свойства и методы ↳ теория / тесты / упражнение
21. Цепочка вызовов ↳ теория / тесты / упражнение
22. Определение функций ↳ теория / тесты / упражнение
23. Возврат значений ↳ теория / тесты / упражнение
24. Параметры функций ↳ теория / тесты / упражнение
25. Необязательные параметры функций ↳ теория / тесты / упражнение
26. Упрощенный синтаксис функций ↳ теория / тесты / упражнение
27. Логика ↳ теория / тесты / упражнение
28. Логические операторы ↳ теория / тесты / упражнение
29. Результат логических операций ↳ теория / тесты / упражнение
30. Условные конструкции ↳ теория / тесты / упражнение
31. Тернарный оператор ↳ теория / тесты / упражнение
32. Конструкция Switch ↳ теория / тесты / упражнение
33. Цикл while ↳ теория / тесты / упражнение
34.
Агрегация данных
↳
теория
/
тесты
/
упражнение
35. Обход строк в цикле ↳ теория / тесты / упражнение
36. Условия внутри тела цикла ↳ теория / тесты / упражнение
37. Инкремент и декремент ↳ теория / тесты / упражнение
38. Цикл for ↳ теория / тесты / упражнение
39. Модули ↳ теория / тесты / упражнение
Испытания
1. Фибоначчи
2. Найди Fizz и Buzz
3. Переворот числа
4. Счастливый билет
5. Фасад
6. Идеальные числа
7. Инвертированный регистр
8. Счастливые числа
Порой обучение продвигается с трудом. Сложная теория, непонятные задания… Хочется бросить. Не сдавайтесь, все сложности можно преодолеть. Рассказываем, как
Не понятна формулировка, нашли опечатку?
Выделите текст, нажмите ctrl + enter и опишите проблему, затем отправьте нам. В течение нескольких дней мы улучшим формулировку или исправим опечатку
Что-то не получается в уроке?
Загляните в раздел «Обсуждение»:
- Изучите вопросы, которые задавали по уроку другие студенты — возможно, ответ на ваш уже есть
- Если вопросы остались, задайте свой.
Расскажите, что непонятно или сложно, дайте ссылку на ваше решение. Обратите внимание — команда поддержки не отвечает на вопросы по коду, но поможет разобраться с заданием или выводом тестов - Мы отвечаем на сообщения в течение 2-3 дней. К «Обсуждениям» могут подключаться и другие студенты. Возможно, получится решить вопрос быстрее!
Расскажите, что непонятно или сложно, дайте ссылку на ваше решение. Обратите внимание — команда поддержки не отвечает на вопросы по коду, но поможет разобраться с заданием или выводом тестовПодробнее о том, как задавать вопросы по уроку
JavaScript в действии
|
Ознакомившись с этим уроком, вы сможете наконец создать свой первый сценарий. Вы начнете осваивать
азы JavaScript на конкретных примерах.
Вы изучите следующий материал:
основные понятия JavaScript, такие как синтаксис, разметка, комментарии и др.; некоторые термины языка JavaScript и причины, по которым он относится к объектно-ориентированным языкам программирования; создание и чтение сценария JavaScript; использование JavaScript для вывода и ввода информации. 
Ввод/вывод информации с помощью JavaScriptПримечание:В этом уроке приводятся образцы сценариев JavaScript. Тщательно проработайте каждый из них, вводя код с клавиатуры. Следует потренироваться на элементарных примерах, прежде чем переходить к более сложным. Исследование возможностей ввода и вывода информации — это не только замечательный повод научиться создавать сценарии JavaScript, обеспечивающие двустороннюю связь с пользователем, но и прекрасное начало вашего профессионального пути. В вычислительной технике все основано на вводе и выводе данных. Без этого ничего не происходит. Текстовый процессор не выполняет никаких действий, пока пользователь не введет какую-либо информацию (символы, набираемые на клавиатуре), и лишь затем эта информация отображается на экране, распечатывается или сохраняется на жестком диске.Теперь вы научитесь как вводить информацию с помощью JavaScript, так и выводить ее в виде разнообразных
окон сообщений. Все эти окна созданы на языке JavaScript: Alert (Предупреждение) — служит для вывода информации;Confirm (Подтверждение) — предназначено для вывода информации и позволяет пользователю сделать выбор в форме ответа Да/Нет на вопрос; Prompt (Запрос) — служит для вывода информации и позволяет пользователю ввести ответ с клавиатуры. Рис. 3.1. Окно предупредительных сообщений в браузере Internet Explorer Рис. 3.2. Окно предупредительных сообщений в браузере Netscape Navigator Рис. 3.3. Окно подтверждения в браузере Internet Explorer Рис. Рис. 3.5. Окно запросов в браузере Internet Explorer Рис. 3.6. Окно запросов в браузере Netscape Navigator Примечание: Объекты, методы и свойстваВы, вероятно, слышали о том, что JavaScript — объектно-ориентированный язык. Но что это означает? Чтобы это понять, вам следует ознакомиться с тремя терминами: объекты;методы; свойства. 
Сначала рассмотрим их в общих чертах. Чем дальше вы продвинетесь в изучении JavaScript, тем чаще вам
придется ими пользоваться, так что более близкое знакомство оставим на будущее.
Объекты
Говоря простым языком, объект (object) — это какой-либо предмет. Подобно тому, как в реальном мире все
одушевленные и неодушевленные предметы являются объектами (машины, собаки и пр.), объектами считаются
и составляющие компьютерного мира.
Что касается JavaScript, его объекты находятся внутри браузера. Это, в частности, окно браузера, формы и их части, например кнопки и текстовые окна. В JavaScript также имеется собственная группа встроенных объектов, к которым относятся массивы, данные и т.д. Сейчас вам не обязательно фиксировать на этом внимание, поскольку все эти объекты будут рассмотрены позже. Пока вы должны усвоить лишь необходимые определения.  Язык организован
вокруг объектов, а не действий, или, иначе говоря, ориентирован на данные, а не на логику.
При объектно-ориентированном программировании первоочередное внимание уделяется объектам, с
которыми производятся некоторые манипуляции, а не логическим правилам, необходимым для таких
манипуляций. Преимуществом такого подхода является не только облегчение программирования (или
написания сценария), но и в то, что каждое действие можно выполнить разными способами.
Методы
Метод (method) — это действия, которые может выполнять объект. В реальном мире у объектов тоже
имеются какие-либо методы. Машины ездят, собаки лают, доллар покупается и т.д. В нашем случае alert( )
является методом объекта Window, то есть объект Window может выдавать пользователю какое-либо
предупреждение в окне сообщений. Примерами других методов являются открытие и закрытие окон, нажатие
кнопок. Здесь речь идет о трех методах: open( ), close( ) и
click( ). Обратите внимание на круглые
скобки. Они означают, что методы, в отличие от свойств, используются.
Свойства
У всех объектов имеются свойства (properties). Если вы и далее будете следовать аналогии с объектами
реального мира, то обнаружите, что все предметы обладают какими-то свойствами: у машин есть колеса, а
у собаки — шерсть. Что касается JavaScript, то у такого объекта, как браузер, имеется название и
номер версии.
Рекомендация: Использование метода alert( )Пользоваться методом alert( ) проще всего. Он применяется для вывода на экран текстовой информации в краткой форме. После прочтения сообщения пользователь щелкает по кнопке ОК и окно исчезает.
Прежде всего, откройте шаблон HTML-страницы в текстовом редакторе и сохраните его под новым именем в любой удобной для вас папке. Примечание: Пример 3.1. Чтобы вызвать на экран окно предупредительных сообщений, измените шаблон в соответствии со следующим листингом: Примечание: Рис. 3.7. Окно предупредительных сообщений с созданным вами сообщением в браузере Internet Explorer Пример 3.2. Вывести на экран второе предупреждение так же просто, как и первое. Добавьте еще один вызов alert( ) в блоке SCRIPT в следующей строке за первым предупреждением и введите в кавычках сообщение: Сохраните файл и обновите экран в браузере. На этот раз появятся два сообщения. Обратите внимание, что они выводятся на дисплей раздельно, а не одно над другим. То есть JavaScript выполняет команды сценария поочередно, а не все подряд, без остановки. Только если пользователь щелкнет по кнопке
ОК в первом окне, на экране появится второе.
Рис. 3.8. Первое окно сообщений Рис. 3.9. Второе окно сообщений Рекомендация: Упражнение: Добавление комментариев в сценарий JavaScriptПрофессионалы, работающие с JavaScript, используют любую возможность, чтобы облегчить чтение собственного кода при повторном к нему обращении (быть может, через несколько месяцев). Одним из таких
вспомогательных приемов является использование комментариев JavaScript, один из которых вы уже
встречали в предыдущем уроке — комментарий в одну строку.
Однострочный комментарий
Пример 3.3. Ниже приводится пример использования однострочных комментариев:
Запустив на выполнение этот сценарий, вы не заметите в итоге никаких изменений. Причина в том, что
комментарии сделали свое дело и «спрятали» от браузера ваши примечания.
Многострочный комментарий
Иногда в сценарий приходится добавлять комментарии в несколько строк. В этом случае вы можете по-прежнему
вставлять / / в начале каждой строки, но это не слишком удобно. Лучше использовать специальные
последовательности символов для обозначения многострочных комментариев.
Многострочный комментарий открывается комбинацией /*, за которой следует собственно комментарий, и
закрывается комбинацией * /. Упражнение: Использование метода confirm( )Метод confirm( ) подобен методу alert( ), но в появляющемся на экране окне пользователь может сделать выбор между кнопками ОК и Cancel. Окно сообщения выводится тем же способом, с той разницей, что вместо метода alert( ) указывается метод confirm( ).
Примечание: Рис. 3.10. Окно подтверждения с созданным вами с ообщением в браузере Internet Explorer Обратите внимание, что в диалоговом окне имеются две кнопки — ОК и Cancel. По какой бы вы сейчас ни щелкнули, результат будет один — окно исчезнет.
Прежде чем вы сможете пользоваться кнопками в окне подтверждения, вам предстоит приобрести некоторые
навыки работы с JavaScript, после чего снова вернемся к методу confirm( ).
Упражнение: Использование методаprompt( ) Метод prompt( ) несколько отличается от предыдущих двух методов, которые вы изучили в данном уроке. Он дает возможность пользователю вписать собственный ответ на вопрос, вместо того чтобы просто выводить на экран информацию (как в методе alert( ) ) или делать выбор между кнопками ОК и Cancel (как в методе confirm( )).Пример 3. С этого момента ввод метода prompt( ) начинает отличаться от ввода предыдущих двух методов, поскольку в круглые скобки требуется добавить две фразы. Первая из них — сообщение, которое должно быть выведено на экран. Пример 3.7. Делается это так же, как и в двух предыдущих случаях. Текст в кавычках помещается внутри круглых скобок: Сохраните вашу страницу и просмотрите ее в браузере. Обратите внимание на появившийся запрос об имени пользователя (рис. 3.11). Вы можете ввести имя и щелкнуть по одной из кнопок выбора.Рис. 3.11. Окно запросов с созданным вами сообщением в браузере Internet Explorer Обратите внимание на слово undefined (не определено) в поле ввода. Это особенность
Internet Explorer. В браузере Netscape Navigator поле ввода остается пустым (рис. 3.10).
Рис. 3.12. Окно запросов с созданным вами сообщением в браузере Netscape Navigator В настоящий момент еще ничего происходит, что бы вы ни делали, но к концу этого урока вы сумеете заставить программу работать.Следующая единица ввода — это текст по умолчанию, который должен появиться в соответствующем поле. Добавить его очень просто, а заодно это позволит избавиться от появления undefined в браузере Internet Explorer. Пример 3.8. После первой фразы в круглых скобках поставьте запятую за пределами кавычек, а после нее впишите вторую фразу (тоже в кавычках). Это делается таким образом: Сохраните вашу страницу и обновите вид в браузере. Обратите внимание, что поле ввода больше не является пустым, а содержит текст, указанный во второй паре кавычек (рис. 3.11).
Рис. 3.13. Окно запросов с созданным вами сообщением и текстом поля ввода по умолчанию в браузере Internet Explorer Упражнение:Попробуйте помещать вызов метода prompt( ) на Web-страницу. Введите ваши собственные сообщения и текст поля ввода по умолчанию. Дважды на одной странице используйте метод prompt( ) и взгляните на результат. Добавьте в вашу Web-страницу комментарии (одно- и многострочные). |
(Если вам приходилось блуждать по сети дольше нескольких минут, то вам они уже
встречались.)
Этот символ будет очень часто встречаться в следующих уроках. В четвертом
уроке вы узнаете, где и когда он используется.
6. Метод prompt( ) вводят в сценарий так же, как и два ранее рассмотренных
метода. Сначала добавьте prompt( ) в блок SCRIPT:: Элемент Output — HTML: Язык гипертекстовой разметки
HTML-элемент — это элемент-контейнер, в который сайт или приложение может вводить результаты вычислений или результат действия пользователя.
Этот элемент включает глобальные атрибуты.
-
для Разделенный пробелами список
идентификаторовдругих элементов, указывающий, что эти элементы внесли вклад в входные значения (или иным образом повлияли) на вычисление.-
форма Элемент
-
имя Имя элемента. Используется в
form.elementsAPI.
Значение , имя и содержимое НЕ передаются во время отправки формы.
В следующем примере форма предоставляет ползунок, значение которого может варьироваться от 0 и 100 и элемент , в который можно ввести второе число.
Два числа складываются вместе, и результат отображается в элементе каждый раз, когда изменяется значение любого из элементов управления.
+ =
Результат
Многие браузеры реализуют этот элемент как регион aria-live . Таким образом, вспомогательная технология будет объявлять о результатах взаимодействия с пользовательским интерфейсом, размещенных внутри нее, не требуя переключения фокуса с элементов управления, которые производят эти результаты.
| Категории контента | Потоковое содержание, фразовое содержание, перечисленный, маркируемый, сбрасываемый формоассоциированный элемент, осязаемое содержание. |
|---|---|
| Разрешенный контент | Фразы контента. |
| Отсутствие тега | Нет, начальный и конечный теги обязательны. |
| Разрешенные родители | Любой элемент, принимающий фразовое содержание. |
| Неявная роль ARIA | статус |
| Разрешенные роли ARIA | Любой |
| Интерфейс DOM | HTMLOutputElement |
| Спецификация |
|---|
| Стандарт HTML # the-output-element |
Таблицы BCD загружаются только в браузере с включенным JavaScript. Включите JavaScript для просмотра данных.
Обнаружили проблему с содержанием этой страницы?
- Отредактируйте страницу на GitHub.
- Сообщить о проблеме с содержимым.
- Просмотрите исходный код на GitHub.
Хотите принять участие?
Узнайте, как внести свой вклад.
Последний раз эта страница была изменена участниками MDN.
Wallaby.js Введение: Инспектор вывода
Wallaby’s Output Inspector предоставляет вам эргономичный и удобный способ проверки зарегистрированных значений и сведений об ошибках в удобном для редактора виде.
Выберите редактора
Информация на этой странице соответствует выбранному вами редактору. Пожалуйста, выберите свой редактор, нажав на логотип вашего редактора ниже, прежде чем продолжить обучение:
Открытие инспектора вывода
Когда вы используете функции Live Comments или Live Value Display, а зарегистрированное значение слишком длинное для отображения в качестве встроенного сообщения в вашем редакторе , Wallaby автоматически показывает значение в Инспекторе вывода.
Чтобы проверить ошибку, вы можете выбрать строку с ошибкой в вашем редакторе или использовать Контекстное действие Показать ошибку или команду Показать ошибку .
Чтобы проверить ошибку, вы можете выбрать строку с ошибкой в вашем редакторе или же использовать действие намерения Показать ошибку или действие Показать ошибку .
Работа с Инспектором вывода
Инспектор вывода — это экземпляр редактора кода, доступный только для чтения, который имеет все основные встроенные функции редактора, такие как подсветка синтаксиса, копирование, поиск и т. д. Кроме того, он предоставляет набор уникальных контекстно-зависимых действий, реализованных в виде линзы кода, команд и сочетаний клавиш, которые еще больше упрощают и ускоряют анализ и исправление ошибок тестирования.
Главный ярлык навигации — F12 , который позволяет перейти к исходному коду в зависимости от вашего текущего контекста (где находится ваш курсор).
Для ошибок вы также можете Перейти к ошибке , Перейти к тесту , Отладочный тест , Показать параллельные различия , Обновить тестовые снимки и Перейти к снимку . Для Live Comments или Live Value Display вы можете использовать Перейти к коду , Перейти к тесту , Отладочный тест и Показать в Value Explorer с помощью действий линзы кода.
В зависимости от вашего текущего контекста (где находится ваш курсор) для вас доступно несколько полезных намеренных действий ( Alt+Enter ). Для ошибок вы можете использовать Перейти к ошибке , Перейти к тесту , Отладочный тест , Показать параллельные различия и Обновить тестовые снимки . Для Live Comments или Live Value Display вы можете использовать Перейти к коду , Перейти к тесту , Отладочный тест и Выявление в обозревателе значений с помощью линзы кода или действий намерений.
После того, как рядом с вашим главным редактором кода откроется окно инспектора вывода, вы можете переключить фокус на него и обратно, нажав сочетание клавиш Ctrl+Shift+/ (или вызвав команду Toggle Output Inspector Focus ).
Чтобы закрыть Инспектор вывода, вы можете использовать сочетание клавиш Shift+Escape (команда Close Output Inspector ).
После открытия окна Инспектора вывода вы можете переключить фокус на него и обратно, нажав Alt+Shift+\ Ярлык (или вызвав действие Toggle Output Inspector Focus ).
Чтобы закрыть инспектор вывода, вы можете использовать сочетание клавиш Alt+Shift+Backspace (действие Close Output Inspector ) или сочетание клавиш Escape , если он находится в режиме просмотра Split Editor .
Инспектор вывода может отображать несколько фрагментов вывода (ошибки и/или значения) вместе, однако, если некоторые из них вас больше не интересуют, вы можете удалить их, нажав Del или Backspace клавиш в любом месте фрагмента вывода.
Кроме того, вы можете использовать кодовую линзу Удалить над каждым выходным фрагментом.
Инспектор вывода может отображать несколько фрагментов вывода (ошибки и/или значения) вместе, однако, если некоторые из них вас больше не интересуют, вы можете удалить их, нажав клавиши Shift+Alt+Del или вызвав Удалить элемент действие намерения в любом месте внутри выходного фрагмента. Кроме того, вы можете использовать Удалить линзу с кодом над каждым выходным фрагментом.
По умолчанию Инспектор вывода автоматически отображается для больших объектов и ошибок. Вы можете настроить его так, чтобы он никогда не отображался автоматически, автоматически отображался только при ошибках или автоматически отображался для всех значений (включая меньшие) с помощью Automatic Display и Automatic Display Debugger Override Настройки Wallaby:
По умолчанию, Output Inspector автоматически отображается для больших объектов и ошибок.