├── JavaScriptForBeginners.js ├── README.md ├── cards ├── app.js ├── index.html └── stiles.css ├── js_hw_1.js ├── js_hw_2.js ├── js_hw_3.html ├── js_hw_3.js └── js_hw_4.js /JavaScriptForBeginners.js: -------------------------------------------------------------------------------- 1 | // 1. В указанное место напишите код, который поместит значение из переменной a в переменную x 2 | function testA(a) { 3 | let x = ""; 4 | x = a; 5 | return x; 6 | } 7 | 8 | // 2. Вписать в указанное место код, который будет присваивать переменной "х" значение суммы переменных "a" и "b" 9 | function testSum(a, b) { 10 | var x; 11 | x=a+b 12 | return x; 13 | } 14 | 15 | // 3. Вписать в указанное место код, который будет присваивать переменной "х" удвоенное значение остатка от деления произведения переменных "a" и "b" на их сумму. 16 | function testOperation(a, b) { 17 | var x; 18 | x = (a * b) % (a + b) * 2; 19 | return x; 20 | } 21 | 22 | // 4. Вписать в указанное место код, который будет присваивать переменной "х" значение суммы переменных "a" и "b" в случае если a > b или их произведение в остальных случаях. 23 | function testIf(a, b) { 24 | var x; 25 | x = a > b ? a + b : a * b; 26 | return x; 27 | } 28 | 29 | // 5. Вписать в указанное место код, который будет присваивать переменной "х" значение суммы переменных "a" и "b" - в 30 | // случае если a < b, разность "a" и "b" - в случае если a > b, и их произведение в остальных случаях. 31 | function testIf(a, b) { 32 | var x; 33 | x = a < b ? a + b : (a > b ? a - b : a * b); 34 | return x; 35 | } 36 | 37 | // 6. Вписать в указанное место код, который будет присваивать переменной "х" название цифры, переданной в переменную "а". Цифра в 38 | // переменную "а" будет передана случайным образом и может оказаться в диапазоне от 0 до 9 включительно. 39 | // Варианты решения 40 | // 6.1. String constant 41 | testCase = a => { 42 | const words = 'Ноль Один Два Три Четыре Пять Шесть Семь Восемь Девять'; 43 | return words.split(' ')[a]; 44 | }; 45 | 46 | // 6.2. Array constant 47 | testCase = a => { 48 | const words = ["Ноль", "Один", "Два", "Три", "Четыре", "Пять", "Шесть", "Семь", "Восемь", "Девять"]; 49 | return words[a]; 50 | }; 51 | 52 | // 6.3. Object constant 53 | testCase = a => { 54 | const words = {0: "Ноль", 1: "Один", 2: "Два", 3: "Три", 4: "Четыре", 55 | 5: "Пять", 6: "Шесть", 7: "Семь", 8: "Восемь", 9: "Девять"}; 56 | return words[a]; 57 | }; 58 | 59 | // 7. Вычислить факториал для числа, передаваемого в нашу функцию и вывести его с помощью команды return. 60 | function testFactorial(a) { 61 | var x = 1; 62 | for (var i = 1; i <= a; i++) { 63 | x = x * i; 64 | } 65 | return x; 66 | } 67 | 68 | // 8. Вычислить сумму всех четных чисел, встречающихся в ряду от 1 до числа. 69 | function testWhile(a) { 70 | var x=0; 71 | var i = 1; 72 | while (i <= a) { 73 | if (i % 2 == 0) { 74 | x += i; 75 | } 76 | i++; 77 | } 78 | return x; 79 | } 80 | 81 | // 9. Напишите рекурсивную функцию, которая возвращает строку чисел от 1 до n, разделенных пробелом. 82 | function my_function(n) { 83 | return n <= 1? 1 : my_function(n - 1) + ' ' + n; 84 | } 85 | 86 | // 10. В функцию testStr передаются две строки. Нужно вернуть из функции суммарную длину. 87 | function testStr(a, b) { 88 | return(a.length + b.length); 89 | } 90 | 91 | // 11. Вернуть из функции символ строки, порядковый номер которого указан в переданном в функцию числе. 92 | function testStr(str, n){ 93 | return(str.charAt(n-1)) 94 | } 95 | 96 | // 12. Вернуть из функции строку, которая будет включать в себя обе этих строки, преобразовав в первой строке все буквы в заглавные, а во второй - в строчные. 97 | function testStr(a, b) { 98 | return(a.toUpperCase().concat(b.toLowerCase())) 99 | } 100 | 101 | // 13. Вернуть индекс позиции, с которой начинается вхождение второй строки в первую. 102 | function testStr(a, b) { 103 | return a.indexOf(b); 104 | } 105 | 106 | // 14. Сосчитать сумму всех элементов обоих массивов и возвратить ее из функции. 107 | function testArray(a, b) { 108 | let sum = 0; 109 | for(let x of a) sum += x; 110 | for(let x of b) sum += x; 111 | return sum; 112 | } 113 | 114 | // 15. Составить из символов этих строк один массив, затем добавить первым элементом массива текстовое значение "Иванов", и вернуть из функции все элементы в обратном порядке, преобразовав в строку. 115 | function testArray(a, b) { 116 | const total = a.concat(b); 117 | return [...total].reverse().join('') + "Иванов"; 118 | } 119 | 120 | // 16. Вам нужно превратить строки в даты, сравнить их. Для той, что больше получить день недели и вернуть его из функции. 121 | function testDateTime(a, b) { 122 | let date1 = new Date(a); 123 | let date2 = new Date(b); 124 | let daysArr = ["Воскресенье", "Понедельник", "Вторник", "Среда", "Четверг", "Пятница", "Суббота"]; 125 | if (date1 > date2) 126 | return daysArr[date1.getDay()]; 127 | else 128 | return daysArr[date2.getDay()]; 129 | } 130 | 131 | // 17. В функцию передается угол в градусах. Нужно вернуть из функции значение его синуса. 132 | function testMath(a) { 133 | return Math.sin((a*Math.PI)/180) 134 | } 135 | 136 | // 18. Вычислить и вернуть из функции площадь треугольника. Передаваемые в функцию аргументы "a" и "b" - это длины сторон, а "c" - это угол между ними в градусах. 137 | function testMath(a, b, c) { 138 | c = ((c*Math.PI)/180) 139 | return (1/2*a*b*Math.sin(c)) 140 | } 141 | 142 | // 19. Вычислить результат деления большего из этих чисел на меньшее, и округлив до ближайшего меньшего целого вернуть из функции. 143 | function testMath(a, b, c, d) { 144 | m = Math.max(a, b, c, d) 145 | n = Math.min(a, b, c, d) 146 | return Math.floor(m/n) 147 | } 148 | 149 | // 20. В функцию передаются два параметра: целочисленная переменная ("а") и некоторая функция ("func"). Необходимо запустить функцию "func", с переменной "а" в качестве аргумента. нужно возвратить имя возникающей ошибки. 150 | function testErrorFunc(a, func) { 151 | try { 152 | func(a) 153 | } 154 | catch (e) { 155 | return e.name; 156 | } 157 | } 158 | 159 | // 21. В этом задании в нашу функцию testRegExp первым параметром передается случайная строка(переменная s), а вторым - случайная подстрока(переменная sub_s), которую нужно использовать 160 | // в качестве шаблона регулярного выражения. Вам нужно вернуть из функции строку, в которой будут перечислены через запятую все совпадения шаблона с первой строкой. 161 | function testRegExp(s, sub_s) { 162 | var m = new RegExp(sub_s, 'g') 163 | x = s.match(m); 164 | return x.join(); 165 | } 166 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | In this repo I publish the code created during the study of practice JavaScript. 2 | 3 | `js_hw_1.js`, `js_hw_2.js`, `js_hw_3.html`, `js_hw_3.js`, `js_hw_4.js` - домашняя работа с курса Вадима Ксендзова. 4 | 5 | `JavaScriptForBeginners.js` - практика с сайта Stepik, курс [JavaScript для начинающих](https://stepik.org/course/2223/promo#toc). 6 | -------------------------------------------------------------------------------- /cards/app.js: -------------------------------------------------------------------------------- 1 | const slides = document.querySelectorAll('.slide') 2 | 3 | for (const slide of slides) { 4 | slide.addEventListener('click', () => { 5 | clearActiveClasses() 6 | slide.classList.add('active') 7 | }) 8 | } 9 | 10 | function clearActiveClasses() { 11 | slides.forEach((slide) => { 12 | slide.classList.remove('active') 13 | }) 14 | } 15 | -------------------------------------------------------------------------------- /cards/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Cards | Project 1 8 | 9 | 10 | 11 |
15 |

Macbook

16 |
17 |
21 |

Keyboard

22 |
23 |
27 |

Desktop

28 |
29 |
33 |

Workplace

34 |
35 |
39 |

Keyboard

40 |
41 |
45 |

Workplace

46 |
47 | 48 | 49 | 50 | 51 | 52 | 53 | 54 | 55 | 56 | -------------------------------------------------------------------------------- /cards/stiles.css: -------------------------------------------------------------------------------- 1 | @import url('https://fonts.google.com/share?selection.family=Poppins:wght@200'); 2 | 3 | * { 4 | box-sizing: border-box; 5 | } 6 | 7 | body { 8 | font-family: 'Muli', sans-serif; 9 | overflow: hidden; 10 | margin: 0; 11 | background: #111; 12 | height: 100vh; 13 | display: flex; 14 | justify-content: center; 15 | align-items: center; 16 | } 17 | 18 | .container { 19 | width: 100%; 20 | display: flex; 21 | padding: 0 20px; 22 | } 23 | 24 | .slide { 25 | height: 80vh; 26 | border-radius: 20px; 27 | margin: 10px; 28 | cursor: pointer; 29 | color: #fff; 30 | flex: 1; 31 | background-size: cover; 32 | background-position: center; 33 | background-repeat: no-repeat; 34 | transition: all 500ms ease-in-out; 35 | } 36 | 37 | .slide h3 { 38 | position: relative; 39 | font-size: 42px; 40 | bottom: -40px; 41 | left: 40px; 42 | margin: 0; 43 | opacity: 0; 44 | } 45 | 46 | .slide.active { 47 | flex: 10; 48 | } 49 | 50 | .slide.active h3 { 51 | opacity: 1; 52 | transition: opacity 0.3s ease-in 0.4s; 53 | } -------------------------------------------------------------------------------- /js_hw_1.js: -------------------------------------------------------------------------------- 1 | //1. Создать переменную “item_1” 2 | let item_1 3 | 4 | //2. Присвоить переменной item_1 цифру 5. 5 | item_1 = 5 6 | 7 | //3. Вывести в консоль item_1. 8 | console.log(item_1) 9 | 10 | //4. Создать переменную “item_2” 11 | let item_2 12 | 13 | //5. Присвоить переменной item_2 цифру 3. 14 | item_2 = 3 15 | 16 | //6. Вывести в консоль item_2. 17 | console.log(item_2) 18 | 19 | //7. Создать переменную “item_3” 20 | let item_3 21 | 22 | //8. Присвоить переменной item_3 сложение item_1 и item_2. 23 | item_3 = item_1 + item_2 24 | 25 | //9. Вывести в консоль item_3. 26 | console.log(item_3) 27 | 28 | //10. Создать переменную “item_4” 29 | let item_4 30 | 31 | //11. Присвоить переменной item_4 строку “Yolochka” 32 | item_4 = "Yolochka" 33 | 34 | //12. Вывести в консоль item_4. 35 | console.log(item_4) 36 | 37 | //13. Вывести в консоль сложение item_3 и item_4. 38 | console.log(item_3 + item_4) 39 | 40 | //14. Вывести в консоль умножение item_3 и item_4. 41 | console.log(item_3 * item_4) 42 | 43 | //15. Создать переменную “item_5” 44 | let item_5 45 | 46 | //16. Присвоить переменной item_5 переменную item_3 47 | item_5 = item_3 48 | 49 | //17. Создать переменную item_6. 50 | let item_6 51 | 52 | //18. Создать переменную item_6_type 53 | let item_6_type 54 | 55 | //19. Присвоить переменной item_6 значение 15 56 | item_6 = 15 57 | 58 | //20. Присвоить переменной item_6_type тип переменной item_6 59 | item_6_type = typeof item_6 60 | 61 | //21. Вывести в консоль тип данных item_6 в виде —— “item_6 == ” item_6, “item_6_type == ” item_6_type —— 62 | console.log ('item_6 == ' + item_6 + ' item_6_type == ' + item_6_type) 63 | 64 | //22. Создать переменную item_7 и в ней преобразовать item_6 в String. 65 | let item_7= String(item_6) 66 | 67 | //23. Создать переменную item_7_type 68 | let item_7_type 69 | 70 | //24. Присвоить переменной item_7_type тип переменной item_7 71 | item_7_type = typeof item_7 72 | 73 | //25. Вывести в консоль тип данных item_7 в виде —— “item_7 == ” item_7, “item_7_type == ” item_7_type —— 74 | console.log ('item_7 == ' + item_7 + ' item_7_type == ' + item_7_type) 75 | 76 | //26. Создать переменную “age_1” и присвоить ей значение 10 77 | let age_1 = 10 78 | 79 | //27. Создать переменную “age_2” и присвоить ей значение 18 80 | let age_2 = 18 81 | 82 | //28. Создать переменную “age_3” и присвоить ей значение 60 83 | let age_3 = 60 84 | 85 | //29. Создать if в котором будите проверять значение переменной age_1 86 | if (typeof(age_1) == "number") { 87 | 88 | //30. Если age_1 < age_2, вывести в консоль “You don’t have access cause your age is ” + age_1 + “ It’s less then ” 89 | if (age_1 < age_2) { 90 | console.log ("You don’t have access cause your age is " + age_1 + " It’s less then ") 91 | } 92 | 93 | //31. Если age_1 >= age_2 и age_1 < age_3, вывести в консоль “Welcome !” 94 | else if (age_1 >= age_2 && age_1 < age_3) { 95 | console.log ("Welcome !") 96 | } 97 | 98 | //32. Если age_1 > age_3, вывести в консоль “Keep calm and look Culture channel”. 99 | else if (age_1 > age_3) { 100 | console.log ("Keep calm and look Culture channel") 101 | } 102 | 103 | //33. Иначе выводите “Technical work”. 104 | else { 105 | console.log("Technical work") 106 | } 107 | } 108 | -------------------------------------------------------------------------------- /js_hw_2.js: -------------------------------------------------------------------------------- 1 | // HW_1* 2 | 3 | // 1*: Преобразовать написанный код в 26-33 пунктах в функцию, принимающую на вход возраст. 4 | // Вывести в консоль результат работы функции с возрастами 17, 18, 61 5 | const age_1 = 10; 6 | const age_2 = 18; 7 | const age_3 = 60; 8 | 9 | const checkAge = function(age) { 10 | if (age < age_2) { 11 | console.log("You don't heve access cause your age is " + age + " . It's less then " + age_2) 12 | } else if (age >= age_2 && age < age_3) { 13 | console.log("Welcom!") 14 | } else if(age > age_3) { 15 | console.log("Keep calm and look Culture channel") 16 | } else { 17 | console.log("Technical work") 18 | } 19 | } 20 | 21 | checkAge(17) 22 | checkAge(18) 23 | checkAge(61) 24 | 25 | // 2*: Преобразовать задание 1* таким образом, чтобы первым делом в функции проверялся тип данных. И если он не Number - кидалась ошибка. 26 | const checkAge_2 = function(age) { 27 | if(typeof age == "number") { 28 | 29 | if (age < age_2) { 30 | console.log("You don't heve access cause your age is " + age + " . It's less then " + age_2) 31 | } else if (age >= age_2 && age < age_3) { 32 | console.log("Welcom!") 33 | } else if(age > age_3) { 34 | console.log("Keep calm and look Culture channel") 35 | } else { 36 | console.log("Technical work") 37 | } 38 | } else { console.log ("Not integer value")} 39 | } 40 | 41 | checkAge_2(17) 42 | checkAge_2('adfasdg') 43 | 44 | // 3**: Преобразовать 2* таким образом, чтобы значение '2' (строка в которой лежит ТОЛЬКО ЦИФРА) пропускалось, преобразовываясь в number 45 | const checkAge_3 = function(age) { 46 | 47 | age = Number(age) 48 | 49 | if(!isNaN(age_2)) { 50 | 51 | if (age < age_2) { 52 | console.log("You don't heve access cause your age is " + age + " . It's less then " + age_2) 53 | } else if (age >= age_2 && age < age_3) { 54 | console.log("Welcom!") 55 | } else if(age > age_3) { 56 | console.log("Keep calm and look Culture channel") 57 | } else { 58 | console.log("Technical work") 59 | } 60 | } else { console.log ("Not integer value")} 61 | } 62 | checkAge_3(17) 63 | checkAge_3('adfasdg') 64 | checkAge_3('27adfasdg') 65 | -------------------------------------------------------------------------------- /js_hw_3.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | -------------------------------------------------------------------------------- /js_hw_3.js: -------------------------------------------------------------------------------- 1 | // 4***: 2 | // Преобразовать задание 3* таким образом, чтобы возраст вводится используя функцию prompt в привязанной верстке 3 | 4 | const age_1 = 10; 5 | const age_2 = 18; 6 | const age_3 = 60; 7 | 8 | const checkAge = function(age) { 9 | age = Number(age) 10 | if(!isNaN(age)) { 11 | if (age < age_2){ 12 | console.log("You don't have access cause your age is " + age + " It's less then " + age_2) 13 | } else if(age >= age_2 && age < age_3) { 14 | console.log("Welcome !") 15 | } else if(age > age_3) { 16 | console.log("Keep calm and look Culture channel") 17 | } 18 | } else { console.log("Not integer value")} 19 | } 20 | checkAge(17) 21 | checkAge('adfasdg') 22 | checkAge('27adfasdg') 23 | 24 | let agePrompt = prompt("Enter age") 25 | checkAge(agePrompt) 26 | -------------------------------------------------------------------------------- /js_hw_4.js: -------------------------------------------------------------------------------- 1 | // 1. Написать скрипт, который сосчитает и выведет результат от возведения 2 в степень 10, начиная со степени 1 2 | 3 | let n = 2 4 | 5 | for(let a = 1; a <= 10; a++){ 6 | let b = n**a 7 | console.log(b) 8 | } 9 | 10 | // 2. Преобразовать 1 задачу в функцию, принимающую на вход степень, в которую будет возводиться число 2 11 | 12 | const vozv = function(step) { 13 | console.log(n**step) 14 | } 15 | 16 | vozv(8) 17 | 18 | // 3. Написать скрипт, который выведет 5 строк в консоль таким образом, чтобы в первой строчке выводилось :), во второй :):) и так далее 19 | // Пример в консоли: 20 | // :) 21 | // :):) 22 | // :):):) 23 | // :):):):) 24 | // :):):):):) 25 | 26 | let smile = ':)' 27 | let x = '' 28 | 29 | for(i = 0; i < 5; i++) { 30 | x = x + smile 31 | console.log(x) 32 | } 33 | 34 | // 4. Преобразовать 2 задачу в функцию, принимающую на вход строку, которая и будет выводиться в консоль (как в условии смайлик), а также количество строк для вывода 35 | // e.g. function printSmile(stroka, numberOfRows) 36 | 37 | const printSmile = function(stroka, numberOfRows) { 38 | let x = '' 39 | for(i = 0; i < numberOfRows; i++) { 40 | x = x + stroka 41 | console.log(x) 42 | } 43 | } 44 | 45 | printSmile('@', 34) 46 | 47 | // 5. Написать функцию, которая принимает на вход слово. Задача функции посчитать и вывести в консоль, сколько в слове гласных, и сколько согласных букв. 48 | // e.g. function getWordStructure(word) 49 | // В консоли: 50 | // Слово (word) состоит из (число) гласных и (число) согласных букв 51 | 52 | function getWordStructure(str) { 53 | str = str.toLowerCase(); 54 | let vowels = "aeiouy"; 55 | let consonants = "bdmnmymygmgtygrrhrhgvwqu"; 56 | 57 | let vowelCount = 0 58 | let consonantCount = 0 59 | 60 | for (let i = 0; i < str.length; i++) { 61 | let currentLetter = str[i]; 62 | if (vowels.includes(currentLetter)) { 63 | vowelCount++ 64 | } 65 | else if (consonants.includes(currentLetter)) { 66 | consonantCount++ 67 | } 68 | } 69 | console.log(`Слово ${str} состоит из ${vowelCount} гласных и ${consonantCount} согласных букв`) 70 | } 71 | 72 | getWordStructure("Hello man! How are you?") 73 | 74 | // 6. Написать функцию, которая проверяет, является ли слово палиндромом 75 | // e.g. function isPalindrom(word) 76 | 77 | function isPalindrom(str){ 78 | str = str.toLowerCase(); 79 | let len = Math.floor(str.length / 2) 80 | for(let i = 0; i < len; i++ ){ 81 | 82 | let front = str[i] 83 | let bottom = str[str.length - i - 1] 84 | if(front !== bottom){ 85 | console.log(`${str} не полиндром`) 86 | return false 87 | } 88 | } 89 | console.log(`${str} полиндром`) 90 | return true 91 | } 92 | 93 | isPalindrom('Abba') 94 | --------------------------------------------------------------------------------