Как я использую ChatGPT на работе

Как я писал в одном из предыдущих постов, обучение программиста никогда не заканчивается. Особенно сейчас, когда хорошо, если просто успеваешь следить за выходом новых технологий, не то, что детально их изучать и тестить. Но ChatGPT — как раз та фича, на которую точно стоит потратить время.
Последняя презентация OpenAI показала, как сильно всего за 1 год спрогрессировал её главный продукт и хотим мы этого или нет, дальнейшую интеграцию ИИ в нашу жизнь уже не остановить.
Какими же дарами синтетического разума пользуюсь я? Про Midjourney я уже рассказывал, сегодня же речь пойдёт о ChatGPT.
Я использую обычный бесплатный телеграм-бот, куда закидываю куски кода и свои вопросы на русском. Дальше будет простой, наглядный пример одного реального кейса.

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

const content = ['widget-91d54751ffe044e6924b3b56f36fe754', 'widget-5a41fe962c9a4dd7832f6e0173310a56']
const ct = content.map(item => document.getElementById(item))
const filterValue = visApi().getSelectedValues(w.general.renderTo)

const hideTabContent = () => {
ct.forEach(item=> {
item.style.display= 'none'
})
}

switch (filterValue[0][0]) {
case '1кв':
hideTabContent();
ct[0].style.display= 'block';
break;
case '2кв':
hideTabContent();
ct[1].style.display= 'block';
break;
case '3кв':
hideTabContent();
ct[2].style.display= 'block';
break;
default:
hideTabContent();
ct[0].style.display= 'block';
}

В предоставленном коде, вы создаете массив `ct`, содержащий элементы DOM, полученные с помощью `document.getElementById(item)`. Затем вы используете `filterValue` для определения значения фильтра.

Далее, у вас есть функция `hideTabContent()`, которая скрывает все элементы `ct`, устанавливая их стиль `display` на `'none'`.

Затем вы используете оператор `switch` для проверки значения `filterValue[0][0]`. В зависимости от значения, вы вызываете `hideTabContent()` и затем устанавливаете стиль `display` для соответствующего элемента `ct`.

В целом, код скрывает все элементы `ct`, а затем отображает только один из них в зависимости от значения фильтра.

Чтобы подписаться на изменение переменной `filterValue` и автоматически скрывать и отображать элементы `ct` в зависимости от значения `filterValue`, вы можете использовать геттеры и сеттеры. Вот как это можно сделать:

```javanoscript
const content = ['widget-91d54751ffe044e6924b3b56f36fe754', 'widget-5a41fe962c9a4dd7832f6e0173310a56'];

const ct = content.map(item => document.getElementById(item));

let filterValue = visApi().getSelectedValues(w.general.renderTo);

const hideTabContent = () => {
ct.forEach(item => {
item.style.display = 'none';
});
};

const showTabContent = (index) => {
hideTabContent();
ct[index].style.display = 'block';
};

Object.defineProperty(window, 'filterValue', {
get: function() {
return filterValue;
},
set: function(newValue) {
filterValue = newValue;
switch (filterValue[0][0]) {
case '1кв':
showTabContent(0);
break;
case '2кв':
showTabContent(1);
break;
case '3кв':
showTabContent(2);
break;
default:
showTabContent(0);
break;
}
}
});

// Пример использования
filterValue = visApi().getSelectedValues(w.general.renderTo); // Передаем новое значение filterValue
```

В этом коде мы определяем геттер и сеттер для переменной `filterValue` с помощью `Object.defineProperty()`. При каждом изменении значения `filterValue`, сеттер будет вызываться автоматически. Внутри сеттера мы обновляем значение `filterValue` и затем вызываем функцию `showTabContent()`, чтобы отобразить соответствующий элемент `ct` в зависимости от нового значения `filterValue`.

Вы можете использовать этот пример в своем коде, чтобы подписаться на изменение `filterValue` и автоматически скрывать и отображать элементы `ct`.

Прелесть в том, что ChatGPT не только выполнил задачу(пока не идеально), но и улучшил мой код, вынеся добавление display: 'block' в отдельную функцию. Продолжаю допиливать запрос. Прошу доработать код с учётом того, что он запускается на платформе Visiology, поэтому для подписки на изменение переменной нужно использовать
visApi().onSelectedValuesChangedListener({ guid, widgetGuid }, handler) void

то есть handler будет исполняться, когда юзер выбрал значение, а внутри уже берём это значение и через visapi передаём на другой виджет

Далее мне понадобилось ещё 2 уточняющих промпта, чтобы Chat выдал мне полностью рабочий код. На всё про всё у меня ушло минут 20. Да, это был довольно простой пример, но с учётом того, что ещё год назад подобное казалось уделом далёкого будущего, подумайте, что будет лет через пять?

ChatGPT vs GigaChat
1:0

Сегодня решил сравнить импортный ИИ с отечественным. Для примера взял классическую задачку для джунов про замыкание. Не смотря на то, что она довольно простая, не только лишь все могут объяснить, как это работает. Вот задачка👇