functional js snippets

functionalSnippets.js

const overlay = (element) => {
  const newElement = document.createElement(element);
  newElement.style.height = '100vh';
  return newElement;
};

const onEvent = (inputType, DOMElement, callback) => {
  if (DOMElement.addEventListener){
    DOMElement.addEventListener(inputType, callback);
  }
  else {
    DOMElement.attachEvent(`on${inputType}`, () => {
      callback.call(DOMElement); 
    });
  }
};

const offEvent = (inputType, DOMElement, callback) => {
  if (DOMElement.removeEventListener){
    DOMElement.removeEventListener(inputType, callback);
  }
  else {
    DOMElement.detachEvent(`on${inputType}`, callback);
  }
};

const employeeInfo = (name, age, jobTitle) => ({
  name,
  age,
  jobTitle
});

// Destructured object parameters
function shipmentES5Defaults(params) {
  params = params === undefined ? {} : params;
  var items = params.items === undefined ? 'bananas' : params.items;
  var number = params.number === undefined ? 5 : params.number;
  var pkg = params.pkg === undefined ? 'crates' : params.pkg;
  console.log('We have a shipment of ' + items + ' in ' + number + ' ' + pkg + '.');
}

function shipmentES6({items = 'bananas', number = 5, package = 'boxes'} = {}){
  console.log(`We have a shipment of ${items} in ${number} ${package}.`);
};

// function composition
const operators = {
  add: function(x, y) {return x + y;},
  subtract: function(x, y) {return x - y;},
  multiply: function(x, y) {return x * y},
  divide: function(x, y) {return x / y}
};

function operate(operation, operand1, operand2) {
  if (typeof operators[operation] === 'function') {
    return operators[operation](operand1, operand2);
  }
  else {
    throw 'unknown operator';
  }
};

var result = operate('add', 'hello', operate('add', ' ', 'world'));

// ES5
function addOne(x) {
  return x + 1;
}

function timesTwo(x) {
  return x * 2;
}

function compose(f1, f2) {
  return function(value) {
    return f1(f2(value));
  }
}

var addOneTimesTwo = compose(timesTwo, addOne);

// ES6
function addOne(x) {
  return x + 1;
}

function timesTwo(x) {
  return x * 2;
}

var addOneTimesTwo = x => timesTwo(addOne(x));

// Return a unique array
function uniqueArr(arr) {
  return arr.filter(function(item, index, arr) {
    return arr.indexOf(item) == index;
  });
}

// Queues

function Queue() {
  const collection = [];
  this.print = function() {
    console.log(collection);
  };
  this.enqueue = function(element) {
    collection.push(element);
  };
  this.dequeue = function() {
    return collection.shift();
  };
  this.front = function() {
    return collection[0];
  };
  this.size = function() {
    return collection.length;
  };
  this.isEmpty = function() {
    return (collection.length === 0);
  };
}
// const queue = new Queue();

function PriorityQueue() {
  const collection = [];
  this.printCollection = function() {
    console.log(collection);
  };
  this.enqueue = function(element) {
    if (this.isEmpty()) {
      collection.push(element);
    } else {
      let added = false;
      for (let i = 0; i < collection.length; i++) {
        if (element[1] < collection[i][1]) {
          collection.splice(i, 0, element);
		  added = true;
		  break;
        }
      }
	  if (!added) {
        collection.push(element);
      }
    }
  };
  this.dequeue = function() {
    const value = collection.shift();
    return value[0];
  };
  this.front = function() {
    return collection[0];
  };
  this.size = function() {
    return collection.length;
  };
  this.isEmpty = function() {
    return collection.length === 0;
  };
}
// const priorityQueue = new PriorityQueue();
// priorityQueue.enqueue(['bar', 2]);
// priorityQueue.enqueue(['baz', 3]);
// priorityQueue.enqueue(['foo', 1]);

function Stack() {
  this.count = 0;
  this.storage = {};

  // Adds value onto the the end of the stack
  this.push = function(value) {
    this.storage[this.count] = value;
    this.count++;
  };

  // Removes and returns the value at the end of the stack
  this.pop = function() {
    if (this.count === 0) {
      return undefined;
    }
    this.count--;
    const result = this.storage[this.count];
    delete this.storage[this.count];
    return result;
  };

  this.size = function() {
    return this.count;
  };

  // Returns the value at the end of the stack
  this.peek = function() {
    return this.storage[this.count - 1];
  };
}
// const newStack = new Stack();
// newStack.push(1);
// newStack.push(2);
// newStack.count;
// newStack.pop();
// newStack.count;

// Recursion Examples: https://www.youtube.com/watch?v=k7-N8R0-KY4
// Recursion is just a function that calls itselsf until it doesn't

var categories = [
  {id: 'animals', parent: null},
  {id: 'mammals', parent: 'animals'},
  {id: 'cats', parent: 'mammals'},
  {id: 'dogs', parent: 'mammals'},
  {id: 'chihuahua', parent: 'dogs'},
  {id: 'labrador', parent: 'dogs'},
  {id: 'persian', parent: 'cats'},
  {id: 'siamese', parent: 'cats'}
];

function makeTree(categories, parent) {
  var node = {};
  categories.filter((c) => c.parent === parent)
    .forEach((c) => node[c.id] = makeTree(categories, c.id));
  return node;
}
makeTree(categories, null)

// Unique array items
function uniqueArr(arr) {
  return arr.filter(function(item, index, thisArr) {
    return thisArr.indexOf(item) === index;
  });
}

const filterArrayDuplicates = (arr, key) => {
    const uniqueArr = []
    const tempCache = {}
    // Loop through given array & use key as an id for each item
    // Overwriting duplicate ids in tempCache
    for (let i in arr) {
        const id = arr[i][key]
        tempCache[id] = arr[i]
    }
    // Loop through tempCache and update uniqueArr
    for (let i in tempCache) {
        uniqueArr.push(tempCache[i])
    }
    return uniqueArr
}

// http://javascriptissexy.com/understand-javascript-callback-functions-and-use-them/
// https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Function/call
// http://hangar.runway7.net/javascript/difference-call-apply
// https://css-tricks.com/new-favorite-es6-toy-destructured-objects-parameters/
// https://www.sitepoint.com/function-composition-building-blocks-for-maintainable-code/
// https://coderwall.com/p/nilaba/simple-pure-javascript-array-unique-method-with-5-lines-of-code
// https://gist.github.com/telekosmos/3b62a31a5c43f40849bb
// https://www.youtube.com/watch?v=bK7I79hcm08
// https://www.youtube.com/watch?v=Gj5qBheGOEo
// https://coderwall.com/p/nilaba/simple-pure-javascript-array-unique-method-with-5-lines-of-code
// https://www.geeksforgeeks.org/how-to-remove-duplicates-from-an-array-of-objects-using-javascript/