//fetch basic /* { function jsonInTable (parent, data){ let table = document.createElement('table') table.border = "1px" for(key in data){ let tr = document.createElement('tr') table.append(tr) let td = document.createElement('td') tr.append(td) td.innerText = [key] let td2 = document.createElement('td') tr.append(td2) td2.innerText = data[key] } parent.append(table) } fetch('https://swapi.dev/api/people/1/') .then(res => res.json()) .then( data => jsonInTable(content, data)) } //fetch improved { { function jsonInTable (parent, data){ let table = document.createElement('table') table.border = "1px" for(let key in data){ let tr = document.createElement('tr') table.append(tr) let td = document.createElement('td') tr.append(td) td.innerText = [key] let td2 = document.createElement('td') tr.append(td2) td2.innerText = data[key] function buton(url) { let button = document.createElement('button') button.innerText = 'text' button.onclick = () => { fetch(url) .then(res=>res.json()) .then(info => jsonInTable(content, info)) } td2.append(button) } if(Array.isArray(data[key])){ for(elemOfArr of data[key]){ if(elemOfArr.startsWith("https://swapi.dev") ){ buton(elemOfArr) } } } if(typeof(data[key]) === "string" && data[key].indexOf("https://swapi.dev") !== -1 ){ buton(data[key]) } } parent.append(table) } fetch('https://swapi.dev/api/people/1/') .then(res => res.json()) .then( data => jsonInTable(content, data)) } } // Promise.race { function delay(ms){ //промисифицированная функция для создания промиса, который резолвится через определенное время //функция-исполнитель, принимает два параметра - функции для передачи промису результата работы function executor(fulfill,reject){ //reject объявлен для вида. setTimeout(() => fulfill(ms), ms) //setTimeout запустит функцию, которая запустит fulfill через ms миллисекунд. Результатом промиса будет время задержки } //возврщаем новый промис, передав в него executor. Промис тут же его запускает, передав в него колбэки для управления состоянием return new Promise(executor) } const p1 = delay(Math.random()*1000).then(result => "DelayFetch") const p2 = fetch('https://swapi.dev/api/people/1/') .then(result => 'Myfetch') let date = new Date() Promise.race([p1,p2]).then(value => console.log(value , new Date() - date)) } //Promisify: confirm { function confirmPromise(text){ function executor (fulfill,reject){ if(confirm(text)){ fulfill() } else { reject() } } return new Promise(executor) } confirmPromise('Промисы это сложно?').then(() => console.log('не так уже и сложно'), () => console.log('respect за усидчивость и внимательность')) } */ //Promisify: prompt { function promptPromise(text){ function executor (fulfill,reject){ let answer = prompt(text) if(answer){ fulfill(answer) } else { reject() } } return new Promise(executor) } promptPromise("Как тебя зовут?").then(name => console.log(`Тебя зовут ${name}`), () => console.log('Ну зачем морозиться, нормально же общались')) }