V S

Ссылок, собственно, дофига..

https://learn.javascript.ru/
https://github.com/getify/You-Dont-Know-JS
jstherightway.org
largescalejs.ru
shop.oreilly.com/product/9780596517748.do
https://habr.com/company/ruvds/blog/337042/

У Кантора вполне себе систематизированный учебник. Именно с него я начал, когда понял, что jquery для меня недостаточно.
Но дело не только в том, что вы читаете учебник. Я уже 100500 раз, наверное, это говорю, но:
1. Вы должны решать все задачи, которые есть в списке задач к главам.
2. Важно ещё пытаться применить полученные знания где-то: в своей работе, или в какой-то выдуманной задаче. То есть, например, нужно использовать `Array.prototype.filter` столько раз, чтобы не возникало больше вопросов "как оно работает?", чтобы руки "помнили".

Разумеется, это всё нужно для того, если вы хотите во фронт. Пласт информации огромный. Сам js, браузерные API, и прочее-прочее..

Может быть, что всё выше - оффтоп, но дело в том, что нет систематизированного подхода, как мне кажется.
Есть знакомые, которые умеют работать только с DOM-ом и событиями, а как работать с данными в js, что такое замыкания - не знают. А сайт Ильи Кантора им почему-то кажется сложным.

Просто решайте разные задачи: работайте с данными; рисуйте на canvas, svg; манипулируйте DOM-ом; используйте service worker-ы; etc.. Это и будет расширять ваш кругозор..
Но начать я бы советовал всё-таки с учебника Ильи ;)

$this->template->content
в данном случае в текущем классе есть поле(в данном случае не метод, но можно провернуть такое с методами называется chain (https://stackoverflow.com/questions/3724112/php-me... )) template которое в свое в свою очередь экземпляр какого то класса имеющий поле content

Вообще крутой ход - изучать фреймворки ни слова не почитав о ООП.

$this как правило указывает на экземпляр класса, а после "стрелочки" метод или свойство.

Такой прием с цепочками вызовов называется "method chaining".

Почитать можно документацию php.net/manual/ru/language.oop5.php
Или какой-нибудь учебник, где более "живым" языком расскажут.

Если это не первый язык, то основы синтаксиса вы быстро освоите.

Затем встроенные методы работы со строками, массивами, объектами. Это не обязательно зубрить, какой-нибудь Array.forEach и так рано или поздно усвоится, но желательно знать какие вообще методы бывают и где о них почитать подробнее.

Приведение типов немного отличается от PHP, надо привыкнуть.

Дальше всякие специфические js штуки, типа замыканий и странноватого this, с ними можно долго возиться.

Асинхроность отдельным пунктом.

Потом (или параллельно) браузерный API и DOM. Объемы там в разы больше чем собственно в языке, но для повседневной работы нужно далеко не все, тут тоже важно понять какие возможности существуют в принципе, и где примерно в справочнике их найти.

И затем фремворки и библиотеки.

Естественно вы можете немного переставлять эти пункты местами и что-то изучать параллельно, но у вас не получится изучить Vue до того, как освоите основы синтаксиса.

Учебник https://learn.javascript.ru/ неплох, но можно почитать и бумажную книгу какую-то.

Отдельные темы неплохо расписаны на mdn, но все-же это в первую очередь крутой справочник, а не структурированный учебник.

Основы языка можно потренировать на codewars. Очень круто, если решаешь задачу не подглядывая, а потом сравниваешь свой код с топовыми ответами и разбираешься почему у них 7 строчек, а у тебя 30. Но надо вовремя остановиться и не увлечься написанием всякой нечитаемой фигни.

По шагам:
1. Базовые конструкции языка
2. Функции работы со строками, массивами и объектами
3. Работа с DOM
4. Функции и замыкания
4. ООП посредством функций
5. ES6 (все полностью)
6. Любой фреймворк