// ДЗ: Циклы //1. while confirm + // Сделайте цикл с confirm, который продолжается по Отмена и заканчивается по ОК. /*{ let i = 0; while (confirm("Введите что-то") === false) { i++ } } */ //2. array fill + // Создайте пустой массив и добавляйте в него элементы, пока пользователь не нажмет Отмена в очередном prompt. // Используйте push для удобства: push /*{ const arr = []; let name; while (name = prompt("Введите любое имя")) { arr.push(name); } console.log(arr) } */ // 3. array fill nopush + // Сделайте предыдущее задание, не используя push, а обращаясь к элементам по индексу. /*{ const arr = []; let name; let i =0; while (name = prompt("Введите любое имя")) { arr[i] = name i++; } console.log(arr) } */ // 4. infinite probability + // Создайте бесконечный цикл, который прерывается с помощью конструкции break, когда Math.random() > 0.9. // Код должен подсчитывать количество итераций и вывести это число с помощью alert. // { // let i = 0; // let j = Math.random(); // while (j < 0.9) { // j = Math.random() // i++ // if (j > 0.9) { // break // } // } // alert(`Число > 0.9 появилось на ${i} итерации.`) // } //5. empty loop + // Сделайте цикл с prompt, который прерывается по нажатию OK и продолжается по нажатию "Отмена" // c пустым телом цикла. /*{ let i = 0; while (prompt("Введите что-то") === false) { } } */ //6. progression sum + // Подсчитать сумму арифметической прогрессии от 1 до N c шагом 3 (1,4,7....) используя цикл for. // Метод Гаусса не применять, наоборот, сделать максимально наивное решение. // { // const n = prompt("Задайте число от 1 до n c шагом 3) // let x = 0; // for (let i = 1; i < n; i+=3){ // x += i; // } // console.log(`Сумма всех чисел от 1 до ${n} шагом 3 - ${x}`) // } //7. chess one line + // Сформировать строку " # # # # # " с помощью цикла for. Длина строки может быть четной и нечетной, // и указывается в одном месте в коде. // { // let x = "#"; // for (let i = 0; i < 10; i++){ // x += " #"; // } // console.log(x) // } // 8. numbers + // Сформировать строку c помощью вложенных циклов. Для перевода строки используйте \n. // // 0123456789 // 0123456789 // 0123456789 // 0123456789 // 0123456789 // 0123456789 // 0123456789 // 0123456789 // 0123456789 // 0123456789 // // { // let result = "" // // for (let i=0; i<10; ++i) { // let line = " " // for (let j=0; j<10; ++j) { // line += j // } // result += line + "\n" // } // console.log(result) // } // 9. chess + // Сформируйте строку с шахматной доской из вложенных циклов. Для перевода строки используйте \n. Код // должен поддерживать легкое изменение размеров доски. // // .#.#.#.#.#.# // #.#.#.#.#.#. // .#.#.#.#.#.# // #.#.#.#.#.#. // .#.#.#.#.#.# // #.#.#.#.#.#. // .#.#.#.#.#.# // #.#.#.#.#.#. // .#.#.#.#.#.# // #.#.#.#.#.#. // { // let result = "" // // for (let i=0; i<10; ++i) { // let line = "" // for (let j=0; j<10; ++j) { // line += i+j & 1 ? "#" : "." // } // result += line + "\n" // } // console.log(result) // } // 10. cubes + // Сформируйте массив из N элементов, содержащий в себе кубы индексов, т. е: // //[0,1,8,27,64...] // { // let arr = []; // let a = 1; // for (let i=0; i<15; i++) { // a = i**3; // arr.push(a) // } // console.log(arr) // } // 12. read array of objects - // Напишите функцию readArrayOfObjects, которая циклически добавляет в массив объекты, которые ввел пользователь. // Пользователь вводит ключи и значения (их в каждом объекте может быть любое количество), используя prompt. // Когда пользователь нажимает "Отмена" в окне prompt, ввод объекта заканчивается и объект добавляется в массив. // Перед вводом следующего объекта пользователю задается вопрос (используя confirm), хочет ли он продолжить это мучение // ввод объектов. При утвердительном ответе, опять работает ввод любюго количества ключей для создания нового объекта // Функция должна возвращать созданный массив с объектами. // const result = () => { // let arr = []; // let ask; // while (ask = confirm("Создадим объект")) { // while (ask === true) { // let obj = {}; // obj[prompt("Введите ключ")] = prompt('Введите значение для ключа'); // console.log(obj) // if (ask === false) { // break // } // } // } // } // result() // 13. ромбик + // Сформировать следующую строку - ромбик: // // .....#..... // ....###.... // ...#####... // ..#######.. // .#########. // ########### // .#########. // ..#######.. // ...#####... // ....###.... // .....#..... // let n = 10 // // for(let i=1; i<=n; i++){ // let str=''; // // for(let j=n-i; j>0; j--){ // str+=' '; // } // // for(let j=1; j<=i*2-1; j++){ // str+='#'; // } // console.log(str); // } // // for (let i=2; i<=n; i++){ // let str=''; // // for (let j=0; j0; j--){ // str+='#'; // } // console.log(str); // } // 14. DOM: multiply table + // Сделать таблицу умножения, используя DOM createElement и innerText. Создайте таблицу, вложенные строки и ячейки // в циклах. Должно получится что-то вроде этого: // { // let table = document.getElementById("table"); // document.body.append(table); // // for (let i = 1; i < 10; i++) { // let tr = document.createElement("tr"); // table.appendChild(tr); // if (i % 2 === 0) { // tr.style.backgroundColor = 'lightgrey'; // } // for (let j = 1; j < 10; j++) { // let td = document.createElement("td"); // tr.appendChild(td); // td.innerText = i * j; // table.style.width = '30%'; // table.style.border = 'black 2px' // } // } // } // const table = document.getElementById('table'); // // for (let i = 0; i < 10; i++){ // let tr = document.createElement('tr'); // if (i % 2 === 1) { // tr.style.backgroundColor = 'lightgrey'; // } // for (let j = 0; j < 10; j++){ // const td = document.createElement('td'); // let value = i * j; // if (value === 0) { // value = i || j; // } // td.innerHTML = value; // tr.appendChild(td); // } // table.appendChild(tr); // } // 15 DOM: highlight cell + // Подсветить ячейку, над которой находится курсор мыши. Используйте события mouseover и mouseout, // и style.backgroundColor для подсветки. Для того, что бы подсветить правильную ячейку, добавьте обработчики событий // во вложенный цикл, и используйте в них ту переменную, которая хранит . В таком случае замыкания вам помогут. // Внимание: :hover это читерство :-) // const table = document.getElementById('table'); // // for (let i = 0; i < 10; i++){ // let tr = document.createElement('tr'); // if (i % 2 === 1) { // tr.style.backgroundColor = 'lightgrey'; // } // for (let j = 0; j < 10; j++){ // const td = document.createElement('td'); // let value = i * j; // if (value === 0) { // value = i || j; // } // td.innerHTML = value; // tr.appendChild(td); // } // table.appendChild(tr); // } // // table.onmouseover = function(event) { // let target = event.target; // target.style.background = 'lightblue'; // }; // // table.onmouseout = function(event) { // target = event.target; // target.style.background = ''; // }; // 16. DOM: Highlight cross + // Подсветить строку и столбец, в которой находится подсвеченная ячейка. Если у вас обработчики событий объявлены во // вложенном цикле, то вы можете пользоваться счетчиками цикла (обычно i и j) и другими переменными, например // переменной, содержащей в себе DOM-элемент строки. // // const table = document.getElementById('table'); // // for (let i = 0; i < 10; i++){ // const row = document.createElement('tr'); // for (let j = 0; j < 10; j++){ // const col = document.createElement('td'); // let val = i * j; // if (val === 0) { // val = i || j; // } // col.innerHTML = val; // row.appendChild(col); // } // table.appendChild(row); // } // // table.onmouseover = function(event) { // let target = event.target; // target.style.background = 'pink'; // // document.querySelectorAll(".highlight").forEach( // item => item.classList.remove("highlight") // ); // target.closest("tr").classList.add("highlight"); // target.closest("table").querySelectorAll("tr").forEach( // row => row.cells[target.cellIndex].classList.add("highlight") // ); // }; // // table.onmouseout = function(event) { // let target = event.target; // target.style.background = ''; // // document.querySelectorAll(".highlight").forEach( // item => item.classList.remove("highlight") // ); // };