Shopify tags rewritten from groups in the tags

shopify-tags.js

const tags = {};

// const initialTags = "color_brown color_black type_dress-shoes type_shoes";

{% if collection.all_tags.size > 0 %}
const initialTags = {{ collection.all_tags | split: ' ' }};
{% endif %}

// console.log(array);
const splitTags = initialTags.split(" ");
// console.log(arraySplit);
console.log(splitTags.length);

for (var i = 0; i < splitTags.length; i++) {
  // console.log(arraySplit[i])
  const item = splitTags[i].split("_");
  // console.log(item[1]);

  const item0 = item[0];
  // const item1 = item[1].replace(/-/g, ' ');
  const item1 = item[1];

  // if tag exists in object append new value
  if ( tags[ item0 ] !== undefined ) {
    tags[ item0 ].push( item1 );
  }
  // if tag doesn't exist add tag to object and apply new value
  else {
    tags[ item0 ] = [];
    tags[ item0 ].push( item1 );
  }

}

// console.log(tags);
String.prototype.ucfirst = function() {
  return this.replace(/\w\S*/g, function(txt){
    return txt.charAt(0).toUpperCase() + txt.substr(1).toLowerCase();
  });
}


for (var key in tags) {
    // skip loop if the property is from prototype
    if (!tags.hasOwnProperty(key)) continue;

    var obj = tags[key];

    var group_name = key.ucfirst();

    $( ".objects" ).append('<h2>'+group_name+'</h2><select id="tags_'+group_name+'"><option value="all">All</option></select>');

    for (var prop in obj) {
        // skip loop if the property is from prototype
        if(!obj.hasOwnProperty(prop)) continue;

        var name = obj[prop].replace(/-/g, ' ').ucfirst();
        var value = obj[prop];

        // your code
        console.log(obj[prop]);
        $( '#tags_'+group_name ).append( '<option value="'+ key + "_" + value +'">' + name + '</option>' );
    }
}