Как составить глубокое вложения классов в javascript?

Question

[ncoxall]

Раньше я писал так: (простой пример)
var Root = {};
Root.Pages = {};
Root.Pages.Home = function(){};
Root.Pages.Reg = function(){};
Root.Pages.Login = function(){};

Теперь хочу перейти на Классы но не пойму как в них делать подобное вложение... (Root.Pages.Login)
Есть ли подобные примеры?

Comments

[ncoxall]

Артём Петренков: Красивый код)

[ncoxall]

Артём Петренков: ОК) можете рассказать что за модули или хотя бы линк)

[ncoxall]

Артём Петренков: Спасибо!

[ncoxall]

Артём Петренков: А как добавить функцию к классу не внутри класса?
class Polygon {
constructor() {
this.height = 11;
this.width = 22;
}
newLength(newLength) {
this.height = newLength;
this.width = newLength;
}
}

newLength добавлен внутри а как добавить снаружи?

[ncoxall]

Вот это еще ООП? https://jsfiddle.net/rrne3a45/

Answer 1

[sugadu]

class Polygon {
  constructor() {
    this.height = 11;
    this.width = 22;
  }
}

var myObj = {};
myObj.Polygon = Polygon;

console.log((new myObj.Polygon).height)

Comments

[ncoxall]

Смотрите я могу добавить

class Polygon {
constructor() {
this.height = 11;
this.width = 22;
}

newLength(newLength) {
this.height = newLength;
this.width = newLength;
}
}

И мы получим функцию внутри класса newLength но могу ли я еще добавить функцию в функцию?)))

class Polygon {
constructor() {
this.height = 11;
this.width = 22;
}

newLength(newLength) {
this.height = newLength;
this.width = newLength;

this. newheight = function(height){this.height};
this. newwidth = function(width){this.width};
}
}

[sugadu]

ncoxall: Конечно, в js классы это те же функции, а функции это те же объекты.
https://jsfiddle.net/6nyhdLtr/

[ncoxall]

https://jsfiddle.net/rrne3a45/

[ncoxall]

Спасибо!

[ncoxall]

sugadu: Но если я создам новую копию класса через нnew

class Parent_Polygon {
constructor() {
this.height = 11;
this.width = 22;
}
}

var Child_Polygon = function(){
this.height = 331;
this.width = 44;
}

Parent_Polygon.Child_Polygon = Child_Polygon;

var myObj = new Parent_Polygon();

//myObj.Child_Polygon();

console.log(myObj.height)

То получу ошибку что Child_Polygon не функция!

[yociyavi]

ncoxall: Потому что вы добавили Child_Polygon как свойство к классу(функции), а хотите вызвать его у экземпляра этого класса(объекта). Вам нужно или добавить у Parent_Polygon в конструкторе this.Child_Polygon = Child_Polygon; или после создания экземпляра сделать myObj.Child_Polygon = Child_Polygon

[ncoxall]

yociyavi: Спасибо!!!

Answer 2

[Faliah]

Не совсем понял в чём вопрос. Если под "глубокое вложение классов" вы подразумеваете то, что функции-конструкторы у вас являются свойствами объектов, вложенных в другие объекты, то у вас ничего не поменяется:

let Root = {};
Root.Child = {};

class MyClass {
  constructor(prop1, prop2) {
    this.prop1 = prop1;
    this.prop2 = prop2;
  }
}

Root.Child.MyClass = MyClass;

var instance = new Root.Child.MyClass('super', 'great');
console.log(instance);

Если же вы имели в виду сильно вложенное наследование RootClass -> ChildClass -> ChildOfChildClass. То хотелось бы от этого предостеречь и дать несколько ссылок на английские ресурсы. Лучше сразу приучаться делать правильно (по-крайней мере так принято):

Yuotube ролик - Composition over inheritance
Prefer composition over inheritance
Common Misconceptions About Inheritance in JavaScript
3 Different Kinds of Prototypal Inheritance: ES6+ ...
The Open Minded Explorer’s Guide to Object Composition
The Two Pillars of JavaScript