.sort and  .pop
Published: 2020-07-20 16:32:19

`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

~~~js 
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:

~~~js
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: 

~~~js
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: 

~~~js
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:

~~~js

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:

~~~js
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):

~~~js
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.