\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{PavelChe}
\pdfinfo{
  /Title (javascript-array-api.pdf)
  /Creator (Cheatography)
  /Author (PavelChe)
  /Subject (JavaScript Array API 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}{E36052}
\definecolor{LightBackground}{HTML}{FDF5F4}
\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 Array API Cheat Sheet}}}} \\
    \normalsize{by \textcolor{DarkBackground}{PavelChe} via \textcolor{DarkBackground}{\uline{cheatography.com/31265/cs/11818/}}}
\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}PavelChe \\
  \uline{cheatography.com/pavelche} \\
  \end{tabulary}
\vfill
\columnbreak
\begin{tabulary}{5.8cm}{L}
  \SetRowColor{FootBackground}
  \mymulticolumn{1}{p{5.377cm}}{\bf\textcolor{white}{Cheat Sheet}}  \\
   \vspace{-2pt}Published 14th May, 2017.\\
   Updated 14th May, 2017.\\
   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{tabularx}{17.67cm}{x{8.635 cm} x{8.635 cm} }
\SetRowColor{DarkBackground}
\mymulticolumn{2}{x{17.67cm}}{\bf\textcolor{white}{Методы массивов (простые)}}  \tn
% Row 0
\SetRowColor{LightBackground}
arr.indexOf(arg); & Находит индекс первого \seqsplit{найденного} элемента в массиве \tn 
% Row Count 5 (+ 5)
% Row 1
\SetRowColor{white}
\seqsplit{arr.lastIndexOf(arg);} & Находит индекс \seqsplit{последнего} \seqsplit{найденного} элемента в массиве \tn 
% Row Count 11 (+ 6)
% Row 2
\SetRowColor{LightBackground}
\seqsplit{Примечание} .index и lastIndex & Если не нашло элемент - \seqsplit{возвращает} -1 \tn 
% Row Count 15 (+ 4)
% Row 3
\SetRowColor{white}
arr{[}arr.length - 1{]}; & Найти последний эл-т массива \tn 
% Row Count 18 (+ 3)
% Row 4
\SetRowColor{LightBackground}
arr{[}arr.length{]} = el; & Добавить эл-т в конец массива \tn 
% Row Count 21 (+ 3)
% Row 5
\SetRowColor{white}
delete arr{[}3{]}; & Удаляет элемент, но оставляет дырку (undefined) \tn 
% Row Count 25 (+ 4)
% Row 6
\SetRowColor{LightBackground}
x = arr.splice(3, 1); & Вырезаем часть массива где первый аргумент - это индекс начала, а второй - \seqsplit{показывает} кол-во элементов (вправо), которые мы хотим вырезать (исходный массив будет изменен) \tn 
% Row Count 41 (+ 16)
\end{tabularx}
\par\addvspace{1.3em}

\begin{tabularx}{17.67cm}{x{8.635 cm} x{8.635 cm} }
\SetRowColor{DarkBackground}
\mymulticolumn{2}{x{17.67cm}}{\bf\textcolor{white}{Методы массивов (простые) (cont)}}  \tn
% Row 7
\SetRowColor{LightBackground}
x = arr.splice(-1, 1); & Вырезаем часть массива где первый аргумент - это индекс начала (с конца), а второй - \seqsplit{показывает} кол-во элементов (вправо), которые мы хотим вырезать (исходный массив будет изменен) \tn 
% Row Count 17 (+ 17)
% Row 8
\SetRowColor{white}
x = arr.splice(a, b, args); & Если передать еще аргументы (args), то они будут вставлены на место \seqsplit{вырезанных}. \tn 
% Row Count 24 (+ 7)
% Row 9
\SetRowColor{LightBackground}
x = arr.slice(3, 4); & Копирует часть массива, не изменяя исходный. Первый аргумент начало фрагмента \seqsplit{(включительно)}, второй аргумент - конец фрагмента (не \seqsplit{включительно)} \tn 
% Row Count 38 (+ 14)
\end{tabularx}
\par\addvspace{1.3em}

\begin{tabularx}{17.67cm}{x{8.635 cm} x{8.635 cm} }
\SetRowColor{DarkBackground}
\mymulticolumn{2}{x{17.67cm}}{\bf\textcolor{white}{Методы массивов (простые) (cont)}}  \tn
% Row 10
\SetRowColor{LightBackground}
x = arr.slice(-3, -1); & Копирует часть массива, не изменяя исходный. Первый аргумент начало фрагмента \seqsplit{(включительно} c конца), второй аргумент - конец фрагмента (не \seqsplit{включительно} с конца) \tn 
% Row Count 15 (+ 15)
% Row 11
\SetRowColor{white}
x = arr.slice(3); & Копирует все после эл-та под индексом 3 \seqsplit{(включительно)} \tn 
% Row Count 20 (+ 5)
% Row 12
\SetRowColor{LightBackground}
arr.push(args); & Добавить эл-ты в конец массива \tn 
% Row Count 23 (+ 3)
% Row 13
\SetRowColor{white}
arr.pop(); & Вырезает последний эл-т массива \tn 
% Row Count 26 (+ 3)
% Row 14
\SetRowColor{LightBackground}
arr.unshift('h','y'); & Добавить эл-ты в нач массива \tn 
% Row Count 29 (+ 3)
% Row 15
\SetRowColor{white}
arr.shift(); & Вырезает первый эл-т массива \tn 
% Row Count 32 (+ 3)
\end{tabularx}
\par\addvspace{1.3em}

\begin{tabularx}{17.67cm}{x{8.635 cm} x{8.635 cm} }
\SetRowColor{DarkBackground}
\mymulticolumn{2}{x{17.67cm}}{\bf\textcolor{white}{Методы массивов (простые) (cont)}}  \tn
% Row 16
\SetRowColor{LightBackground}
arr.reverse() & \seqsplit{Перевернуть} массив \tn 
% Row Count 2 (+ 2)
\hhline{>{\arrayrulecolor{DarkBackground}}--}
\SetRowColor{LightBackground}
\mymulticolumn{2}{x{17.67cm}}{arr.length - длина массива (св-во)}  \tn 
\hhline{>{\arrayrulecolor{DarkBackground}}--}
\end{tabularx}
\par\addvspace{1.3em}

\begin{tabularx}{17.67cm}{X}
\SetRowColor{DarkBackground}
\mymulticolumn{1}{x{17.67cm}}{\bf\textcolor{white}{Сортировка .sort(callback);}}  \tn
\SetRowColor{LightBackground}
\mymulticolumn{1}{x{17.67cm}}{var array = {[}1, 3, 2, 15, 8, 7{]}; \newline  \newline array.sort(function(a, b) \{ \newline                 if (a \textgreater{} b) \{ \newline   	           return 1; \newline                 \} else if (a \textless{} b) \{ \newline   	           return -1; \newline                 \} \newline \}); \newline                                                    // Результат:  {[}1, 2, 3, 7, 8, 15{]};} \tn 
\hhline{>{\arrayrulecolor{DarkBackground}}-}
\SetRowColor{LightBackground}
\mymulticolumn{1}{x{17.67cm}}{a и b - сравниваемые числа \newline (Изменяет исходный массив)}  \tn 
\hhline{>{\arrayrulecolor{DarkBackground}}-}
\end{tabularx}
\par\addvspace{1.3em}

\begin{tabularx}{17.67cm}{X}
\SetRowColor{DarkBackground}
\mymulticolumn{1}{x{17.67cm}}{\bf\textcolor{white}{Перебор .forEach(callback)}}  \tn
\SetRowColor{LightBackground}
\mymulticolumn{1}{x{17.67cm}}{var arr = {[}'Яблоко', 'Апельсин', 'Груша'{]}; \newline  \newline arr.forEach(function(item, i, arr) \{ \newline                    console.log( i + ' : ' + item + ' : ' + arr); \newline                   \}); \newline                                                    // Результат:  Выведет поочередно эл-ты в  \newline                                                       консоль;} \tn 
\hhline{>{\arrayrulecolor{DarkBackground}}-}
\SetRowColor{LightBackground}
\mymulticolumn{1}{x{17.67cm}}{Производится перебор массива \newline item - элемент, i - индекс (счетчик), arr - перебираемый массив \newline (Не изменяет исходный массив)}  \tn 
\hhline{>{\arrayrulecolor{DarkBackground}}-}
\end{tabularx}
\par\addvspace{1.3em}

\begin{tabularx}{17.67cm}{X}
\SetRowColor{DarkBackground}
\mymulticolumn{1}{x{17.67cm}}{\bf\textcolor{white}{Фильтр .filter(callback)}}  \tn
\SetRowColor{LightBackground}
\mymulticolumn{1}{x{17.67cm}}{var arr = {[}1, -1, 2, -2, 3{]}; \newline  \newline var positiveArr = arr.filter(function(num) \{ \newline 	return num \textgreater{} 0; // вернет только \seqsplit{положительные} числа \newline \}); \newline  \newline                                                    // Результат: positiveArr = {[}1, 2, 3{]};} \tn 
\hhline{>{\arrayrulecolor{DarkBackground}}-}
\SetRowColor{LightBackground}
\mymulticolumn{1}{x{17.67cm}}{Если return возвращает true - то item включен в новый массив \newline item - элемент, i - индекс (счетчик), arr - перебираемый массив \newline (не изменяет исходный массив)}  \tn 
\hhline{>{\arrayrulecolor{DarkBackground}}-}
\end{tabularx}
\par\addvspace{1.3em}

\begin{tabularx}{17.67cm}{X}
\SetRowColor{DarkBackground}
\mymulticolumn{1}{x{17.67cm}}{\bf\textcolor{white}{\seqsplit{Трансформация} .map(callback);}}  \tn
\SetRowColor{LightBackground}
\mymulticolumn{1}{x{17.67cm}}{var arr = {[}5, 1, 12, 75, 22{]}; \newline  \newline var arr2 = arr.map(function(item) \{ \newline 	return item * item; \newline \}); \newline                                                    // Результат: {[}25, 1, 144, 5625, 484{]}  \newline                                                       (Возвели в квадрат)} \tn 
\hhline{>{\arrayrulecolor{DarkBackground}}-}
\SetRowColor{LightBackground}
\mymulticolumn{1}{x{17.67cm}}{\seqsplit{Трансформирует} массив в новый исходя из переданного в return \newline item - элемент, i - индекс (счетчик), arr - перебираемый массив \newline (не изменяет исходный массив)}  \tn 
\hhline{>{\arrayrulecolor{DarkBackground}}-}
\end{tabularx}
\par\addvspace{1.3em}

\begin{tabularx}{17.67cm}{X}
\SetRowColor{DarkBackground}
\mymulticolumn{1}{x{17.67cm}}{\bf\textcolor{white}{.compare(callback) и .some(callback)}}  \tn
\SetRowColor{LightBackground}
\mymulticolumn{1}{x{17.67cm}}{var arr = {[}1, -1, 3, -2, 2{]}; \newline  \newline var result = a.every(function (item, i, arr) \{ \newline 		return item \textgreater{} 0; \newline \}); \newline  \newline var result2 = a.some(function (item, i, arr) \{ \newline 		return item \textgreater{} 0; \newline \});} \tn 
\hhline{>{\arrayrulecolor{DarkBackground}}-}
\SetRowColor{LightBackground}
\mymulticolumn{1}{x{17.67cm}}{.every() - в result вернет false. Если return вернет true для всех эл-тов массива, то в переменную вернется true \newline .some() - в result2 вернет true. Если return вернет true хотя-бы для одного эл-та массива, то в переменную вернется true \newline item - элемент, i - индекс (счетчик), arr - перебираемый массив}  \tn 
\hhline{>{\arrayrulecolor{DarkBackground}}-}
\end{tabularx}
\par\addvspace{1.3em}

\begin{tabularx}{17.67cm}{X}
\SetRowColor{DarkBackground}
\mymulticolumn{1}{x{17.67cm}}{\bf\textcolor{white}{.reduce(callback, num)}}  \tn
\SetRowColor{LightBackground}
\mymulticolumn{1}{x{17.67cm}}{var arr = {[}1, 2, 3, 4, 5{]}; \newline  \newline var result = \seqsplit{arr.reduce(function(previousValue}, currentItem, i, arr) \{ \newline   return previousValue + currentItem; \newline \}, 0);               \newline                          // Второй аргумент (число) - значение previousValue для  \newline                             первой итерации (по умолч = 0); \newline  \newline                          // Результат: result = 15;} \tn 
\hhline{>{\arrayrulecolor{DarkBackground}}-}
\SetRowColor{LightBackground}
\mymulticolumn{1}{x{17.67cm}}{Применяет функцию callback по очереди к каждому элементу массива \seqsplit{слева-направо}, сохраняя при этом \seqsplit{промежуточный} результат. \newline previousValue – \seqsplit{промежуточный} результат, currentItem – текущий эл-т, i - индекс (счетчик), arr - перебираемый массив. \newline .reduceRight(callback, num) - перебирает \seqsplit{справа-налево}}  \tn 
\hhline{>{\arrayrulecolor{DarkBackground}}-}
\end{tabularx}
\par\addvspace{1.3em}



\end{document}