HW_Js/HW_js_5/scriptDz4(objectsInJson).js

// 3 persons
// Сделать три ассоциативных массива a, b, c, в каждом из которых должны быть поля name и surname.
// // +
// // different fields

let first = {
    name: "Lotos",
    surname: "White",
    age: 39,
}


let second = {
    name: "Viktorov",
    surname: "Viktorov",
    sex: 'male',

}

let third = {
    name: "Alla",
    surname: "Petrofanova",
    patronymic: "Viktorovna",
   
}



// // fields check

// // Проверьте наличие необязательных полей у каждого из этих массивов. Если поле найдено, выведите его с помощью alert. Проверку делайте по typeof или in в if.

if ("age" in first){
    alert(first.age)
}

if ("patronymic" in third){
    alert(third.patronymic)
}

if ("sex" in second){
    alert(second.sex)
}

// // array of persons


let personsFirst = [first, second, third, {name: 'Michael', surname: 'Phelps'}];

// console.log(persons);

// loop of persons


for(let persons of personsFirst) {
    // console.log(persons)
}

// // loop of name and surname
// // Сделайте цикл, который выводит весь массив persons, но только Имя и Фамилию каждой персоны.

// for(let person of personsFirst) {
//     console.log(person.name, person.surname);
// }


// loop of loop of values


// for (let person of personsFirst) {

//     for (let value in person) {
//        console.log(person[value]);
//     }
// }

// fullName--------------------

// for (let person of personsFirst) {
//     someResult = person.name + ' ' + person.surname;

//     if("fathername" in person) {
//         someResult += ' ' + person.fathername;
//     }

// };
// console.log(personsFirst)



// serialize
// Создайте JSON-строку из persons

// let personChange = JSON.stringify(personsFirst);

// console.log(personChange);
// console.log(typeof personChange);


// deserialize
// Создайте ассоциативный массив с одной персоной из JSON-строки. Добавьте её в persons

// let personDeserialize = JSON.parse(personChange)[0];
// personsFirst.push(personDeserialize);
// console.log(personsFirst);




// HTML

// let str = "<table border='1'>"
// for (let persons of personsFirst){
//     str += `<tr><td>${persons.name}</td><td>${persons.surname}</td></tr> \n`
// }
// str += "</table>"

// console.log(str)
// document.write(str)

// HTML optional fields + tr color + th optional

// Сделайте цикл, который выводит весь массив persons, в форме HTML-таблицы. Имя и Фамилия, а так же другие поля при наличии. Колонки: поля, строки таблицы - персоны.


let str = "<table style='border: 4mm ridge rgba(56, 255, 109, .6);background-color: #FF8F1B;background-image: linear-gradient(334deg, #2ab3ff,#ff2d00);' ><tr>"
let index = 0;
const newArr = [];

for (const person of personsFirst) {

    index += 1;
    
    for (const key in Object.keys(person)) {

        if (!newArr.includes(Object.keys(person)[key])) {
            newArr.push(Object.keys(person)[key]);
        };
    };

};

for (let i = 0; i < newArr.length; i++) {

    str += `<tr><th style="border: 2px solid black; background-color: rgba(255, 143, 27, 0.6);;
    background-image: linear-gradient(to left, #2ab3ff,#F7F7F7, #ff2d00);">${newArr[i].toUpperCase()}</th>`

    for (let k = 0; k < personsFirst.length; k++) {
    
        for (const key in personsFirst[k]) {
        
            if (key === newArr[i]) {

                str += `<td style='border: 3px solid black; background-color: #F7F7F7;background-image: linear-gradient(to left, #2ab3ff,white,#F7F7F7, #ff100099);'>${personsFirst[k][key]}</td>`;
                
            };
        };
    };
};

str += "</table>"
document.write(str)


// destruct array---------


// let arr = [1,2,3,4,5, "a", "b", "c"];

// let [odd1,even1,odd2,even2,odd3, ...letters] = arr;

// alert(letters);

// destruct string-------------

// let arr = [1, "abc"];

// let [number, [s1,s2,s3]] = arr;

// alert(s1+" "+s2+" "+s3);


// destruct 2---------------

// let obj = {nameA: 'Ivan',
//            surname: 'Petrov',
//            children: [{name: 'Maria'}, {name: 'Nikolay'}]}

// let = {nameA,surname,children:[{name :name1}, {name: name2}]} = obj;

// alert(name2);

// destruct 3------------------

// let arrDe3 = [1,2,3,4, 5,6,7,10]

// let {0:n1, 1:n2, length} = arrDe3
// alert("n1 = " +n1 + " n2 = " + n2 + " length = " + length)