🎮 Разбираем игру "Угадай число" на JavaScript
Привет, друзья! 👋
Сегодня будем писать игру — и не просто так, а по кусочкам, как будто собираем пазл.
Называется — "Угадай число".
Ты думаешь: "О, это сложно, там же код!"
А я отвечу: "Нет. Это проще, чем объяснять маме, зачем тебе второй ноутбук." 😄
Представь: ты загадал число от 1 до 100, а компьютер пытается его угадать. Или наоборот — компьютер загадал, а ты угадываешь. Вот мы сделаем второе.
🔢 Что делает игра?
Компьютер загадывает случайное число от 1 до 100.
Ты вводишь своё число.
Он говорит: "Больше!", "Меньше!" или "Угадал! 🎉"
Побеждает тот, кто угадает быстрее.
💻 Вот весь код (не пугайся, сейчас разберём как по кусочкам пиццы):
🧩 Разбираем по частям
1. let загаданноеЧисло = Math.floor(Math.random() * 100) + 1;
Это как если бы компьютер закрыл глаза и вытащил число из шляпы.
Math.random() — даёт случайное число от 0 до 1 (например, 0.45).
Умножаем на 100 → получаем от 0 до 99.
Math.floor() — отрезает дробную часть (оставляет целое число).
+ 1 — чтобы число было от 1 до 100, а не от 0 до 99.
👉 Готово: загадали число!
2. prompt("Угадай число...")
Это как всплывающее окно в браузере, где игрок вводит своё число.
parseInt() — превращает текст в число. Потому что если ты напишешь "50", компьютер сначала видит это как слово, а не число. Надо сказать: "Это число!"
3. while (попытка !== загаданноеЧисло)
Это цикл — как "пока не угадал — продолжаем".
!== — значит "не равно".
То есть: пока твоё число не равно загаданному — спрашивай снова.
4. if (попытка < загаданноеЧисло)
Если твоё число меньше загаданного — говорим "Больше!".
Иначе (если больше) — говорим "Меньше!".
5. alert("УГАДАЛ!")
Когда вышли из цикла — значит, угадал!
Выводим победное сообщение. 🏆
🎯 Почему это круто?
Это первая настоящая игра, которую ты можешь запустить в браузере.
Ты понимаешь, как работает логика, циклы и условия — основа любого кода.
Потом можешь добавить уровни, попытки, таймер — и это уже будет твой мини-проект для портфолио!
🛠 Как попробовать?
Открой браузер (Chrome, Яндекс.Браузер и т.д.).
Нажми F12 → вкладка "Консоль".
Вставь этот код и нажми Enter.
Играй!
Или просто скопируй код в файл index.html и открой его — [расскажу, как, если нужно].
💡 А что дальше?
Добавь счётчик попыток: "Ты угадал за 5 раз!"
Ограничь число попыток (например, 7).
Сделай игру на двоих: один загадывает, другой угадывает.
📣 Хочешь, чтобы я записала про это видео?
Напиши "хочу видео"
А если ты уже пробовал писать такие игры — делись в комментариях, как получилось!
#JavaScript #Frontend
Привет, друзья! 👋
Сегодня будем писать игру — и не просто так, а по кусочкам, как будто собираем пазл.
Называется — "Угадай число".
Ты думаешь: "О, это сложно, там же код!"
А я отвечу: "Нет. Это проще, чем объяснять маме, зачем тебе второй ноутбук." 😄
Представь: ты загадал число от 1 до 100, а компьютер пытается его угадать. Или наоборот — компьютер загадал, а ты угадываешь. Вот мы сделаем второе.
🔢 Что делает игра?
Компьютер загадывает случайное число от 1 до 100.
Ты вводишь своё число.
Он говорит: "Больше!", "Меньше!" или "Угадал! 🎉"
Побеждает тот, кто угадает быстрее.
💻 Вот весь код (не пугайся, сейчас разберём как по кусочкам пиццы):
// 1. Компьютер загадывает число от 1 до 100
let загаданноеЧисло = Math.floor(Math.random() * 100) + 1;
// 2. Спрашиваем игрока
let попытка = parseInt(prompt("Угадай число от 1 до 100!"));
// 3. Пока не угадал — спрашиваем снова
while (попытка !== загаданноеЧисло) {
if (попытка < загаданноеЧисло) {
попытка = parseInt(prompt("Больше! Попробуй ещё:"));
} else {
попытка = parseInt(prompt("Меньше! Попробуй ещё:"));
}
}
// 4. Когда угадал — радуемся!
alert("УГАДАЛ! Это было " + загаданноеЧисло + " 🎉");
🧩 Разбираем по частям
1. let загаданноеЧисло = Math.floor(Math.random() * 100) + 1;
Это как если бы компьютер закрыл глаза и вытащил число из шляпы.
Math.random() — даёт случайное число от 0 до 1 (например, 0.45).
Умножаем на 100 → получаем от 0 до 99.
Math.floor() — отрезает дробную часть (оставляет целое число).
+ 1 — чтобы число было от 1 до 100, а не от 0 до 99.
👉 Готово: загадали число!
2. prompt("Угадай число...")
Это как всплывающее окно в браузере, где игрок вводит своё число.
parseInt() — превращает текст в число. Потому что если ты напишешь "50", компьютер сначала видит это как слово, а не число. Надо сказать: "Это число!"
3. while (попытка !== загаданноеЧисло)
Это цикл — как "пока не угадал — продолжаем".
!== — значит "не равно".
То есть: пока твоё число не равно загаданному — спрашивай снова.
4. if (попытка < загаданноеЧисло)
Если твоё число меньше загаданного — говорим "Больше!".
Иначе (если больше) — говорим "Меньше!".
5. alert("УГАДАЛ!")
Когда вышли из цикла — значит, угадал!
Выводим победное сообщение. 🏆
🎯 Почему это круто?
Это первая настоящая игра, которую ты можешь запустить в браузере.
Ты понимаешь, как работает логика, циклы и условия — основа любого кода.
Потом можешь добавить уровни, попытки, таймер — и это уже будет твой мини-проект для портфолио!
🛠 Как попробовать?
Открой браузер (Chrome, Яндекс.Браузер и т.д.).
Нажми F12 → вкладка "Консоль".
Вставь этот код и нажми Enter.
Играй!
Или просто скопируй код в файл index.html и открой его — [расскажу, как, если нужно].
💡 А что дальше?
Добавь счётчик попыток: "Ты угадал за 5 раз!"
Ограничь число попыток (например, 7).
Сделай игру на двоих: один загадывает, другой угадывает.
📣 Хочешь, чтобы я записала про это видео?
Напиши "хочу видео"
А если ты уже пробовал писать такие игры — делись в комментариях, как получилось!
#JavaScript #Frontend
🔥17👍16❤13👨💻10🥰1