Строки и столбцы
Создайте сетку
«Строки и столбцы» — бесплатный урок Javascript for Kids на CoddyKit. Это урок 2 из 4. Ты можешь прочитать весь урок бесплатно ниже — а потом практиковать его прямо в браузере с встроенным редактором кода и ИИ-репетитором 24/7. Это часть пути обучения Javascript for Kids, и твой прогресс синхронизируется между веб-версией и приложением CoddyKit. Курс Javascript for Kids содержит 4 уроков всего.
Создаём таблицу! 🟦🟦
Таблица похожа на шахматную доску или окно с маленькими квадратами! В ней есть строки (по горизонтали) и столбцы (по вертикали). ⬜⬜⬜
Вложенные циклы PERFECT подходят для рисования таблиц!
Создаём строку 📏
Чтобы создать ONE строку из звёзд, можно соединять звёзды с помощью + в строке.
Давайте будем пошагово создавать текст строки!
let row = ''
for (let col = 1; col <= 4; col++) {
row = row + '*'
}
console.log(row)Что произошло? 🔍
Мы начали с EMPTY слова ''. Каждый проход цикла добавлял один *. Поэтому строка росла: *, **, ***, ****!
Затем мы вывели готовую строку. Здорово! ✨
let row = ''
for (let col = 1; col <= 3; col++) {
row = row + '*'
console.log(row)
}Много строк 📚
Теперь поместим этот код во внешний цикл, чтобы создать много строк! Внешний цикл = строки, внутренний = столбцы.
for (let r = 1; r <= 3; r++) {
let row = ''
for (let c = 1; c <= 4; c++) {
row = row + '*'
}
console.log(row)
}Квадрат 4 на 4 🟦
Давайте создадим PERFECT квадрат! 4 строки и 4 столбца из звёзд.
for (let r = 1; r <= 4; r++) {
let row = ''
for (let c = 1; c <= 4; c++) {
row = row + '*'
}
console.log(row)
}Используем эмодзи! 🎨
Зачем использовать скучные звёзды? Давайте создадим таблицу из сердечек! 💖
for (let r = 1; r <= 3; r++) {
let row = ''
for (let c = 1; c <= 3; c++) {
row = row + '💖'
}
console.log(row)
}Широкий прямоугольник ▭
Количество строк и столбцов не обязано совпадать! Давайте создадим широкий прямоугольник: 2 строки и 6 столбцов.
for (let r = 1; r <= 2; r++) {
let row = ''
for (let c = 1; c <= 6; c++) {
row = row + '🟩'
}
console.log(row)
}Числовая таблица 🔢
Вместо звёзд заполним таблицу номером столбца!
for (let r = 1; r <= 3; r++) {
let row = ''
for (let c = 1; c <= 4; c++) {
row = row + c
}
console.log(row)
}Высокая таблица 🏢
Давайте построим высокую башню! 6 строк и 2 столбца из блоков. 🧱
for (let r = 1; r <= 6; r++) {
let row = ''
for (let c = 1; c <= 2; c++) {
row = row + '🧱'
}
console.log(row)
}Добавляем пробелы 🔲
Поставьте пробел между символами, чтобы раздвинуть их! Используйте '* ' с пробелом.
for (let r = 1; r <= 3; r++) {
let row = ''
for (let c = 1; c <= 4; c++) {
row = row + '* '
}
console.log(row)
}Теперь Ваша очередь строить 🌟
Замените сердечки на звёзды 🌟 или измените размер! Отредактируйте код и запустите его, чтобы создать YOUR таблицу.
for (let r = 1; r <= 4; r++) {
let row = ''
for (let c = 1; c <= 5; c++) {
row = row + '🌟'
}
console.log(row)
}Быстрая проверка ✅
Проверим, как Вы поняли таблицы! 🧠
Повторение: строки и столбцы 🎉
Красивые таблицы! 🟦 Вы научились их создавать.
- Внешний цикл = строки
- Внутренний цикл = столбцы
- Создавайте текст строки с помощью
row = row + symbol, затем выводите его
Далее: растущие треугольники из звёзд! 🔺
Часто задаваемые вопросы
Урок «Строки и столбцы» бесплатный?
Да — полный текст урока «Строки и столбцы» бесплатно доступен здесь в веб-версии. Чтобы практиковать его интерактивно (встроенный редактор кода и ИИ-репетитор 24/7) и разблокировать остальной курс Javascript for Kids, подпишись на CoddyKit PRO. Курс Javascript for Kids содержит 4 уроков всего.
Чему я научусь в уроке «Строки и столбцы»?
Создайте сетку Ты практикуешь Javascript for Kids с помощью реального кода, который запускаешь прямо в браузере, и ИИ-репетитор 24/7 отвечает на твои вопросы во время урока.
Нужен ли мне опыт, чтобы начать Javascript for Kids?
Предыдущий опыт не требуется. Javascript for Kids на CoddyKit структурирован для всех уровней — от новичков до продвинутых, поэтому ты можешь начать отсюда или с самого начала и учиться в своем темпе. Это урок 2 из 4.
Сколько времени занимает урок «Строки и столбцы»?
Большинство уроков CoddyKit занимают около 5–10 минут. Каждый из них компактный и интерактивный, поэтому ты постоянно делаешь прогресс и продолжаешь с того же места в веб-версии и приложении.
Можно ли писать и запускать код в этом уроке Javascript for Kids?
Да. Каждый урок Javascript for Kids включает встроенный редактор кода, поэтому ты пишешь и запускаешь реальный код прямо в браузере и получаешь моментальную обратную связь от AI — локальная установка не требуется.
Все уроки этого курса
- Цикл внутри цикла
- Строки и столбцы
- Звёздные треугольники
- Таблица умножения