index.js 4.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158
  1. // Предварительная подготовка:
  2. // Создать файл с данными в формате JSON
  3. // Это должен быть массив объектов с двумя свойствами: title и ref
  4. // title - название картинки
  5. // ref - ссылка на картинку
  6. // Задание:
  7. // Загрузить данные из JSON-файла
  8. // Распарсить данные в массив
  9. // Вывести на страницу картинки и подписи к ним
  10. var req = new XMLHttpRequest();
  11. req.responseType = 'json';
  12. req.open('GET', 'one.json', true);
  13. req.onload = function() {
  14. var jsonResponse = req.response;
  15. jsonResponse.forEach(element => {
  16. let img = document.body.appendChild(document.createElement('img'));
  17. img.style.width = 600;
  18. img.src = element.ref;
  19. //element.style.width = 600;
  20. document.body.appendChild(document.createElement('p')).innerText = element.title;
  21. });
  22. };
  23. req.send(null);
  24. // Вариант с fetch
  25. fetch('two.json')
  26. .then(response => response.json())
  27. .then(jsonResponse => jsonResponse.forEach(element => {
  28. document.body.appendChild(document.createElement('img')).src = element.ref;
  29. document.body.appendChild(document.createElement('p')).innerText = element.title;
  30. }));
  31. // Исходные данные
  32. // var messages = [
  33. // "backspace",
  34. // "enter",
  35. // "shift",
  36. // "control",
  37. // "delete",
  38. // "space",
  39. // "subtract"
  40. // ]
  41. // messages.getKey = () => {
  42. // var key = new Date().toLocaleString().split(", ")[1]
  43. // return log [ key ] ? log [ key + "[2]" ] ? key + "[3]" : key + "[2]" : key
  44. // }
  45. // var log = {}
  46. // sendMessage
  47. // var sendMessage = message => new Promise (
  48. // resolve => setTimeout (
  49. // () => resolve ( message ),
  50. // Math.random () * 7000
  51. // )
  52. // )
  53. // Задача: напилить код, который вызывает функцию sendMessage для каждого элемента массива messages и логирует полученные сообщения в объекте log следующим образом:
  54. // log
  55. // {
  56. // 22:25:57: "backspace"
  57. // 22:25:58: "shift"
  58. // 22:25:59: "subtract"
  59. // 22:25:59[2]: "enter"
  60. // 22:25:59[3]: "delete"
  61. // 22:26:01: "control"
  62. // 22:26:01[2]: "space"
  63. // }
  64. var messages = [
  65. "backspace",
  66. "enter",
  67. "shift",
  68. "control",
  69. "delete",
  70. "space",
  71. "subtract"
  72. ]
  73. messages.getKey = () => {
  74. let key = new Date().toLocaleTimeString(), x = 0
  75. while (log [`${key}[${x}]` ]) { x++ }
  76. return `${key}[${x}]`
  77. }
  78. var log = {}
  79. var sendMessage = message => new Promise (
  80. resolve => setTimeout (
  81. () => resolve ( message ),
  82. Math.random () * 7000
  83. )
  84. );
  85. messages.forEach (
  86. ( message, index, arr ) => sendMessage ( message )
  87. .then (
  88. mess => Object.assign ( log,
  89. { [ arr.getKey() ] : message }
  90. ),
  91. console.log(message)
  92. )
  93. );
  94. // Изменим условие предыдущего задания
  95. // Массив messages, объект log и функция sendMessage остаются теми же
  96. // Немного изменится метод getKey:
  97. // messages.getKey = () => new Date().toLocaleString().split(", ")[1]
  98. // Нужно напилить код рекурсивной функции recursive, которая вызывает sendMessage поочередно с каждым элементом массива messages, но только после того, как предыдущий месседж будет залогирован в объекте log
  99. var messages = [
  100. "backspace",
  101. "enter",
  102. "shift",
  103. "control",
  104. "delete",
  105. "space",
  106. "subtract"
  107. ]
  108. messages.getKey = () => new Date().toLocaleTimeString()
  109. var log = {}
  110. var sendMessage = message => new Promise (
  111. resolve => setTimeout (
  112. () => resolve ( message ),
  113. Math.random () * 7000
  114. )
  115. );
  116. var sendAll = () => {
  117. var index = 0
  118. function recursive () {
  119. }
  120. recursive ()
  121. }
  122. sendAll()