Sort version strings inside an array the OOP-way

The example shows a version class capable of sorting an array holding version strings with more than one dot.

by Sascha

HTML

<div id="original">
  <h3>
  Original
  </h3>
  <span></span>
</div>

<div id="sorted">
  <h3>
    Resorted
  </h3>
  Ascending: <span class="asc"></span>
  <br /> Descending: <span class="desc"></span>
</div>

CSS

body {
  background: #20262E;
  padding: 20px;
  font-family: Helvetica, sans-serif;
}

#original,
#sorted {
  display: inline-block;
  background-color: #fff;
  width: 80%;
  padding: 20px;
  margin: 20px auto;
}

JavaScript

var VersionSorter = function() {
  var _self = this;
  _self.elementLength = 4;

  // #region Public Methods

  /* Change the max length for each element of the version string */
  _self.changeElementLength = function(number) {
    _self.elementLength = number;
  }

  /* Returns a sorted version array, optionally with a sort direction */
  _self.sort = function(array, direction) {
    var directionIndex = direction === 'desc' ? -1 : 1;
    array.sort(function(prev, curr) {
      prevConverted = convertVersionString(prev);
      currConverted = convertVersionString(curr);
      if (prevConverted > currConverted) {
        return (1 * directionIndex);
      } else if (prevConverted < currConverted) {
        return (-1 * directionIndex);
      }
      return 0;
    });
    return array;
  }

  // #endregion Public Methods

  // #region Private Methods

  /*
  Convert the version field to a string for sorting purposes
  */
  var convertVersionString = function(version) {

    var arrParts = version.split(".");
    if (arrParts.length > 0) {
      var resultString = arrParts[0] + '.';
      for (var i = 1; i < arrParts.length; i++) {
        resultString += '0'.repeat(_self.elementLength - arrParts[i].length) + arrParts[i];
      }
      return resultString;
    }
    return 0;
  }
  // #endregion Private Methods

}

var arrVersion = [
  '1.5.12.5', '2.0.4', '1.8.6', '1.6.301.700', '1.6.304.2'
];

versionSorter = new VersionSorter();

$('#original span').text(arrVersion.join(', '));

$('#sorted .asc').text(versionSorter.sort(arrVersion).join(', '));
$('#sorted .desc').text(versionSorter.sort(arrVersion, 'desc').join(', '));