为什么JavaScript split（）方法返回一个数组，即使没有分隔符？

Question

我有一个html元素的网格，每个元素都有一个data-category属性。

某些data-category属性具有多个值，以逗号分隔：data-category="category 2, category 3"。

有些具有单个值：data-category="category 1"，没有分隔符。

我使用这个简单的脚本按类别过滤元素：

$('#category-selector').on('change', function(){

  var $item = $('#items-container').find('.item'),

      current = $(this).val();

    if(current == 'all'){

       $item.fadeIn(200);

    } else {

       $item.hide(200);

       $item.each(function(){

          var category = $(this).data('category').split(', ');

          console.log(category);

          if($.inArray(current, category) >= 0){

            $(this).fadeIn(200);

          }

       });

    }

});

.posts-grid {

  margin-top: 25px;

}

.posts-grid>[class*='col-'] {

  display: flex;

  flex-direction: column;

  margin-bottom: 25px;

}

.posts-grid .block {

  background: #fff;

  border-top: 1px solid #d5d5d5;

  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.11);

}

.posts-grid p {

  margin: 0;

  text-align: center;

}

.posts-grid .block {

  flex-grow: 1;

  display: flex;

  justify-content: center;

  flex-direction: column;

}

.posts-grid .read-more {

  margin-top: auto;

}

@media (max-width: 767px) {

  .container {

    max-width: 100%;

  }

}

@media (max-width: 575px) {

  .container {

    max-width: 100%;

    padding-left: 0;

    padding-right: 0;

  }

  .posts-grid>[class*='col-'] {

    padding-left: 5px;

    padding-right: 5px;

  }

}

令我感到惊讶的是，即使没有分隔符，我的split(', ')方法也会返回一个数组。

问题：

1. 为什么会这样？

2. 我的过滤器可靠吗？