|
|
@@ -0,0 +1,390 @@
|
|
|
+// 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: "Sofia",
|
|
|
+ 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);
|
|
|
+}
|
OleksiiL