.sort and .pop

Javascript has a variety of built-in Array methods that empower the developer to bend and shape huge amount of data at his will. From very simple like .length or .push to more complex, like .reduce or .every. We will take a look at a look at .pop and .sort methods.

Array.prototype.pop()

Array.prototype.pop() cuts the last element of the array and brings it back to you

const fruits = ["Banana", "Orange", "Apple", "Mango"];

alert(fruits); // ["Banana", "Orange", "Apple", "Mango"]

const popped = fruits.pop();

console.log(fruits);  // ["Banana", "Orange", "Apple"]

console.log(popped); // "Mango"

It is a very simple and straightforward method, however you always have to keep in mind that .pop method mutates the initial array and it can lead to a potential bug in the future, if you are using this method without awarness.

Array.prototype.sort()

Array.prototype.sort() ,whenever invoked, sorts the array in the alphabetical order, according to UTF-16 standard:

const myArray = ["Bob", "Bully", "Amy"]
myArray.sort() // myArray becomes ["Amy", "Bob", "Bully"]
console.log(myArray)

Given the number the sort method will treat them as a string and will still sort them in "alphabetical" order and not by the value of the number:

const myArray=[7, 40, 300]
myArray.sort()
console.log(myArray) //  myArray becomes [300,40,7]

This happens because Javascript sorts the array in the lexicographical order and it deems that 300 as a string comes before '40' and '7' because in lexicographical order '3' comes before '4' and '0' is just an extension.

To get the results that we need with numbers we have to pass in a sorting function as an argument to .sort method:

function sortfunction(a, b){
  return (a — b)
}

This function compares two adjacent elements by subtracting the second from the first. There are three possible outcomes: '0', '<0' and '>0'. If the outcomes equals to zero it means that the elements are equal and no swapping required. If the outcome is greater than zero than swapping is required because element a is greater than element b. If the outcome is negative that means that the elements are already in order and the swapping is not required:

const myArray = [25, 8, 7, 41]
myArray.sort(function(a,b){ 
  return a — b
}) 
console.log(myArray) //  myArray will be[7, 8, 25, 41]

However, the sort method would not have much of a use if we could sort only simple arrays consisting of Strings and Numbers. Luckily, we can use .sort method to sort complex data, like an array of objects. Say we have an array of employees with their names and retired data:

const employees=[]
employees[0] = {name: "George", age: 32, retiredate: "March 12, 2014"}
employees[1] = {name: "Edward", age: 17, retiredate: "June 2, 2023"}
employees[2] = {name: "Christine", age: 58, retiredate: "December 20, 2036"}
employees[3] = {name: "Sarah", age: 62, retiredate: "April 30, 2020"}

We can sort our employees by any property, all we have to do is pass the property as an element in our comparing function. Lets sort them by their age (which is a little bit questionable form the "political correctness" point):

employees.sort(function(a, b){
  return a.age-b.age
})

console.log(employees)

/**[
  { name: 'Edward', age: 17, retiredate: 'June 2, 2023' },
  { name: 'George', age: 32, retiredate: 'March 12, 2014' },
  { name: 'Christine', age: 58, retiredate: 'December 20, 2036' },
  { name: 'Sarah', age: 62, retiredate: 'April 30, 2020' }
]*/

We can see that "Edward" and "George" changed their places in the array according to their age. Should you ever want to sort the array in the opposite order, all you have to do is apply .reverse method on the sorted array.

.sort method is a powerful tool when dealing with the data, however you should keep in mind that it is a mutating method and will change the initial array.