Дмитрий Лузанов

Проверять запись в локалсторейдже, если ее нет - показывать окошко и записывать, если есть - ничего не делать.

как можно соорудить из этого объект File или какой другой для отправки в форме бекенду.

Что мешает отправить прямо так?

$.post("upload.php", { myImage: data })
  .done(function() {
    console.log('saved'); 
});

А на сервере что-то вроде этого.

Если нужно именно с file, то можно попробовать так:

var blobBin = atob(dataURL.split(',')[1]);
var array = [];
for(var i = 0; i < blobBin.length; i++) {
    array.push(blobBin.charCodeAt(i));
}
var file=new Blob([new Uint8Array(array)], {type: 'image/png'});


var formdata = new FormData();
formdata.append("myNewFileName", file);
$.ajax({
   url: "uploadFile.php",
   type: "POST",
   data: formdata,
   processData: false,
   contentType: false,
}).done(function(respond){
  alert(respond);
});

© https://stackoverflow.com/a/19032688

steamID = process.argv[2]

hello({ // Это разве не передача объекта!?
  color: "#fcf"
})

А если попробовать что-то другое, например ng2-slider-component?
https://www.npmjs.com/package/ng2-slider-component

Ну вот есть DOM. Он медленный, и дергать его просто так не стоит. А есть виртуальный DOM, что-то типа прослойки между вашим кодом и реальным DOM. Вы можете дергать виртуальный DOM сколько вам душе угодно, а прослойка эта соберет всю инфу о том как вы чего делали, и попробует оптимизировать взаимодействие с реальным DOM что бы вышло как можно меньше действий.

Пример - задача простая, у вас есть таблица и нужно постоянно обновлять ячейки новым значением. Значение приходят из апишки раз в пару десятков милисекунд (какая-то реалтайм статистика к примеру). Значения эти - просто массив данных.

Решение в лоб - каждый раз когда приходят данные, дропать старую таблицу, проходить циклом по массиву и формировать новую. Это куча операций с DOM. У вас каждые n милисекунд будет полностью перестраиваться вся эта штука, дропаться и создаваться новые элементы и все это будет ужасно долго пересчитываться и перерисовываться.

А теперь добавим между всем этим виртуальную апишку, которая запоминает что она там в прошлый раз создала и что надо в этот раз создать. Вы все так же влоб проходите циклом по массиву и просите виртуальный дом построить новую апишку, а виртуальный дом будет стараться переиспользовать то что у него уже есть, ну и все в таком духе. За счет этого получается нефиговый прирост производительности (но есть потери на работу самого виртуального DOM, зато можно фигачить как хочешь).

Если же прослойку эту сделать со своим интерфейсом, можно получить слой абстракции для работы с UI. Именно это предлагает тот же React. Слой абстракции над UI. Вы можете работать с реактом, но UI будет отрисовываться не через DOM а скажем... это может быть нативный интерфейс мобильной платформы (гуглить native-react). Ну и т.д.

Можно использовать strings.Replace

str := "5 000 000 шт"

str2 := strings.Replace(str, " ", "", -1)
// str2 будет содержать: "5000000шт"

Ну на скорую руку я бы все картинки запихнул в css и в итоге это полотно сократилось бы примерно до такого кода:

<div class="faq__question custom-woomen" data-tgl="custom-woomen">Женщине</div>
<div class="faq__answer">....</div>

$(".faq__question").on("click", function(){
  $(this).toggleClass($(this).data("tgl")+" open-class");
});

Или же скорее всего потом подумав снес js код, css оставил и получилось бы такое:

<details>
    <summary>Женщине</summary>
    <p>Избавление от ненужных  стереотипов и комплексов, обретение уверенности в себе, раскрепощение и повышение уровня сексуальности.</p>
</details>

и в css типа такого:

details > summary{
   background: url('кастомная-тетка-дядька.png') left center no-repeat;
}

details[open] > summary{
   background: url('иконка-плюсик-а-ля-open.png') left center no-repeat;
}

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

Часть первая.

Первым делом сохраним элемент, к которому вы обращаетесь больше всего, в отдельную переменную:

$('.faq__question').click(function() {
  $(this).siblings('.faq__answer').slideToggle();
  const icon = $(this).find('.faq__icon');
  const iconSrc = icon.attr('src');

  if (iconSrc == 'imgs/dropdown/dropdown__women.png') {
    iconwomen = iconSrc;
    icon.attr('src', 'imgs/dropdown/dropdown__open.png');
  } else if(iconSrc == 'imgs/dropdown/dropdown__man.png') {
    iconman = iconSrc;
    icon.attr('src', 'imgs/dropdown/dropdown__open.png');
  } else if(iconSrc == 'imgs/dropdown/dropdown__manwomen.png') {
    iconmanwomen = iconSrc;
    icon.attr('src', 'imgs/dropdown/dropdown__open.png');
  } else {
    if (icon.attr('class') == 'faq__icon faq__icon--women') {
      icon.attr('src', iconwomen);
    } else if (icon.attr('class') == 'faq__icon faq__icon--man') {
      icon.attr('src', iconman);
    } else if (icon.attr('class') == 'faq__icon faq__icon--manwomen') {
      icon.attr('src', iconmanwomen);
    }
  }
});

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

var iconman, iconwomen, iconmanwomen;
var icons = ['imgs/dropdown/dropdown__women.png', 'imgs/dropdown/dropdown__man.png', 'imgs/dropdown/dropdown__manwomen.png'];

$('.faq__question').click(function() {
  $(this).siblings('.faq__answer').slideToggle();
  const icon = $(this).find('.faq__icon');
  const iconSrc = icon.attr('src');

  if (icons.includes(iconSrc)) {
    if (iconSrc == 'imgs/dropdown/dropdown__women.png') {
      iconwomen = iconSrc;
      icon.attr('src', 'imgs/dropdown/dropdown__open.png');
    } else if(iconSrc == 'imgs/dropdown/dropdown__man.png') {
      iconman = iconSrc;
      icon.attr('src', 'imgs/dropdown/dropdown__open.png');
    } else if(iconSrc == 'imgs/dropdown/dropdown__manwomen.png') {
      iconmanwomen = iconSrc;
      icon.attr('src', 'imgs/dropdown/dropdown__open.png');
    }
  } else {
    if (icon.attr('class') == 'faq__icon faq__icon--women') {
      icon.attr('src', iconwomen);
    } else if (icon.attr('class') == 'faq__icon faq__icon--man') {
      icon.attr('src', iconman);
    } else if (icon.attr('class') == 'faq__icon faq__icon--manwomen') {
      icon.attr('src', iconmanwomen);
    }
  }
});

Теперь можно вынести повторяемый код:

var iconman, iconwomen, iconmanwomen;
var icons = ['imgs/dropdown/dropdown__women.png', 'imgs/dropdown/dropdown__man.png', 'imgs/dropdown/dropdown__manwomen.png'];

$('.faq__question').click(function() {
  $(this).siblings('.faq__answer').slideToggle();
  const icon = $(this).find('.faq__icon');
  const iconSrc = icon.attr('src');

  if (icons.includes(iconSrc)) {
    if (iconSrc == 'imgs/dropdown/dropdown__women.png') {
      iconwomen = iconSrc;
    } else if(iconSrc == 'imgs/dropdown/dropdown__man.png') {
      iconman = iconSrc;
    } else if(iconSrc == 'imgs/dropdown/dropdown__manwomen.png') {
      iconmanwomen = iconSrc;
    }
    icon.attr('src', 'imgs/dropdown/dropdown__open.png');
  } else {
    let iconOldSrc;
    if (icon.attr('class') == 'faq__icon faq__icon--women') {
      iconOldSrc = iconwomen;
    } else if (icon.attr('class') == 'faq__icon faq__icon--man') {
      iconOldSrc = iconman;
    } else if (icon.attr('class') == 'faq__icon faq__icon--manwomen') {
      iconOldSrc = iconmanwomen);
    }
    icon.attr('src', iconOldSrc);
  }
});

Теперь код стал чище и, за счёт работы с переменными, будет проще находить проблемы. Но всё-равно этот код неоптимален с точки зрения логики. Намного проще хранить состояние в самом объекте:

$('.faq__question').click(function() {
  $(this).siblings('.faq__answer').slideToggle();
  const icon = $(this).find('.faq__icon');
  const iconSrc = icon.attr('src');
  const dataIconSrc = icon.attr('data-src');

  if (!dataIconSrc) {
    icon.attr('data-src', iconSrc);
    icon.attr('src', 'imgs/dropdown/dropdown__open.png');
  } else {
    icon.attr('src', dataIconSrc);
    icon.attr('data-src', null);
  }
});

Теперь если аттрибут `data-src` имеет значение, значит таб открыт.

Часть вторая.

А вообще такие задачи решаются с помощью CSS. Иконку лучше делать блоком с фоновым изображением:

.icon.man {
  background-image: "imgs/dropdown/dropdown__man.png";
}
.icon.woman {
  background-image: "imgs/dropdown/dropdown__woman.png";
}
.icon.manwoman {
  background-image: "imgs/dropdown/dropdown__manwoman.png";
}
.icon.open {
  background-image: "imgs/dropdown/dropdown__open.png";
}

И тогда скрипт будет выглядеть как-то так (я подозреваю, я просто именно с jQuery не люблю работать):

$('.faq__question').click(function() {
  $(this).siblings('.faq__answer').slideToggle();

  $(this).find('.faq__icon').toggleClass("open");
});