App.js 9.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317
  1. // 3 persons
  2. // Сделать три ассоциативных массива a, b, c, в каждом из которых должны быть поля name и surname.
  3. var a = {
  4. name: 'Vasya',
  5. surname: 'Pupkin'
  6. }
  7. var b = {
  8. name: 'Sanya',
  9. surname: 'Beliy'
  10. }
  11. var c = {
  12. name: 'Petro',
  13. surname: 'Poroshenko'
  14. }
  15. // different fields
  16. // Добавьте некоторые другие поля (например age, fathername, sex (пол))
  17. // так, что бы набор полей отличался у разных объектов
  18. a.age = '18';
  19. b.fathername = 'Mikhailovich';
  20. c.sex = 'Male';
  21. // fields check
  22. // Проверьте наличие необязательных полей у каждого из этих массивов.
  23. // Если поле найдено, выведите его с помощью alert.
  24. // Проверку делайте по typeof или in в if.
  25. if ("fathername" in a) {
  26. alert(a.fathername + ' in a');
  27. }
  28. else {
  29. if ("fathername" in b) {
  30. alert(b.fathername + ' in b');
  31. }
  32. else {
  33. if ("fathername" in c) {
  34. alert(c.fathername + ' in c');
  35. }
  36. }
  37. }
  38. // array of persons
  39. // Добавьте несколько ассоциативных массивов с персонами в обычный массив persons, например a,b,c.
  40. // Так же добавьте персону литерально ({...}).
  41. // Получится обычный массив с элементами-ассоциативными массивами с персонами.
  42. var persons = [];
  43. persons.push(a);
  44. persons.push(b);
  45. persons.push(c);
  46. var d = {
  47. name: 'Kyril',
  48. surname: 'NeKyril'
  49. };
  50. persons[3] = d;
  51. console.log(persons);
  52. // loop of persons
  53. // Сделайте цикл, который выводит весь массив persons в форме объектов console.log(persons[i])
  54. for (let i = 0; i < persons.length; i++) {
  55. console.log(persons[i]);
  56. }
  57. // loop of name and surname
  58. // Сделайте цикл, который выводит весь массив persons, но только Имя и Фамилию каждой персоны.
  59. for (let i = 0; i < persons.length; i++) {
  60. console.log(persons[i].name + ' ' + persons[i].surname);
  61. }
  62. // loop of loop of values
  63. // Сделайте цикл, который выводит весь массив persons, но только значения всех полей из объектов.
  64. // Используйте вложенный цикл
  65. for (let i = 0; i < persons.length; i++) {
  66. console.log(Object.values(persons[i]));
  67. }
  68. // fullName
  69. // Сделайте цикл, которых добавляет поле fullName в каждый объект, содержащий ФИО.
  70. // Учтите, что поле fathername не является обязательным.
  71. for (let i = 0; i < persons.length; i++) {
  72. if ('fathername' in persons[i]) {
  73. persons[i].fullName = persons[i].surname + ' ' + persons[i].name + ' ' + persons[i].fathername;
  74. console.log(persons[i].fullName);
  75. }
  76. else {
  77. persons[i].fullName = persons[i].surname + ' ' + persons[i].name;
  78. console.log(persons[i].fullName);
  79. }
  80. }
  81. // serialize
  82. // Создайте JSON-строку из persons
  83. var pers = JSON.stringify(persons);
  84. console.log(pers);
  85. // deserialize
  86. // Создайте ассоциативный массив с одной персоной из JSON-строки. Добавьте её в persons
  87. var persona = JSON.parse('{"name":"Vasya","surname":"Pupkin","age":"18","fullName":"Pupkin Vasya"}');
  88. console.log(persona);
  89. persons.push(persona);
  90. console.log(persons);
  91. // HTML
  92. // Сделайте цикл, который выводит весь массив persons, в форме HTML-таблицы. Имя и Фамилия - колонки.
  93. // Пример кода:
  94. // var str = "<table border='1'>"
  95. // for (let i=0;i<1;i++){
  96. // str += `<tr><td>${i}</td><td>адын</td></tr>`
  97. // }
  98. // str += "</table>"
  99. // console.log(str)
  100. // document.write(str)
  101. // Модифицируйте код так, что бы он выводил массив persons
  102. var str = "<table border='1'>";
  103. var counter = 1;
  104. for (let i = 0; i < persons.length; i++) {
  105. str += `<tr><td>${counter}</td><td>${Object.values(persons[i])}</td></tr>`;
  106. counter++;
  107. }
  108. str += "</table>";
  109. str += "</br>"
  110. document.write(str);
  111. // HTML optional fields
  112. // Сделайте цикл, который выводит весь массив persons, в форме HTML-таблицы.
  113. // Имя и Фамилия, а так же другие поля при наличии. Колонки: поля, строки таблицы - персоны.
  114. var table = "<table border='1'>";
  115. var counter = 1;
  116. for (let i = 0; i < persons.length; i++) {
  117. table += `<tr><td>${counter}</td>`;
  118. for (var key in persons[i]) {
  119. table += `<td>${(persons[i])[key]}</td>`;
  120. }
  121. table += `</tr>`
  122. counter++;
  123. }
  124. table += "</table>";
  125. table += "</br>";
  126. document.write(table);
  127. // HTML tr color
  128. // Добавьте к предыдущему примеру раскраску через строчку используя другой стиль тэга tr.
  129. var table = "<table border='1'>";
  130. var counter = 1;
  131. for (let i = 0; i < persons.length; i++) {
  132. table += `<tr style="background-color: gray"><td>${counter}</td>`;
  133. for (var key in persons[i]) {
  134. table += `<td>${(persons[i])[key]}</td>`;
  135. }
  136. table += `</tr>`
  137. counter++;
  138. }
  139. table += "</table>";
  140. table += "</br>";
  141. document.write(table);
  142. // HTML th optional
  143. // Переработайте вывод persons в HTML с поиском всех возможных колонок во всех записях,
  144. // выводом названий колонок в заголовок HTML-таблицы.
  145. // Для решения этой задачи вначале узнайте множество полей (ключей) во всех записях (они не совпадают),
  146. // выведите HTML-заголовок используя тэги <th>, а потом выводите все записи.
  147. // Ниже выведите все персоны построчно. Следите за корректностью колонок.
  148. // Для этого вам нужно итерировать общий набор колонок, а не каждую персону,
  149. // колонки из которой могут отличаться от предыдущей.
  150. var table = "<table border='1'>";
  151. var counter = 1;
  152. for (let i = 0; i < persons.length; i++) {
  153. table += `<tr><td>${counter}</td>`;
  154. for (var key in persons[i]) {
  155. table += `<td>${(persons[i])[key]}</td>`;
  156. }
  157. table += `</tr>`
  158. counter++;
  159. }
  160. table += "</table>";
  161. table += "</br>";
  162. document.write(table);
  163. // -----------------------------------------------------------------
  164. var table = "<table border='1'>";
  165. var counter = 1;
  166. for (var key in persons[i]) {
  167. }
  168. for (let i = 0; i < persons.length; i++) {
  169. table += `<tr><td>${counter}</td>`;
  170. if ('name' in persons[i]) {
  171. table += `<td>${(persons[i])['name']}</td>`;
  172. }
  173. else {
  174. table += `<td>-</td>`;
  175. }
  176. if ('surname' in persons[i]) {
  177. table += `<td>${(persons[i])['surname']}</td>`;
  178. }
  179. else {
  180. table += `<td>-</td>`;
  181. }
  182. if ('fathername' in persons[i]) {
  183. table += `<td>${(persons[i])['fathername']}</td>`;
  184. }
  185. else {
  186. table += `<td>-</td>`;
  187. }
  188. if ('fullName' in persons[i]) {
  189. table += `<td>${(persons[i])['fullName']}</td>`;
  190. }
  191. else {
  192. table += `<td>-</td>`;
  193. }
  194. if ('age' in persons[i]) {
  195. table += `<td>${(persons[i])['age']}</td>`;
  196. }
  197. else {
  198. table += `<td>-</td>`;
  199. }
  200. if ('sex' in persons[i]) {
  201. table += `<td>${(persons[i])['sex']}</td>`;
  202. }
  203. else {
  204. table += `<td>-</td>`;
  205. }
  206. table += `</tr>`
  207. counter++;
  208. }
  209. table += "</table>";
  210. table += "</br>";
  211. document.write(table);
  212. // destruct array
  213. // напишите код, который используя деструктуризацию положит:
  214. // * четные числа в переменные even1, even2,
  215. // * нечетные в odd1, odd2, odd3,
  216. // * буквы в отдельный массив
  217. var arr = [1, 2, 3, 4, 5, "a", "b", "c"];
  218. var [, even1, , even2] = arr;
  219. var [odd1, , odd2, , odd3] = arr;
  220. var [, , , , , ...chars] = arr;
  221. // destruct string
  222. // Напишите код, который используя деструктуризацию положит:
  223. // * число в переменную number
  224. // * букву a в переменную s1
  225. // * букву b в переменную s2
  226. // * букву c в переменную s3
  227. var arr = [1, "abc"];
  228. var [number] = arr;
  229. var s1 = arr[1][0];
  230. var s2 = arr[1][1];
  231. var s3 = arr[1][2];
  232. // destruct 2
  233. // извлеките используя деструктуризацию имена детей в переменные name1 и name2
  234. var obj = {
  235. name: 'Ivan',
  236. surname: 'Petrov',
  237. children: [{ name: 'Maria' }, { name: 'Nikolay' }]
  238. }
  239. var name1 = obj['children'][0]['name'];
  240. var name2 = obj['children'][1]['name'];
  241. // destruct 3
  242. // извлеките используя деструктуризацию объектов два первых элемента и длину массива в переменные a, b и length
  243. var arr = [1, 2, 3, 4, 5, 6, 7, 10]
  244. var [a] = arr;
  245. var [, b] = arr;
  246. var length = arr.length;