홈 탐색 도움말
로그인
olga_pushkar
/
javascript
Watch 1
Star 0
포크 0
파일 이슈 0 풀 리퀘스트 0 위키
소스 검색

add 10

Olga1108 4 년 전
부모
f5d258df8f
커밋
66df147750
4개의 변경된 파일과 233개의 추가작업 그리고 0개의 파일을 삭제
통합 보기 변경상태 보기
  1. 12 0
      js10.1-10.2/index.html
  2. 124 0
      js10.1-10.2/index.js
  3. 12 0
      js10.3/index.html
  4. 85 0
      js10.3/index.js

+ 12 - 0
js10.1-10.2/index.html
파일 보기 

@@ -0,0 +1,12 @@
 
+!DOCTYPE html>
 
+<html lang='en'>
 
+    <head>
 
+        <meta charset='UTF-8' />
 
+        <meta name='viewport' content='width=device-width, initial-scale=1.0' />
 
+        <title>Home Work 10 JS</title>
 
+    </head>
 
+    <body>
 
+        <h1>Home Work 10</h1>
 
+        <script src='index.js'></script>    
+    </body>
 
+</html>

+ 124 - 0
js10.1-10.2/index.js
파일 보기 

@@ -0,0 +1,124 @@
 
+                                          // Required
 
+// Логирование поступающих сообщений в объекте log
 
+// Задан массив сообщений и пустой объект log:
 
+
 
+// let messages = [
 
+//     "backspace",
 
+//     "enter",
 
+//     "shift",
 
+//     "control",
 
+//     "delete",
 
+//     "space",
 
+//     "subtract"
 
+// ]
 
+
 
+// var log = {}
 
+// Далее, есть функция, отправляющая сообщения в случайном порядке в случайное время:
 
+
 
+// var sendMessage = ( message, callback ) => 
+//     setTimeout (
 
+//         () => callback ( message ),
 
+//         Math.random () * 7000
 
+//     )
 
+// Обратите внимание, что эта функция получает при вызове не только текст сообщения, но и колбэк-функцию, которой нужно передать это сообщение
 
+
 
+// С помощью кода:
 
+
 
+// messages.forEach (
 
+//     message => sendMessage ( message, handler )
 
+// )
 
+// инициируем отправку сообщений
 
+
 
+// Ваша задача - напилить код функции handler,
 
+// которая получает сообщение и заносит его в объект log
 
+// в виде нового свойства,
 
+// значение которого - текст поступившего сообщения,
 
+// а ключ ( имя свойства ) - это время поступления сообщения ( в виде строки )
 
+
 
+// log
 
+// {
 
+//     19:34:08: "control"
 
+//     19:34:08[2]: "backspace"
 
+//     19:34:09: "subtract"
 
+//     19:34:09[2]: "enter"
 
+//     19:34:11: "delete"
 
+//     19:34:11[2]: "shift"
 
+// }
 
+// В помощь вам уже есть функция, которая формирует ключ очередного сообщения:
 
+
 
+// getKey = () => {
 
+//     let key = new Date().toLocaleTimeString(), x = 0
 
+//     while ( log [ `${key}[${x}]` ] ) { x++ }
 
+//     return `${key}[${x}]`
 
+// }
 
+// На случай, если два сообщения поступят одновременно, функция getKey добавляет "[0]", "[1]", "[2]"... к значению ключа ( иначе значения ключей 
+//     могут дублироваться, что приведет к генерации исключения )
 
+(function() {
 
+    let messages = [
 
+        "backspace",
 
+        "enter",
 
+        "shift",
 
+        "control",
 
+        "delete",
 
+        "space",
 
+        "subtract"
 
+    ]
 
+    
+    var log = {}
 
+    var sendMessage = ( message, callback ) => 
+        setTimeout (
 
+            () => callback ( message ),
 
+            Math.random () * 7000
 
+        )
 
+    
+    const getKey = () => {
 
+        let key = new Date().toLocaleTimeString(), x = 0
 
+        while ( log [ `${key}[${x}]` ] ) { x++ }
 
+        return `${key}[${x}]`
 
+    };
 
+    const handler = (message) => 
+    log[getKey()] = message;        
+    
+    messages.forEach (
 
+    message => sendMessage ( message, handler )
 
+    );
 
+    setTimeout(() => {console.log(log)}, 3000)
 
+}) ()
 
+
 
+
 
+                                                // Additionally 
+// Допилите код конструктора User, дополнив его акцессорами приватного свойства presence так, чтобы после выполнения скрипта:
 
+
 
+// function User ( name ) {
 
+//     this.name = name
 
+//     var presence = false
 
+//     ...
 
+// }
 
+
 
+// let user = new User ( "Ivan" )
 
+// console.info ( user.presence )
 
+// в консоли было:
 
+
 
+// "Ivan is absent"
 
+// а после выполнения кода:
 
+
 
+// user.presence = "+"
 
+// console.info ( user.presence )
 
+// в консоли было:
 
+
 
+// "Ivan is present"
 
+function User ( name ) {
 
+    this.name = name
 
+    var presence = false
 
+    
+    Object.defineProperty(this, "presence", {
 
+        get: () => presence === false ? `${name} is absent` : `${name} is present`,
 
+
 
+        set: val => presence = val  
+    })
 
+}
 
+let user = new User ( "Ivan" )
 
+console.info ( user.presence )
 
+
 
+user.presence = "+"
 
+console.info ( user.presence )

+ 12 - 0
js10.3/index.html
파일 보기 

@@ -0,0 +1,12 @@
 
+!DOCTYPE html>
 
+<html lang='en'>
 
+    <head>
 
+        <meta charset='UTF-8' />
 
+        <meta name='viewport' content='width=device-width, initial-scale=1.0' />
 
+        <title>Home Work 10 JS</title>
 
+    </head>
 
+    <body>
 
+        <h1>Home Work 10</h1>
 
+        <script src='index.js'></script>    
+    </body>
 
+</html>

+ 85 - 0
js10.3/index.js
파일 보기 

@@ -0,0 +1,85 @@
 
+// Additionally  Task 10.3
 
+// Объявить функцию-конструктор User
 
+// Конструктор должен принимать аргументы, описывающие юзера
 
+
 
+var User = function ( name = "user",
 
+                      email = "user@sample.com",
 
+                      photo = User.getAvatar() ) {
 
+        this.name = name
 
+        this.email = email
 
+        this.photoURL = photo
 
+        this.info = ''
 
+}
 
+User.admin = {
 
+        photoURL: "https://i.pinimg.com/originals/3d/47/4f/3d474f82ff71595e8081f9a120892ae8.gif",
 
+        name: "admin"
 
+}
 
+User.getAvatar = function () {
 
+     return this.avatars.shift ()
 
+}
 
+User.avatars = [
 
+     "https://pre00.deviantart.net/50f9/th/pre/i/2011/217/e/8/pikachu_2_by_nostalgiaattack-d45jd3i.png",
 
+     "https://cdn.diversityavatars.com/wp-content/uploads/2018/01/Vector-Smart-Object-5.png",
 
+     "https://cdn4.iconfinder.com/data/icons/user-avatar-flat-icons/512/User_Avatar-31-512.png",
 
+     "http://icons.iconarchive.com/icons/hopstarter/face-avatars/256/Male-Face-L3-icon.png",
 
+     "https://findicons.com/files/icons/1072/face_avatars/300/i05.png",
 
+     "http://www.iconarchive.com/download/i51043/hopstarter/halloween-avatars/Gomez.ico",
 
+     "http://icons.iconarchive.com/icons/hopstarter/halloween-avatars/256/Zombie-2-icon.png",
 
+     "https://vignette.wikia.nocookie.net/yogscast/images/8/8a/Avatar_Turps_2015.jpg"
 
+]
 
+User.prototype.messageBox = ( function () {
 
+        var box = document.createElement ( 'div' )
 
+        document.body.appendChild ( box )
 
+        box.style = `
 
+                position: fixed;
 
+                bottom: 0;
 
+                right: 0;
 
+                width: 300px;
 
+                height: 200px;
 
+                overflow: auto;
 
+                border: 1px solid gray;
 
+                padding: 10px;
 
+                background-color: #000;
 
+        `
 
+        box.picture = box.appendChild ( document.createElement ( 'img' ) )
 
+        box.picture.style.width = "50px"
 
+        box.name = box.appendChild ( document.createElement ( 'span' ) )
 
+        box.name.style = "font-weight: bold; color: #9ab; padding-left:10px;"
 
+        box.message = box.appendChild ( document.createElement ( 'textarea' ) )
 
+        box.message.placeholder = "Сообщение"
 
+        box.message.oninput = function ( event ) {
 
+                event.target.parentNode.querySelector ( 'img' ).src = User.admin.photoURL
 
+                event.target.parentNode.querySelector ( 'span' ).innerHTML = User.admin.name
 
+        }
 
+        box.message.style = "width: 100%; height: 100%;"
 
+        return box
 
+})()
 
+User.prototype.write = function ( text ) {
 
+        this.messageBox.picture.src = this.photoURL
 
+        this.messageBox.name.innerHTML = this.name
 
+        this.messageBox.message.value = text
 
+}
 
+User.prototype.read = function () {
 
+        this.messageBox.picture.src = this.photoURL
 
+        this.messageBox.name.innerHTML = this.name
 
+        this.info = this.messageBox.message.value
 
+        console.log ( `${this.name} прочитал сообщение:\n${this.info}` )
 
+        this.messageBox.message.value = "OK"
 
+}
 
+
 
+var users = []
 
+users.push ( new User ( "Иван" ) )
 
+users.push ( new User ( 'Alex', "alex@gmail.com" ) )
 
+users.push ( new User ( 'Bob', "bob777@gmail.com" ) )
 
+users.push ( new User ( 'Dima', "dima888@gmail.com" ) )
 
+users.push ( new User ( 'Fima', "fima999@gmail.com" ) )
 
+
 
+var k = 1
 
+users.forEach ( 
+     function ( user ) {
 
+          setTimeout ( 
+               function () {
 
+                    user.write ( `Hello, I'm ${user.name}` )
 
+               }, 3000 * k++
 
+          )
 
+} )