Homeworks_Oleksii.L/Homework_16/associative_arrays1.js

// 3 persons------------------------------------------------------------------------------------------------------------------------------------//

// let a = {
//   name: "Alexandra",
//   surname: "Olefirenko",

// };

// let b = {
//   name: "Platon",
//   surname: "Plokhenko",

// };

// let c = {
//   name: "Sofia",
//   surname: "Sternenko",

// };

// different fields---------------------------------------------------------------------------------------------------------------------------------------------------;

// let a = {
//   name: "Alexandra",
//   surname: "Olefirenko",
//   sex: "female",
//   age: 21,
// };

// let b = {
//   name: "Platon",
//   surname: "Plokhenko",
//   education: "Bachelor degree",
//   age: 18,
// };

// let c = {
//   name: "Sofia",
//   surname: "Sternenko",
//   fathername: "Vyktoryvna",
//   age: 27,
// };

// fields check---------------------------------------------------------------------------------------------------------------------------------------------------;

let a = {
  name: "Alexandra",
  surname: "Olefirenko",
  sex: "female",
  age: 21,
};

let b = {
  name: "Platon",
  surname: "Plokhenko",
  education: "Bachelor degree",
  age: 18,
};

let c = {
  name: "Sofia",
  surname: "Sternenko",
  fathername: "Vyktoryvna",
  age: 27,
};

if (Object.keys(a).includes("age", "sex")) {
  console.log(a.sex, a.age);
} else {
  console.log("Not here");
}

if (Object.keys(b).includes("age", "education")) {
  console.log(b.sex, b.education);
} else {
  console.log("Not here");
}

if (Object.keys(c).includes("fathername", "age")) {
  console.log(c.fathername, c.age);
} else {
  console.log("Not here");
}

// array of persons---------------------------------------------------------------------------------------------------------------------------------------------------;

let persons = [
  (a = {
    name: "Alexandra",
    surname: "Olefirenko",
    sex: "F",
    age: 21,
  }),
  (b = {
    name: "Platon",
    surname: "Plokhenko",
    sex: "M",
    age: 18,
    education: "Bachelor degree",
  }),
  (c = {
    name: "Mariya",
    surname: "Sternenko",
    fathername: "Vyktoryvna",
    sex: "F",
    age: 27,
    region: "Kyiv",
    phoneNumber: "0731232323",
  }),
];

// loop of persons-----------------------------------------------------------------------------------------------------------------------------------------------------------;

for (i = 0; i < persons.length; i++) {
  console.log(persons[i]);
}

// loop of name and surname---------------------------------------------------------------------------------------------------------------------------------------------------;

for (let i = 0; i < persons.length; i++) {
  if (
    typeof persons[i].name === "string" &&
    typeof persons[i].surname === "string"
  ) {
    for (key in persons[i]) {
    }
    console.log(
      "name: " +
        " " +
        persons[i].name +
        "," +
        " " +
        "surname: " +
        " " +
        persons[i].surname
    );
  } else {
    alert("error");
  }
}

// loop of loop of values---------------------------------------------------------------------------------------------------------------------------------------------------;

for (i = 0; i <= persons.length; i++) {
  for (let key in persons[i]) {
    console.log(key + ": " + persons[i][key]);
  }
}
// fullName---------------------------------------------------------------------------------------------------------------------------------------------------;

for (let i = 0; i <= persons.length; i++) {
  for (let key in persons[i]) {
    if ("fathername" in persons[i]) {
      console.log(
        (persons[i].fullName =
          persons[i].surname +
          " " +
          persons[i].name +
          " " +
          persons[i].fathername)
      );
    } else {
      console.log(
        (persons[i].fullName = persons[i].surname + " " + persons[i].name)
      );
    }
  }
}
// serialize---------------------------------------------------------------------------------------------------------------------------------------------------;

JSON.stringify(persons);

// deserialize---------------------------------------------------------------------------------------------------------------------------------------------------;

let d = JSON.parse('{"name": "Taras", "surname": "Shevchenko"}');
persons.push(d);

// HTML----------------------------------------------------------------------------------------------------------------------------------------------------------;
document.write("</table>");
document.write(
  '<table style = "border-collapse: collapse", "border: 1px solid black; ">'
);
document.write("<tr>");

for (key in persons[0]) {
  document.write('<th style = "border: 1px solid black;">' + key + "</th>");
}
document.write("</tr>");
for (let i = 0; i < persons.length; i++) {
  document.write("<tr>");
  for (value in persons[i]) {
    document.write(
      '<td style = "border: 1px solid black;">' + persons[i][value] + "</td>"
    );
  }
  document.write("</tr>");
}
document.write("</table>");

// HTML optional fields---------------------------------------------------------------------------------------------------------------------------------------------------;
{
  let headers = persons
    .reduce((a, b) => a.concat(Object.keys(b)), [])
    .filter((v, i, s) => s.indexOf(v) === i);
  str =
    `<table style = "border: 1px solid black; border-collapse: collapse;"><tr>${headers
      .map(
        (e) =>
          `<th style = "border: 1px solid black; border-collapse: collapse;">${e}</th>`
      )
      .join("\n")}</tr>` +
    persons
      .map(
        (e) =>
          `<tr>${headers
            .map(
              (e1) =>
                `<td style = "border: 1px solid black; border-collapse: collapse;">${
                  e[e1] ? e[e1] : "-"
                }</td>`
            )
            .join("\n")}</tr>`
      )
      .join("\n") +
    `</table>`;

  document.write(str);
}
// HTML tr color---------------------------------------------------------------------------------------------------------------------------------------------------;

{
  let headers = persons
    .reduce((a, b) => a.concat(Object.keys(b)), [])
    .filter((v, i, s) => s.indexOf(v) === i);
  str =
    `<table style = "border: 1px solid black; border-collapse: collapse;"><tr style = "background-color: #ffff00;" >${headers
      .map(
        (e) =>
          `<th style = "border: 1px solid black; border-collapse: collapse;">${e}</th>`
      )
      .join("\n")}</tr>` +
    persons
      .map(
        (e) =>
          `<tr style = "background-color: lightgreen;">${headers
            .map(
              (e1) =>
                `<td style = "border: 1px solid black; border-collapse: collapse;">${
                  e[e1] ? e[e1] : "-"
                }</td>`
            )
            .join("\n")}</tr>`
      )
      .join("\n") +
    `</table>`;

  document.write(str);
}
// HTML th optional---------------------------------------------------------------------------------------------------------------------------------------------------;
// Задание на синий пояс.---------------------------------------------------------------------------------------------------------------------------------------------------;
// HTML constructor---------------------------------------------------------------------------------------------------------------------------------------------------------;
let body = {
  tagName: "body",
  subTags: [
    {
      tagName: "div",
      subTags: [
        {
          tagName: "span",
          text: "Enter a data please:",
        },
        {
          tagName: "br",
        },
        {
          tagName: "input",
          attrs: {
            type: "text",
            id: "name",
          },
        },
        {
          tagName: "input",
          attrs: {
            type: "text",
            id: "surname",
          },
        },
      ],
    },
    {
      tagName: "div",
      subTags: [
        {
          tagName: "button",
          text: "OK",
          attrs: {
            id: "ok",
          },
        },
        {
          tagName: "button",
          text: "cancel",
          attrs: {
            id: "cancel",
          },
        },
      ],
    },
  ],
};

function createElem(tagName, attrs, text) {
  var elem = document.createElement(tagName);
  if (attrs) for (var name in attrs) elem.setAttribute(name, attrs[name]);
  if (text) elem.textContent = text;
  return elem;
}

function walker(tree) {
  var tagName = tree.tagName,
    attrs = tree.attrs,
    text = tree.text,
    elem = createElem(tagName, attrs, text);
  if (tree.subTags)
    tree.subTags.forEach(function (el) {
      el = walker(el);
      elem.appendChild(el);
    });
  return elem;
}
var table = walker(body);
document.body.appendChild(table);

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

  let evenArray = [];
  let oddArray = [];
  let lettersFromArr = [];
  for (let i = 0; i < arr.length; i++) {
    if (typeof arr[i] === "number") {
      if (arr[i] % 2 === 0) {
        evenArray.push(arr[i]);
      } else {
        oddArray.push(arr[i]);
      }
    } else {
      lettersFromArr.push(arr[i]);
    }
  }

  let [even1, even2] = evenArray;
  let [odd1, odd2, odd3] = oddArray;
}

// destruct string---------------------------------------------------------------------------------------------------------------------------------------------------;
let arr1 = [1, "abc"];

let [number, [s1, s2, s3]] = arr1;

console.log(number);
console.log(s1);
console.log(s2);
console.log(s3);

// destruct 2---------------------------------------------------------------------------------------------------------------------------------------------------;
let obj = {
  name: "Ivan",
  surname: "Petrov",
  children: [{ name: "Maria" }, { name: "Nikolay" }],
};

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

console.log(name1);
console.log(name2);
// destruct 3---------------------------------------------------------------------------------------------------------------------------------------------------;
{
  let arr = [1, 2, 3, 4, 5, 6, 7, 10];

  let { 0: a, 1: b, length } = arr;

  console.log(a);
  console.log(b);
  console.log(length);
}