\documentclass[10pt,a4paper]{article}

% Packages
\usepackage{fancyhdr}           % For header and footer
\usepackage{multicol}           % Allows multicols in tables
\usepackage{tabularx}           % Intelligent column widths
\usepackage{tabulary}           % Used in header and footer
\usepackage{hhline}             % Border under tables
\usepackage{graphicx}           % For images
\usepackage{xcolor}             % For hex colours
%\usepackage[utf8x]{inputenc}    % For unicode character support
\usepackage[T1]{fontenc}        % Without this we get weird character replacements
\usepackage{colortbl}           % For coloured tables
\usepackage{setspace}           % For line height
\usepackage{lastpage}           % Needed for total page number
\usepackage{seqsplit}           % Splits long words.
%\usepackage{opensans}          % Can't make this work so far. Shame. Would be lovely.
\usepackage[normalem]{ulem}     % For underlining links
% Most of the following are not required for the majority
% of cheat sheets but are needed for some symbol support.
\usepackage{amsmath}            % Symbols
\usepackage{MnSymbol}           % Symbols
\usepackage{wasysym}            % Symbols
%\usepackage[english,german,french,spanish,italian]{babel}              % Languages

% Document Info
\author{BriYvonne01 (briyvonne01)}
\pdfinfo{
  /Title (javascript-algorithmic-cookbook-cheatsheet.pdf)
  /Creator (Cheatography)
  /Author (BriYvonne01 (briyvonne01))
  /Subject (Javascript Algorithmic Cookbook Cheatsheet Cheat Sheet)
}

% Lengths and widths
\addtolength{\textwidth}{6cm}
\addtolength{\textheight}{-1cm}
\addtolength{\hoffset}{-3cm}
\addtolength{\voffset}{-2cm}
\setlength{\tabcolsep}{0.2cm} % Space between columns
\setlength{\headsep}{-12pt} % Reduce space between header and content
\setlength{\headheight}{85pt} % If less, LaTeX automatically increases it
\renewcommand{\footrulewidth}{0pt} % Remove footer line
\renewcommand{\headrulewidth}{0pt} % Remove header line
\renewcommand{\seqinsert}{\ifmmode\allowbreak\else\-\fi} % Hyphens in seqsplit
% This two commands together give roughly
% the right line height in the tables
\renewcommand{\arraystretch}{1.3}
\onehalfspacing

% Commands
\newcommand{\SetRowColor}[1]{\noalign{\gdef\RowColorName{#1}}\rowcolor{\RowColorName}} % Shortcut for row colour
\newcommand{\mymulticolumn}[3]{\multicolumn{#1}{>{\columncolor{\RowColorName}}#2}{#3}} % For coloured multi-cols
\newcolumntype{x}[1]{>{\raggedright}p{#1}} % New column types for ragged-right paragraph columns
\newcommand{\tn}{\tabularnewline} % Required as custom column type in use

% Font and Colours
\definecolor{HeadBackground}{HTML}{333333}
\definecolor{FootBackground}{HTML}{666666}
\definecolor{TextColor}{HTML}{333333}
\definecolor{DarkBackground}{HTML}{A30B76}
\definecolor{LightBackground}{HTML}{F9EFF6}
\renewcommand{\familydefault}{\sfdefault}
\color{TextColor}

% Header and Footer
\pagestyle{fancy}
\fancyhead{} % Set header to blank
\fancyfoot{} % Set footer to blank
\fancyhead[L]{
\noindent
\begin{multicols}{3}
\begin{tabulary}{5.8cm}{C}
    \SetRowColor{DarkBackground}
    \vspace{-7pt}
    {\parbox{\dimexpr\textwidth-2\fboxsep\relax}{\noindent
        \hspace*{-6pt}\includegraphics[width=5.8cm]{/web/www.cheatography.com/public/images/cheatography_logo.pdf}}
    }
\end{tabulary}
\columnbreak
\begin{tabulary}{11cm}{L}
    \vspace{-2pt}\large{\bf{\textcolor{DarkBackground}{\textrm{Javascript Algorithmic Cookbook Cheatsheet Cheat Sheet}}}} \\
    \normalsize{by \textcolor{DarkBackground}{BriYvonne01 (briyvonne01)} via \textcolor{DarkBackground}{\uline{cheatography.com/61413/cs/31853/}}}
\end{tabulary}
\end{multicols}}

\fancyfoot[L]{ \footnotesize
\noindent
\begin{multicols}{3}
\begin{tabulary}{5.8cm}{LL}
  \SetRowColor{FootBackground}
  \mymulticolumn{2}{p{5.377cm}}{\bf\textcolor{white}{Cheatographer}}  \\
  \vspace{-2pt}BriYvonne01 (briyvonne01) \\
  \uline{cheatography.com/briyvonne01} \\
  \end{tabulary}
\vfill
\columnbreak
\begin{tabulary}{5.8cm}{L}
  \SetRowColor{FootBackground}
  \mymulticolumn{1}{p{5.377cm}}{\bf\textcolor{white}{Cheat Sheet}}  \\
   \vspace{-2pt}Published 28th April, 2022.\\
   Updated 30th April, 2022.\\
   Page {\thepage} of \pageref{LastPage}.
\end{tabulary}
\vfill
\columnbreak
\begin{tabulary}{5.8cm}{L}
  \SetRowColor{FootBackground}
  \mymulticolumn{1}{p{5.377cm}}{\bf\textcolor{white}{Sponsor}}  \\
  \SetRowColor{white}
  \vspace{-5pt}
  %\includegraphics[width=48px,height=48px]{dave.jpeg}
  Measure your website readability!\\
  www.readability-score.com
\end{tabulary}
\end{multicols}}




\begin{document}
\raggedright
\raggedcolumns

% Set font size to small. Switch to any value
% from this page to resize cheat sheet text:
% www.emerson.emory.edu/services/latex/latex_169.html
\footnotesize % Small font.

\begin{multicols*}{2}

\begin{tabularx}{8.4cm}{x{2.72 cm} x{5.28 cm} }
\SetRowColor{DarkBackground}
\mymulticolumn{2}{x{8.4cm}}{\bf\textcolor{white}{Involving collections}}  \tn
% Row 0
\SetRowColor{LightBackground}
Two Pointer Technique & Two pointers, each starting from the beginning and the end until they both meet OR One pointer moving at a slow pace, while the other pointer moves at twice the speed \tn 
% Row Count 7 (+ 7)
\hhline{>{\arrayrulecolor{DarkBackground}}--}
\SetRowColor{LightBackground}
\mymulticolumn{2}{x{8.4cm}}{Collections are arrays, string, or linked lists. Other application: searching for pairs in an array, two sorted arrays need to be merged (2 pointers for both arrays), the pattern of using a fast pointer and a slow pointer ( detecting cycles in a linked list)}  \tn 
\hhline{>{\arrayrulecolor{DarkBackground}}--}
\end{tabularx}
\par\addvspace{1.3em}

\begin{tabularx}{8.4cm}{x{1.6 cm} x{6.4 cm} }
\SetRowColor{DarkBackground}
\mymulticolumn{2}{x{8.4cm}}{\bf\textcolor{white}{The Two Heaps Technique}}  \tn
% Row 0
\SetRowColor{LightBackground}
\seqsplit{Scheduling} & find the earliest or latest meeting at any given time \tn 
% Row Count 2 (+ 2)
% Row 1
\SetRowColor{white}
\mymulticolumn{2}{x{8.4cm}}{Finding the median in a large collection.} \tn 
% Row Count 3 (+ 1)
% Row 2
\SetRowColor{LightBackground}
\mymulticolumn{2}{x{8.4cm}}{Largest and smallest values in a set.} \tn 
% Row Count 4 (+ 1)
% Row 3
\SetRowColor{white}
\mymulticolumn{2}{x{8.4cm}}{To implement a priority queue} \tn 
% Row Count 5 (+ 1)
\hhline{>{\arrayrulecolor{DarkBackground}}--}
\end{tabularx}
\par\addvspace{1.3em}

\begin{tabularx}{8.4cm}{X}
\SetRowColor{DarkBackground}
\mymulticolumn{1}{x{8.4cm}}{\bf\textcolor{white}{Binary Search Technique}}  \tn
% Row 0
\SetRowColor{LightBackground}
\mymulticolumn{1}{x{8.4cm}}{Binary search is a technique for finding out whether an item is present in a sorted array or not} \tn 
% Row Count 2 (+ 2)
% Row 1
\SetRowColor{white}
\mymulticolumn{1}{x{8.4cm}}{It makes use of the fact that if a value is greater than array{[}i{]} and the array is sorted, then the value has to lie at index (i+1) or higher. Similarly, if the value is less than array{[}i{]}, then it has to lie at an index less than i.} \tn 
% Row Count 7 (+ 5)
% Row 2
\SetRowColor{LightBackground}
\mymulticolumn{1}{x{8.4cm}}{Binary search works by comparing the value to search for with the middle item of the array. If the value is higher than the middle item, then the search proceeds in the right half of the array. If the value is less than the middle, then the left sub-array is searched. This process is repeated, and each time, the sub-array within which the value is being searched is reduced by half.} \tn 
% Row Count 15 (+ 8)
% Row 3
\SetRowColor{white}
\mymulticolumn{1}{x{8.4cm}}{This gives an overall time complexity of O(log n).} \tn 
% Row Count 17 (+ 2)
\hhline{>{\arrayrulecolor{DarkBackground}}-}
\end{tabularx}
\par\addvspace{1.3em}

\begin{tabularx}{8.4cm}{X}
\SetRowColor{DarkBackground}
\mymulticolumn{1}{x{8.4cm}}{\bf\textcolor{white}{Merge Sort Algorithm}}  \tn
% Row 0
\SetRowColor{LightBackground}
\mymulticolumn{1}{x{8.4cm}}{Divides the input collection into two portions, recursively calls itself for the two divided portions, and then merges the two sorted portions. Merge Sort Algorithm works in three parts:} \tn 
% Row Count 4 (+ 4)
% Row 1
\SetRowColor{white}
\mymulticolumn{1}{x{8.4cm}}{Divide: At first, it divides the given collection of elements into two equal halves and then recursively passes these halves to itself. Sorting: Unless, there is only one element left in each half, the division continues, after that, those two end elements (leaf nodes) are sorted. Merging: Finally, the sorted arrays from the top step are merged in order to form the sorted collection of elements} \tn 
% Row Count 12 (+ 8)
% Row 2
\SetRowColor{LightBackground}
\mymulticolumn{1}{x{8.4cm}}{Time Complexity: O(NlogN)} \tn 
% Row Count 13 (+ 1)
% Row 3
\SetRowColor{white}
\mymulticolumn{1}{x{8.4cm}}{Space Complexity: O(N)} \tn 
% Row Count 14 (+ 1)
\hhline{>{\arrayrulecolor{DarkBackground}}-}
\end{tabularx}
\par\addvspace{1.3em}

\begin{tabularx}{8.4cm}{X}
\SetRowColor{DarkBackground}
\mymulticolumn{1}{x{8.4cm}}{\bf\textcolor{white}{Bubble Sort Algorithm}}  \tn
% Row 0
\SetRowColor{LightBackground}
\mymulticolumn{1}{x{8.4cm}}{The adjacent elements in the collection are compared and the positions are swapped if the first element is greater than the second one. In this way, the largest valued element "bubbles" to the top.} \tn 
% Row Count 4 (+ 4)
% Row 1
\SetRowColor{white}
\mymulticolumn{1}{x{8.4cm}}{Usually, after each loop, the elements furthest to the right are in sorted order. The process is continued until all the elements are in sorted order.} \tn 
% Row Count 7 (+ 3)
% Row 2
\SetRowColor{LightBackground}
\mymulticolumn{1}{x{8.4cm}}{Time Complexity: O(N2)} \tn 
% Row Count 8 (+ 1)
% Row 3
\SetRowColor{white}
\mymulticolumn{1}{x{8.4cm}}{Space Complexity: O(1)} \tn 
% Row Count 9 (+ 1)
\hhline{>{\arrayrulecolor{DarkBackground}}-}
\end{tabularx}
\par\addvspace{1.3em}

\begin{tabularx}{8.4cm}{X}
\SetRowColor{DarkBackground}
\mymulticolumn{1}{x{8.4cm}}{\bf\textcolor{white}{Keeping track of the "balancing"}}  \tn
% Row 0
\SetRowColor{LightBackground}
\mymulticolumn{1}{x{8.4cm}}{When you want to keep track of what's "coming in" or incoming and what's what's "going out" or outgoing} \tn 
% Row Count 3 (+ 3)
\hhline{>{\arrayrulecolor{DarkBackground}}-}
\end{tabularx}
\par\addvspace{1.3em}

\begin{tabularx}{8.4cm}{x{2 cm} x{6 cm} }
\SetRowColor{DarkBackground}
\mymulticolumn{2}{x{8.4cm}}{\bf\textcolor{white}{String methods}}  \tn
% Row 0
\SetRowColor{LightBackground}
length & gets the string length \tn 
% Row Count 1 (+ 1)
% Row 1
\SetRowColor{white}
indexOf() & gets the index of first occurence of the character or a substring in the string. \tn 
% Row Count 4 (+ 3)
% Row 2
\SetRowColor{LightBackground}
\seqsplit{toLowerCase()} & converts the string to lowercase (or similarly, to uppercase). \tn 
% Row Count 7 (+ 3)
% Row 3
\SetRowColor{white}
substring & gets a substring from defined index point in the string. \tn 
% Row Count 9 (+ 2)
\hhline{>{\arrayrulecolor{DarkBackground}}--}
\end{tabularx}
\par\addvspace{1.3em}

\begin{tabularx}{8.4cm}{x{1.36 cm} x{6.64 cm} }
\SetRowColor{DarkBackground}
\mymulticolumn{2}{x{8.4cm}}{\bf\textcolor{white}{Array Methods}}  \tn
% Row 0
\SetRowColor{LightBackground}
pop & removes (pops) the last element of an array \tn 
% Row Count 2 (+ 2)
% Row 1
\SetRowColor{white}
push & method adds new items to the end of an array \tn 
% Row Count 4 (+ 2)
% Row 2
\SetRowColor{LightBackground}
shift & method removes the first item of an array \tn 
% Row Count 6 (+ 2)
% Row 3
\SetRowColor{white}
\seqsplit{unshift} & adds new elements to the beginning of an array \tn 
% Row Count 8 (+ 2)
% Row 4
\SetRowColor{LightBackground}
sort & sorts the elements of an array in alphabetical in ascending order \tn 
% Row Count 10 (+ 2)
% Row 5
\SetRowColor{white}
\seqsplit{filter} & method creates a new array filled with elements that pass a test provided by a function. \seqsplit{array.filter(function(currentValue}, index, arr), thisValue) \tn 
% Row Count 15 (+ 5)
% Row 6
\SetRowColor{LightBackground}
map & creates a new array from calling a function for every array element. \tn 
% Row Count 18 (+ 3)
% Row 7
\SetRowColor{white}
\seqsplit{foreach} & method calls a function for each element in an array. \seqsplit{array.forEach(function(currentValue}, index, arr), thisValue) \tn 
% Row Count 22 (+ 4)
% Row 8
\SetRowColor{LightBackground}
find & method returns the value of the first element that passes a test. \seqsplit{array.find(function(currentValue}, index, arr),thisValue) \tn 
% Row Count 26 (+ 4)
% Row 9
\SetRowColor{white}
\seqsplit{includes} & returns true if an array contains a specified value. \seqsplit{"fruits.includes("Mango");"} \tn 
% Row Count 29 (+ 3)
% Row 10
\SetRowColor{LightBackground}
\seqsplit{reverse} & reverses the order of the elements in an array \tn 
% Row Count 31 (+ 2)
\end{tabularx}
\par\addvspace{1.3em}

\vfill
\columnbreak
\begin{tabularx}{8.4cm}{x{1.36 cm} x{6.64 cm} }
\SetRowColor{DarkBackground}
\mymulticolumn{2}{x{8.4cm}}{\bf\textcolor{white}{Array Methods (cont)}}  \tn
% Row 11
\SetRowColor{LightBackground}
every & executes a function for each array element. returns true/false if the function returns true/false for all elements. \tn 
% Row Count 4 (+ 4)
% Row 12
\SetRowColor{white}
join & method returns an array as a string \tn 
% Row Count 6 (+ 2)
\hhline{>{\arrayrulecolor{DarkBackground}}--}
\end{tabularx}
\par\addvspace{1.3em}

\begin{tabularx}{8.4cm}{X}
\SetRowColor{DarkBackground}
\mymulticolumn{1}{x{8.4cm}}{\bf\textcolor{white}{When to use BFS instead of DFS?}}  \tn
% Row 0
\SetRowColor{LightBackground}
\mymulticolumn{1}{x{8.4cm}}{When you need to find the shortest path between any two nodes in an unweighted graph.} \tn 
% Row Count 2 (+ 2)
% Row 1
\SetRowColor{white}
\mymulticolumn{1}{x{8.4cm}}{If you're solving a problem, and know a solution is not far from the root of the tree, BFS will likely get you there faster.} \tn 
% Row Count 5 (+ 3)
% Row 2
\SetRowColor{LightBackground}
\mymulticolumn{1}{x{8.4cm}}{If the tree is very deep, DFS with heuristics might be faster.} \tn 
% Row Count 7 (+ 2)
\hhline{>{\arrayrulecolor{DarkBackground}}-}
\end{tabularx}
\par\addvspace{1.3em}

\begin{tabularx}{8.4cm}{x{2.64 cm} x{5.36 cm} }
\SetRowColor{DarkBackground}
\mymulticolumn{2}{x{8.4cm}}{\bf\textcolor{white}{Depth First Search (DFS)}}  \tn
% Row 0
\SetRowColor{LightBackground}
Preorder Traversal & We start from the root node and search the tree vertically (top to bottom), traversing from left to right. The order of visits is ROOT-LEFT-RIGHT \tn 
% Row Count 6 (+ 6)
% Row 1
\SetRowColor{white}
In-order Traversal & Start from the leftmost node and move to the right nodes traversing from top to bottom. The order of visits is LEFT-ROOT-RIGHT \tn 
% Row Count 11 (+ 5)
% Row 2
\SetRowColor{LightBackground}
Post-order Traversal & Start from the leftmost node and move to the right nodes, traversing from bottom to top. The order of visits is LEFT-RIGHT-ROOT \tn 
% Row Count 16 (+ 5)
\hhline{>{\arrayrulecolor{DarkBackground}}--}
\SetRowColor{LightBackground}
\mymulticolumn{2}{x{8.4cm}}{In Depth First Search (DFS), a tree is traversed vertically from top to bottom or bottom to top. As you might infer from its namesake, we will traverse as deeply as possible, before moving on to a neighbor node. There are three main ways to apply Depth First Search to a tree.}  \tn 
\hhline{>{\arrayrulecolor{DarkBackground}}--}
\end{tabularx}
\par\addvspace{1.3em}

\begin{tabularx}{8.4cm}{x{5.52 cm} p{2.48 cm} }
\SetRowColor{DarkBackground}
\mymulticolumn{2}{x{8.4cm}}{\bf\textcolor{white}{Time complexity of an array (worst case)}}  \tn
% Row 0
\SetRowColor{LightBackground}
Access & O(1) \tn 
% Row Count 1 (+ 1)
% Row 1
\SetRowColor{white}
Search & O(n) \tn 
% Row Count 2 (+ 1)
% Row 2
\SetRowColor{LightBackground}
Insertion & O(n) \tn 
% Row Count 3 (+ 1)
% Row 3
\SetRowColor{white}
append & O(1) \tn 
% Row Count 4 (+ 1)
% Row 4
\SetRowColor{LightBackground}
Deletion & O(n) \tn 
% Row Count 5 (+ 1)
\hhline{>{\arrayrulecolor{DarkBackground}}--}
\end{tabularx}
\par\addvspace{1.3em}

\begin{tabularx}{8.4cm}{X}
\SetRowColor{DarkBackground}
\mymulticolumn{1}{x{8.4cm}}{\bf\textcolor{white}{Insertion Sort Algorithm}}  \tn
% Row 0
\SetRowColor{LightBackground}
\mymulticolumn{1}{x{8.4cm}}{The collection is virtually split into an ordered and an unordered part. Elements from the unordered portion are picked and placed at the correct index in the ordered part.} \tn 
% Row Count 4 (+ 4)
% Row 1
\SetRowColor{white}
\mymulticolumn{1}{x{8.4cm}}{Time Complexity: O(N2)} \tn 
% Row Count 5 (+ 1)
% Row 2
\SetRowColor{LightBackground}
\mymulticolumn{1}{x{8.4cm}}{Space Complexity: O(1)} \tn 
% Row Count 6 (+ 1)
\hhline{>{\arrayrulecolor{DarkBackground}}-}
\end{tabularx}
\par\addvspace{1.3em}


% That's all folks
\end{multicols*}

\end{document}