homework/js/js_09_conditions/index.js

// blocks
{
    let a = 10
    {
        let b = 20
        {
            let c = 30
            //a === 10, b === 20, c === 30
            
            b++
            a *= 10
        }
        {
            let c = 50
            //a === 100, b === 21, c === 50
            b += 500
        }
        {
            const a = 100500
            const d = "value"
            //a === 100500, b === 521, c === нет переменной, d === value
            {
                let a = -50
                b     = 1000
                debugger;//a === -50, b === 1000, c === нет переменной, d === value
            }
            debugger;//a === 100500, b === 1000, c === нет переменной, d === value
        }
        debugger;//a === 100, b === 1000
    }
    debugger;//a === 100
}
//Ответьте на вопросы в комментариях и сверьтесь с отладчиком. console.log специально не писал */

/* comparison if*/
{
    var age = +prompt("Сколько вам лет?", "");
    if (age < 0) {
        alert("ещё не родился");
    }
    else {
        if (age < 18) {
            alert("школьник");
        }
        else {
            if (age < 30) {
                alert("молодеж");
            }
            else {
                if (age < 45) {
                    alert("зрелость");
                }
                else {
                    if (age < 60) {
                        alert("закат");
                    }
                    else {
                        if (age >= 60) {
                            alert("как пенсия?");
                        }
                        else {
                            alert("то ли киборг, то ли KERNESS");
                        }
                    }
                }
            }
        }
    }
}
//Добавьте условие отрицательного возраста в пример выше. Расставьте недостающие (но синтаксически необязательные) фигурные скобки. Выкиньте лишнее из текущего кода

/*switch: sizes
Сделайте задание Comparison: sizes используя switch*/

//Comparison: sizes
//Сделайте перевод перевод из нашей системы размеров в американскую или любую на выбор. Используйте prompt, условия сравнения и alert.


{
    const sizeUA = prompt('введи размер верхней одежды, платья, брюк в системе UA (40, 42, 44, .., 54), а я перевду в буквенную USA');
    let result;
    switch (sizeUA) {
        case "37":
        case "38":
        case "39":
            result = "Детский размер"
            break;
        case "40":
        case "41":
            result = "S"
            break;
        case "42":
        case "43":
            result = "M"
            break;
        case "44":
        case "45":
        case "46":
            result = "L"
            break;
        case "47":
        case "48":
        case "49":
        case "50":
            result = "XL"
            break;
        case "51":
        case "52":
        case "53":
        case "54":
            result = "XXL"
            break;
    }
    alert(`ваш размер "${result}" в системе USA`)
}

/*switch: if
Перепишите пример ниже, используя if.*/
let color = prompt("Введите цвет","");
switch (color){
    case "red": document.write("<div style='background-color: red;'>красный</div>");
    case "black": document.write("<div style='background-color: black; color: white;'>черный</div>");
                break;
    case "blue": document.write("<div style='background-color: blue;'>синий</div>");
    case "green": document.write("<div style='background-color: green;'>зеленый</div>");
                break;
    default: document.write("<div style='background-color: gray;'>Я не понял</div>");
}

{
    let color = prompt("Введите цвет","");
    
    if (color === "red"){
        document.write("<div style='background-color: red;'>красный</div>");
        document.write("<div style='background-color: black; color: white;'>черный</div>")
    }
    if (color === "black"){
        document.write("<div style='background-color: black; color: white;'>черный</div>")
    }


    if (color === "blue"){
        document.write("<div style='background-color: blue;'>синий</div>");
        document.write("<div style='background-color: green;'>зеленый</div>");
    }
    if (color === "green"){
        document.write("<div style='background-color: green;'>зеленый</div>");
    }  
    
    if ( !(color == "red" || color === "black" || color === "blue" || color === "green") ){
        document.write("<div style='background-color: gray;'>Я не понял</div>")
    }
}

/*noswitch
Напишите функцию noSwitch, которая принимает объект со значениями-функциями, ключ для объекта и запускает одну из функций из объекта если ключ найден, иначе - запускает default:
const noSwitch = (key, cases, defaultKey='default') => {
    //проверка наличия key в cases
    //если есть - достать значение по ключу. это будет функция. Запустить ее
    //если нет - извлечь из объекта cases значение по ключу, имя которого лежит в переменной defaultKey. Запустить 
    //пущай функция noSWitch возвращает то, что возвращает одна из функций из объекта
}

*/
{
    const noSwitch = (key, cases, defaultKey='default') => {
        if (key in cases){
            return cases[key]()
        }else{
            return cases[defaultKey]()
        }
    }


    const drink = prompt("Что вы любите пить")
    noSwitch(drink, {
        воду: () =>  console.log('Самый здоровый выбор!'),
        чай(){ 
            console.log('Вкусная и полезная штука. Не переусердствуйте с сахаром')
        },
        "пиво": () => console.log('Хорошо летом, да в меру'),
        виски: function(){
            console.log('Да вы, батенька, эстет! Не забудьте лед и сигару')
        },
        default(){
            console.log('шото я не понял')
        }
    })
}

/*closure calc
fetch('https://open.er-api.com/v6/latest/USD').then(res => res.json())
     .then(data => {
            //эта функция запускается когда данные скачиваются.
            //остальной код работает РАНЬШЕ.
            //только ТУТ есть переменная data со скачанными данными
            console.log(data) //изучите структуру, получаемую с сервера в консоли
        })
Напишите внутри анонимной функции, переданной в then (data =>):
цикл, который перебирает курсы;
на каждой итерации создается кнопка (document.createElement)
текст кнопки - название валюты (innerHTML или innerText)
Назначьте обработчик события на этой кнопке (onclick = () => {.....}). Функция-обработчик должна быть написана прямо в теле цикла
Обработчик должен спрашивать сумму используя prompt и переводить эту суммы из валюты, написанной на кнопке в USD
Найдите замыкания. Для доступа к валютам из data.rates используйте [], . тут не поможет. Кнопки добавляйте в специальный контейнер (div например), созданный в HTML, или, на худой конец, в body*/

{
    fetch('https://open.er-api.com/v6/latest/USD').then(res => res.json())
        .then(data => {
            //эта функция запускается когда данные скачиваются.
            //остальной код работает РАНЬШЕ.
            //только ТУТ есть переменная data со скачанными данными
            console.log(data) //изучите структуру, получаемую с сервера в консоли

            for (rate in data.rates) {
                console.log(rate)
                const cource = data.rates[rate]
                const div = document.createElement('div')
                const button = document.createElement('button')
                button.innerText = rate
                button.classList.add('button')
                div.append(button)
                document.body.append(div)
                button.onclick = () => {
                    alert(cource)
                    const value = +prompt('какую сумму будем менять?')
                    const result = value / cource
                    alert(result)
                }


            }
        })
}

/* closure calc 2
Создайте HTML файл с :
<select id='from'> - исходная валюта
<select id='to'> - валюта в которую происходит обмен
<div id='rate'> - кросскурс между валютами
<input type='number' id='amount' /> - сумма в исходной валюте
<div id='result'> - сумма в валюте, в которую хотим поменять
Используя заготовку из предыдущего задания, наполните select-ы тэгами option с названиями валют, используя цикл
document.createElement
innerText для option
from.append или to.append
За пределами цикла назначьте обработчики onchange для элементов select и oninput для элемента input, используя их id. По этим событиям обновляйте текст в div#rate и div#result
Для чтения текущего значения select используйте свойство value: from.value или to.value*/

{
    fetch('https://open.er-api.com/v6/latest/USD').then(res => res.json())
        .then(data => {
            //эта функция запускается когда данные скачиваются.
            //остальной код работает РАНЬШЕ.
            //только ТУТ есть переменная data со скачанными данными
            console.log(data) //изучите структуру, получаемую с сервера в консоли
            const from = document.createElement('select')
            from.id = "from"
            const to = document.createElement('select')
            to.id = "to"
            document.body.append(from)
            document.body.append(to)
            const rateNow = document.createElement('div')
            rateNow.id = 'rateNow'
            document.body.append(rateNow)
            const amount = document.createElement('input')
            amount.id = 'amount'
            amount.type = 'number'
            document.body.append(amount)
            const result = document.createElement('div')
            result.id = 'result'
            document.body.append(result)
           
            for (rate in data.rates) {
                console.log(rate)
                const cource = data.rates[rate]
                const option = document.createElement('option')
                option.innerText = rate
                option.classList.add('option')
                option.value = rate
                const option2 = document.createElement('option')
                option2.innerText = rate
                option2.classList.add('option')
                option2.value = rate
                from.append(option);
                to.append(option2);
            }
            from.onchange = to.onchange = amount.oninput = () => {
                rateNow.innerText = (data.rates[to.value] / data.rates[from.value]).toFixed(4)
                result.innerText = (data.rates[to.value] / data.rates[from.value] * amount.value).toFixed(2)
            }

        })
}

/*countries and cities
fetch('https://raw.githubusercontent.com/russ666/all-countries-and-cities-json/master/countries.min.json').then(res => res.json())
     .then(data => {
            //эта функция запускается когда данные скачиваются.
            //остальной код работает РАНЬШЕ.
            //только ТУТ есть переменная data со скачанными данными
            console.log(data) //изучите структуру, получаемую с сервера в консоли
        })
По аналогии с предыдущем заданием, реализуйте интерфейс выбора страны и города:
по закрузке данных наполняйте select#countries элементами option с названиями стран;
так же назначьте обработчик события onchange в select#countries, который:
удаляет старый контент select#cities (достаточно занести в innerHTML или innerText пустую строку)
добавляет в select#cities элементы option с городами из выбранной только что страны.
Таким образом, при изменении страны будет меняться список городов в select#cities*/

{
    fetch('https://raw.githubusercontent.com/russ666/all-countries-and-cities-json/master/countries.min.json').then(res => res.json())
     .then(data => {
            //эта функция запускается когда данные скачиваются.
            //остальной код работает РАНЬШЕ.
            //только ТУТ есть переменная data со скачанными данными
            console.log(data) //изучите структуру, получаемую с сервера в консоли

            const countries = document.createElement('select')
            const cities = document.createElement('select')

            for (country in data){
                const optionCounty = document.createElement('option')
                optionCounty.innerText = optionCounty.value = country
                countries.append(optionCounty)                
            }

            countries.onchange = () => {
                cities.innerText = ''
                for (city of data[countries.value]){
                    const optionCity = document.createElement('option')
                    optionCity.innerText = optionCity.value = city
                    cities.append(optionCity)

                }
            }

            document.body.append(countries)
            document.body.append(cities)

        })

}