Gennadysht 2 лет назад
Родитель
Сommit
fc5b2f399f

+ 9 - 12
js/17_async/hw_17_03_domEventPromise.html

@@ -16,22 +16,19 @@
 
         /*function domEventPromise1(element, eventName) {
             return
-            new Promise(
-                function (resolveFunc) {
-                    function executor(event) {
-                        element.removeEventListener(eventName, executor);
-                        resolveFunc(event);
-                        //happy hacking
+                new Promise(
+                    function (resolveFunc) {
+                        function executor(event) {
+                            element.removeEventListener(eventName, executor);
+                            resolveFunc(event);
+                            //happy hacking
+                        }
+                        element.addEventListener(eventName, executor);
                     }
-                    element.addEventListener(eventName, executor);
-                }
-            )
+                )
         }*/
         domEventPromise(knopka, 'click').then(e => console.log('event click happens', e));
     </script>
 </body>
 
 
-используя addEventListener повесить свой обработчик события на DOM element событие eventName
-по событию зарезолвить промис отдав в качестве результата объект события
-убрать обработчик с DOM-элемента, используя removeEventListener.

+ 36 - 0
js/18Rest_Graph/hw_18_01_flash.html

@@ -0,0 +1,36 @@
+<header>Flash people</header>
+
+<body>
+    <div id="red">Red</div><br>
+    <div id="yellow">Yellow</div><br>
+    <div id="green">Green</div><br>
+
+    <script>
+        const delay = ms => new Promise(ok => setTimeout(() => ok(ms), ms))
+        function domEventPromise(elem, event) {
+            return new Promise((resolve, reject) => {
+                elem.addEventListener(event, () => resolve(true))
+            })
+        }
+        async function trafficLight(...lights) {
+            let prevLight = undefined;
+            let i = 0;
+            let direction = 1;
+            while (true) {
+                let light = lights[i];
+                if (prevLight)
+                    prevLight.el.style.backgroundColor = "black";
+                light.el.style.backgroundColor = light.color;
+                prevLight = light;
+                await delay(light.delay);
+                if (i == lights.length - 1) 
+                    direction = -1;
+                else if (i == 0) 
+                    direction = 1; 
+                i += direction;
+            }
+        }
+        trafficLight({ el: red, color: "red", delay: 2000 }, { el: yellow, color: "yellow", delay: 2000 }, { el: green, color: "green", delay: 2000 });
+
+    </script>
+</body>

+ 35 - 0
js/18Rest_Graph/hw_18_02_flash_people.html

@@ -0,0 +1,35 @@
+<header>Flash people</header>
+
+<body>
+    <div id="red">Red</div><br>
+    <div id="yellow">Yellow</div><br>
+    <div id="green">Green</div><br>
+
+    <script>
+        const delay = ms => new Promise(ok => setTimeout(() => ok(ms), ms))
+        function domEventPromise(elem, event) {
+            return new Promise((resolve, reject) => {
+                elem.addEventListener(event, () => resolve(true))
+            })
+        }
+        async function trafficLight(...lights) {
+            let prevLight = undefined;
+            let i = 0;
+            let direction = 1;
+            while (true) {
+                let light = lights[i];
+                if (prevLight)
+                    prevLight.el.style.backgroundColor = "black";
+                light.el.style.backgroundColor = light.color;
+                prevLight = light;
+                await delay(light.delay);
+                if (i == lights.length - 1) 
+                    direction = -1;
+                else if (i == 0) 
+                    direction = 1; 
+                i += direction;
+            }
+        }
+        trafficLight({ el: red, color: "red", delay: 2000 }, { el: yellow, color: "yellow", delay: 1000 }, { el: green, color: "green", delay: 3000 });
+    </script>
+</body>

+ 51 - 0
js/18Rest_Graph/hw_18_03_speedtest.html

@@ -0,0 +1,51 @@
+<header>speedtest</header>
+
+<body>
+    <script>
+        const delay = ms => new Promise(ok => setTimeout(() => ok(ms), ms))
+        let duration = 0;
+        async function speedtestOne(getPromise) {
+                let startTime = new Date();
+                await getPromise();
+                let endTime = new Date();
+                return endTime - startTime;
+            }
+        async function speedtest(getPromise, count, parallel = 1) {
+            const arr = [];
+            let startTime = new Date();
+            let execCount = 0;
+            while (execCount < count) {
+                for (i = 0; i < parallel; i++) {
+                    execCount++;
+                    if (execCount > count)
+                        break;
+                    arr.push(new Promise(async () => await getPromise()));
+                    let y = 0;
+                }
+                let results = await Promise.all(arr);
+                let x = 0;
+            }
+            let endTimeParallel = new Date();
+            parallelDuration = endTimeParallel - startTime;
+            parallelSpeed = parallelDuration / count;
+            duration += parallelDuration;
+            querySpeed = 0;
+            queryDuration = 0;
+            return {
+                duration,
+                querySpeed, //средняя скорость одного запроса
+                queryDuration, //
+                parallelSpeed,
+                parallelDuration
+            }
+        }
+
+        speedtest(() => delay(10000), 10, 10).then(result => console.log(result))
+        // {duration: 10000,
+        // querySpeed: 0.001, //1 тысячная запроса за миллисекунду
+        // queryDuration: 1000, //1000 миллисекунд на один реальный запрос в среднем
+        // parallelSpeed: 0.01  // 100 запросов за 10000 миллисекунд
+        // parallelDuration: 100 // 100 запросов за 10000 миллисекунд
+        //speedtest(() => fetch('http://swapi.dev/api/people/1').then(res => res.json()), 10, 5)
+    </script>
+</body>