Подскажите динозавру, как въехать в нынешний JavaScript

Но недавно меня обозвали динозавром, за то что написал в резюмешке «Знание JS на уровне JQuery».

Не пиши. Или пиши что этот клей для HTML обоев знают все :) Особо там не во что въезжать, т.к. при всем богатстве «гуд и остальных» частей, большинство JS-погромистов пишут лапшу. Просто сначала из колбэков, потом из промисов, теперь из асинк-авейтов. Ну и особые извращения мсьей с мозгами и руками заточенными под модный фреймворк с нескучными буззвордами для «того же самого что и у птичек».

Книгу? MDN читай https://developer.mozilla.org/en-US/

Вот кстати да, два стакана «зимнего» чая этому кэпу :)

React next

Сейчас в моде разнообразные фреймворки (Vue, React, Angular) и сборочные системы для получившегося (Webpack, Gulp, вот это вот). Если решишься удариться в оное – рекомендую начать с Vue, он не такой замудрённый.

Спасибо. Почитаю на досуге.

А как насчёт best practices? К примеру тот-же Ajax. Я привык с сервером через примитивы JQuery работать.Или надо через HTTPRequest? А доступ к элементам DOM? По старинке это делалось через селекторы JQ. А сейчас как принято?

Я привык с сервером через примитивы JQuery работать.

А ты точно динозавр? Я, помню, генерировал в текущем документе код типа “script src=“ для выполнения Ajax запроса.

Надо было 12 лет назад язык изучать, а не библиотеки. Тогда не возникало бы таких идиотских вопросов. Впрочем, сейчас ты занимаешься тем же самым.

Книги:

Фленаган, Javascript полное руководство, 7-е издание.

Хавербеке, Выразительный Javascript, 3-е издание.

Курсы:

Если с буржуинским дружишь, идешь на udemy и проходишь великолепные курсы современного JS от Jonas Shmedtman или Maximillian Shwarzemueller, хотя там океан замечательных курсов по всей громадной экосистеме Javascript. По ходу прохождения курсов начнешь въезжать что к чему и что тебе на самом деле надо…

И да, JQuery атавизм, потихоньку отползающий на свалку истории…

Ты не написал, зачем тебе нужно въезжать.

Сейчас javascript стал значительно лучше в плане реализации стандартов ecmascript/ES6.

Для изучения можно просто начать писать код в рамках этих стандартов прямо в index.html. Скрипты лучше подключать в виде вставок или файлов ES6 модулей.

Обычно все это интегрируется через webpack или альтернативы, но для изучения и экспериментов можно и так для начала. Еще, это будет нужно и удобнее когда пойдут зависимости в проекте и нужно подключать сторонние компоненты.

Для чтения: MDN, статьи, блоги, w3school, https://www.tutorialspoint.com/es6/

Поиск с ключевыми словами ES6 для начала, github awesome javascript|ES6

Спасибо

Совсем запамятовал…

https://learn.javascript.ru/

Я, помню, генерировал в текущем документе код типа “script src=“ для выполнения Ajax запроса.

Я начинал с того, что подменял src у скрытого фрейма.

Если прямо изучать именно JS то конечно читай то что тебе накидали.

А если вот прямо надо начать работать бери фреймворк и фигачь, там ничего сложного. Вот например https://angular.io/start благодаря такому туториалу сможешь хотя бы примерно понять куда копать и что тебе нужно изучать.

Вот точно.

рекомендую начать с Vue, он не такой замудрённый

но и единственный из большой тройки, кто не может обеспечить проверку типов в шаблонах через TypeScript

доступ к элементам DOM?

Во-первых, копаться в DOM руками ненужно, используй библиотеку типа реакта. Во-вторых, все браузеры уже поддерживают нативные API типа querySelector.

Если хочется подучить чистый JS, то любой туториал типа learn.javascript.ru, там всё нормально расписано.

Если есть желание продолжить и вкатиться во фронтенд, то надо выбрать интересующий фреймворк (Vue, React/Redux, Angular, Ember) и его изучать. Попутно - его инфраструктуру (всякие обслуживающие cli, npm/yarn, webpack, babel, storybook и т.д.).

По пути не забыть про JS ES6/7 и хотя бы иметь представление о TypeScript, без этого будет вообще непонятно, что происходит в современном коде.

Могу посоветовать посмотреть этот видос Front-end 2022 Roadmap & Trends (https://www.youtube.com/watch?v=YDKFWhBkC8c), всё достаточно толково описано, как сейчас устроен мир фронтенда.

топовым инструментом был JQuery

jQuery все-же еще хорош и в плане обучения тоже, но весит многовато + много legacy, в том числе излишних слоев. Имеет смысл, по ходу искать ему достойную альтернативу - это тоже полезно в плане обучения.

Такие подходы как Lodash, events emitters в помощь.

Закрывайте тред.

Сколько опечаток в слове svelte…

Сейчас в моде […] Webpack, Gulp

Ого, у тебя криокамера уже даже по стандартам не-фронтендеров протекла.

Что, эти мальчики-однояйчики, смузихлёбы, придумали новый способ замучить разработчиков?

Я привык с сервером через примитивы JQuery работать

А доступ к элементам DOM? По старинке это делалось через селекторы JQ

Сейчас другая либа вытесняет jQuery потихоньку.

придумали новый способ замучить разработчиков?

А ты сам кто? Какой у тебя опыт, бэкграунд?

А вообще появилось пара zero-config сборщика.

тогда самым топовым инструментом был JQuery,

4.2

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

Или надо через HTTPRequest?

Да.

А доступ к элементам DOM? По старинке это делалось через селекторы JQ

Селекторы в JS вообще не надо использовать, они для CSS. Хотя в новом JS для таких костыльщиков сделали нативное querySelector. Для доступа к элементам есть нативное обращение к объектному дереву и есть функции поиска по name/class/id, а для того чтобы ими можно было легко пользоваться - надо правильно размечать html.

Он всегда был набором костылей для плохого кода

Нет и Нет. Когда он появился то было принято изучать JavaScript для каждого браузера отдельно. Я это помню. Это была первая либа которая поддерживала селекторы. Делала она это кратко и сильно сокращала код. В ней тогда появились цепочечные вызовы, что было внове для общераспространенного программирования.

Да и само название JQuery не просто так, это JavaScript Query, отражение факта того, что эта библиотека позволяет делать как бы запросы к дереву DOM и JavaScript API. Я помню что мейнстримом тогда были реляционные СУБД, недавно появившийся LINQ и вообще декларативный подход. Вместо развесистой клюквы можно было писать «.my_cool_button» или «#button_start»

Вот тут посмотрите: https://basicweb.ru/jquery/jquery_selectors.php

как получить нативным способом без селекторов доступ ко всем или определенным ячейкам или строкам определенной таблицы?

Это была первая либа которая поддерживала селекторы.

Повторю ещё раз - селекторы в JS это само по себе костыль. Для обращений к HTML-объектам изначально есть лучшие способы, но верстальщики, занимающиеся js, их не осиливали и хотели «как в css», вот и вышло оно.

Кроме реакта всё незначительно.

table.rows[n].cells

По-твоему внутри jquery магия какая-то? Он всё делает через нативные методы, только ещё добавляет оверхед на конвертацию «запроса через селектор» в нативные простые методы.

Функции для получания чайлдов блока и для получения следующего блока в js, думаю, есть. Если нужно не все а конкретные - помечаешь их классом и ищешь по классу (это НЕ селектор, эо поиск по классу - быстрый и без парсинга ненужных синтаксических конструкций).

динозавру,

въехать в нынешний JavaScript

Никак. Заканчивай карьеру кодера и переходи быстрее на руководящую должность .

Ты не написал, зачем тебе нужно въезжать.

Приходит осознание своей неактуальности на рынке труда, очевидно.

А нативный JS хоть знаешь? Нужно уметь в современные стандарты, о них можно почитать где угодно, можно на хабре или просто загуглить. Нужно уметь в TypeScript – это надмножество над JS, почитать можно на офф сайте. Ну и, конечно же, современные фреймворки. По React больше вакансий, учи его.

Ну а вообще чекни вакансии, там как правило пишут, что нужно уметь.

А нативный JS хоть знаешь?

Плоховато. Пишу по аналогии с Java, PHP, плюс GDD. Повторюсь, большую часть кода всегда реализовывал на JQuery. В академическом стиле можно сказать, без новомодных концепций и синтаксического сахара.

Ну, тогда с этого и нужно начать. Учить тут: https://learn.javascript.ru/

Это лучшее, что есть.

Пишу по аналогии с Java, PHP

А нафига тогда JS? Вакансий по Java и PHP вагон. Может лучше туда?))

А нафига тогда JS? Вакансий по Java и PHP вагон. Может лучше туда?))

Академический интерес и больное самолюбие.

как получить нативным способом без селекторов доступ ко всем или определенным ячейкам или строкам определенной таблицы?

  <table id=mytable>
    <thead>
      <tr><th>name<th>family<th>age
    <tbody>
      <tr><td>john<td>smith<td>30
      <tr><td>sara<td>konor<td>57
      <tr><td>michael<td>jackson<td>18
  </table>

let rows = document.all.mytable.tBodies[0].rows

for (let row of rows) {
    let [ name, family, age ] = cellsData(row)
    console.log(`имя: ${name} фамилия: ${family} возраст: ${age}`)
}

function* cellsData(row) {
  for (let cell of row.cells) yield cell.textContent.trim()
}

Безусловно такой матчинг let [ name, family, age ] хорош и удобен.

Хороший вопрос как повесить на эту выборку обработчик событий или куда проще это можно сделать 1/2 селекторами.

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

можно и на родителя и даже выше, но хотелось бы на определенные, в зависимости, например от атрибута и определенной группы классов

Сильно не переживай, тут большая часть комментаторов такие же динозавры как и ты. Советы только на веру не принимай, разочарование будет сильно.

хотелось бы на определенные, в зависимости, например от атрибута и определенной группы классов

Только так делать точно не стоит. Смотри target и его атрибуты и классы.

определенной группы классов

Это говнокод.

почему бы и нет?