javascript-react-course-Baksha2008/js-core/homeworks/homework-10/src/main.js at dfb6b4eafeff196b03264d9bde8b200cdfacfeff · EasyCode-JavaScriptReact-v1/javascript-react-course-Baksha2008 · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
/*
 *
 * Задача 0
 *
 * Что вернет выражение z(x) ?
 * Напишите ответ своими словами как вы понимаете
 * В консоле не смотрите, сначала напишите, после проверьте себя
 *
 * */

let y = 5;
//созадет переменную y, в которую записывает значение 5
let x = () => {
  // console.log('We here')
  return y;
}
// создает функцию x, которая возврщает 5

let z = t => {
  //создает функцию z, с аргументом t, которая перезаписывает y, но снова на 5.
   let y = 5;
  //  return y
  // если будетет return, то возьмет отсюда, так как віше не пойдет, найдет y здесь
  // console.log('We here')
  t();
  // вызывает аргумент как функцию, которую потом туда передадим как аргумент
};
console.log(y);
//должно вывести 5, так как обратится к внейшней переменной 11 строка
z(x); // что вернет
//вызывает фунцию z, передает аргументом фунцию x, перезаписывает y, но снова на 5
//и вызывает фунцию x, которая возвращает(В - внимательность!!!!) y. Y возьмет и строки 18
// поигрался, возврщает undefined, потому что функция ничего не возвращает, а только перезаписывает.
// а если не обернуть в console.log вызов на 30 строке, то вообщей ничего не вернет, кроме console.log на 27 строке)))

// /*
//  *
//  * TASK 1
//  * Создайте функцию которая будет превращать
//  * передаваемую строку в html тэг
//  *
//  *
//  * */

// let $ = function(str) {
//   if(typeof str == 'string'){
//     let result = `<${str}></${str}>`
//     return result
//   }
// };

// let createBODY = $('body');
// let createDIV = $('div');
// console.log(createBODY); // <body></body>
// console.log(createDIV); // <div></div>

// /*
//  *
//  * TASK 2
//  *
//  * Создайте объект к которому можно будет применить любое число вызовов
//   // obj.method().method().method()
//   ---------------
//  *  Передаваемое значение должно возвращаться в виде html тэгов (TASK 1)
//  *  Передаваемые аргументы должны быть только в виде строки
//  * */


var ezjQuery = {
  tag: '',
  state: [],
 add(str, text){
   let elem = text || ''
  if(typeof str == 'string'){
    this.tag += `<${str}>${elem}</${str}>`
    this.state.push(str);
    return this
  }
 },
//  render(){
//   let elem = this.text || ''
//   let result = this.tag += `<${this.state[0]}>${elem}</${this.state[0]}>`
//   // this.tag = ''
//   // console.log(this.tag)
//   return result
//  }
};

// ezjQuery
//   .add('body') // <body></body>
//   .add('div') // <body></body><div></div>
//   .add('h1'); // <body></body><div></div><h1></h1>

// /*
//  *
//  * TASK 3
//  * Доработйте метод add чтобы на каждом вызове следующий
//  * тэг помещался внутри предыдущего !
//  ---
//  * И добавьте объекту ezjQuery метод render, который будет возвращать
//  * сгенерированную строку
//  -----
//  * Методу add - второй параметр, который будет размещать
//  * информацию внутри тэга
//  *
//  */

// example
var helloList = ezjQuery
  .add('body') // <body></body>
  .add('div') // <body><div></div></body>
  .add('ul') // <body><div><ul></ul></div></body>
  .add('li', 'Hello') //<body><div><ul><li>Hello</li></ul></div></body>
  // .render();
console.log(helloList); // <body><div><ul><li>Hello</li></ul></div></body>
//  Обратите внимание, что после вызова render создание строки началось сначала

// var bodyDiv = ezjQuery
//   .add('body') //<body></body>
//   .add('div') //<body><div></div></body>
//   .render();
// console.log(bodyDiv); //<body><div></div></body>

// Для выполнивших все задания
// сделайте document.write(helloList) увидите результат :)

// @SUPER
/*
 * Переименуйте объект ezjQuery в $.
 * Создание перевого метода должено быть без метода
 *
 * $('body').add('li', 'hi').render() // <body><li>hi</li></body>
 *
 * */