\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{LeiQ (amethystlei)}
\pdfinfo{
  /Title (javascript-array-string-and-regexp.pdf)
  /Creator (Cheatography)
  /Author (LeiQ (amethystlei))
  /Subject (JavaScript Array, String and RegExp 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}{6310A3}
\definecolor{LightBackground}{HTML}{F5F0F9}
\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, String and RegExp Cheat Sheet}}}} \\
    \normalsize{by \textcolor{DarkBackground}{LeiQ (amethystlei)} via \textcolor{DarkBackground}{\uline{cheatography.com/27322/cs/7820/}}}
\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}LeiQ (amethystlei) \\
  \uline{cheatography.com/amethystlei} \\
  \end{tabulary}
\vfill
\columnbreak
\begin{tabulary}{5.8cm}{L}
  \SetRowColor{FootBackground}
  \mymulticolumn{1}{p{5.377cm}}{\bf\textcolor{white}{Cheat Sheet}}  \\
   \vspace{-2pt}Published 30th September, 2020.\\
   Updated 19th October, 2020.\\
   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*}{3}

\begin{tabularx}{5.377cm}{p{0.64701 cm} x{4.32999 cm} }
\SetRowColor{DarkBackground}
\mymulticolumn{2}{x{5.377cm}}{\bf\textcolor{white}{Create an Array}}  \tn
% Row 0
\SetRowColor{LightBackground}
\mymulticolumn{2}{x{5.377cm}}{{\bf{By literal way}}} \tn 
% Row Count 1 (+ 1)
% Row 1
\SetRowColor{white}
\mymulticolumn{2}{x{5.377cm}}{{[}{\emph{element0}}, {\emph{element1}}, ..., {\emph{elementN}}{]} \{\{nl\}\}new Array({\emph{element0}}, {\emph{element1}}{[}, ...{[}, {\emph{elementN}}{]}{]}) \{\{nl\}\}new Array({\emph{arrayLength}})} \tn 
% Row Count 4 (+ 3)
% Row 2
\SetRowColor{LightBackground}
\mymulticolumn{2}{x{5.377cm}}{{\bf{By using the result of a math}}} \tn 
% Row Count 5 (+ 1)
% Row 3
\SetRowColor{white}
\mymulticolumn{2}{x{5.377cm}}{an array is returned by \{\{nl\}\} - RegExp.exec \{\{nl\}\} - String.match \{\{nl\}\} - String.replace} \tn 
% Row Count 7 (+ 2)
% Row 4
\SetRowColor{LightBackground}
\mymulticolumn{2}{x{5.377cm}}{{\bf{By using Methods}}} \tn 
% Row Count 8 (+ 1)
% Row 5
\SetRowColor{white}
\mymulticolumn{2}{x{5.377cm}}{Array.from(arrayLike{[}, mapFn{[}, thisArg{]}{]})} \tn 
% Row Count 9 (+ 1)
% Row 6
\SetRowColor{LightBackground}
~ & an array-like object (object with a `length` property and indexed elements, such as `arguements`) or iterable object (object where you can get its elements, such as `Map` and `Set`). \tn 
% Row Count 15 (+ 6)
% Row 7
\SetRowColor{white}
\mymulticolumn{2}{x{5.377cm}}{Array.of({\emph{element0}}{[}, {\emph{element1}}{[}, ...{[}, {\emph{elementN}}{]}{]}{]})} \tn 
% Row Count 17 (+ 2)
% Row 8
\SetRowColor{LightBackground}
 & Every argument is considered as an element in the array. \tn 
% Row Count 19 (+ 2)
\hhline{>{\arrayrulecolor{DarkBackground}}--}
\SetRowColor{LightBackground}
\mymulticolumn{2}{x{5.377cm}}{`Array.from` and `Array.of` work like `Array` constructor to create an new array.}  \tn 
\hhline{>{\arrayrulecolor{DarkBackground}}--}
\end{tabularx}
\par\addvspace{1.3em}

\begin{tabularx}{5.377cm}{p{0.4577 cm} x{1.96811 cm} x{2.15119 cm} }
\SetRowColor{DarkBackground}
\mymulticolumn{3}{x{5.377cm}}{\bf\textcolor{white}{Array instance mutator methods}}  \tn
% Row 0
\SetRowColor{LightBackground}
\mymulticolumn{3}{x{5.377cm}}{copyWithin({\emph{target}}, {\emph{start}}{[}, {\emph{end}} = this.length{]})} \tn 
% Row Count 2 (+ 2)
% Row 1
\SetRowColor{white}
~ & {\bf{target}} & Target start index \tn 
% Row Count 4 (+ 2)
% Row 2
\SetRowColor{LightBackground}
 & {\bf{start}} & Source start index, if it is negative, treated as `length + start` \tn 
% Row Count 8 (+ 4)
% Row 3
\SetRowColor{white}
\mymulticolumn{3}{x{5.377cm}}{fill({\emph{value}}{[}, {\emph{start}} = 0{[}, {\emph{end}} = this.length{]}{]})} \tn 
% Row Count 10 (+ 2)
% Row 4
\SetRowColor{LightBackground}
 & {\bf{value}} & Value to fill an array \tn 
% Row Count 12 (+ 2)
% Row 5
\SetRowColor{white}
\mymulticolumn{3}{x{5.377cm}}{sort({[}{\emph{compareFunction}}{]})} \tn 
% Row Count 13 (+ 1)
% Row 6
\SetRowColor{LightBackground}
 & function compare(a, b) \{ \{\{nl\}\} ~ ~if (a less than b, or a should be in front of b) \{return -1;\}  \{\{nl\}\} ~ ~ if (a is greater than b or be behind of b) \{return 1;\} \{\{nl\}\}  ~~ return 0; // a must be equal to b \{\{nl\}\}\} &  \tn 
% Row Count 28 (+ 15)
% Row 7
\SetRowColor{white}
\mymulticolumn{3}{x{5.377cm}}{splice({\emph{start}}, {\emph{deleteCount}}{[}, {\emph{item1}}{[}, {\emph{item2}}{[}, ...{]}{]}{]})} \tn 
% Row Count 30 (+ 2)
\end{tabularx}
\par\addvspace{1.3em}

\vfill
\columnbreak
\begin{tabularx}{5.377cm}{p{0.4577 cm} x{1.96811 cm} x{2.15119 cm} }
\SetRowColor{DarkBackground}
\mymulticolumn{3}{x{5.377cm}}{\bf\textcolor{white}{Array instance mutator methods (cont)}}  \tn
% Row 8
\SetRowColor{LightBackground}
 & {\bf{start}} & Index at which to start changing the array. If greater than the length, will set to length; if negative, will begin from the end. \tn 
% Row Count 8 (+ 8)
% Row 9
\SetRowColor{white}
 & {\bf{deleteCount}} & If 0, will not delete any element. If Omitted, will be equal to `length - start` \tn 
% Row Count 13 (+ 5)
% Row 10
\SetRowColor{LightBackground}
 & {\bf{item1, item2}} & The elements to add to the array \tn 
% Row Count 15 (+ 2)
% Row 11
\SetRowColor{white}
 & returns an array containing the deleted elements &  \tn 
% Row Count 18 (+ 3)
\hhline{>{\arrayrulecolor{DarkBackground}}---}
\SetRowColor{LightBackground}
\mymulticolumn{3}{x{5.377cm}}{These methods modify the array}  \tn 
\hhline{>{\arrayrulecolor{DarkBackground}}---}
\end{tabularx}
\par\addvspace{1.3em}

\begin{tabularx}{5.377cm}{p{0.54924 cm} x{2.01388 cm} x{2.01388 cm} }
\SetRowColor{DarkBackground}
\mymulticolumn{3}{x{5.377cm}}{\bf\textcolor{white}{Array instance Accessor methods}}  \tn
% Row 0
\SetRowColor{LightBackground}
\seqsplit{concat} & var {\emph{new\_array}} = {\emph{old\_array}}.concat({\emph{value1}}{[}, {\emph{value2}}{[}, ... {\emph{valueN}}{]}{]}) &  \tn 
% Row Count 5 (+ 5)
% Row 1
\SetRowColor{white}
slice & var {\emph{shallow\_copy}} = {\emph{arr}}.slice({[}{\emph{begin}}{[}, {\emph{end}}{]}{]}) &  \tn 
% Row Count 9 (+ 4)
% Row 2
\SetRowColor{LightBackground}
 & {\bf{begin}} & Zero-based. If negative, indicate an offset from the end \tn 
% Row Count 13 (+ 4)
% Row 3
\SetRowColor{white}
join & {\emph{str}} = {\emph{arr}}.join({[}{\emph{separator}} = ','{]}) &  \tn 
% Row Count 16 (+ 3)
% Row 4
\SetRowColor{LightBackground}
\seqsplit{indexOf} & {\emph{index}} = {\emph{arr}}.indexOf({\emph{searchElement}}{[}, {\emph{fromIndex}} = 0{]}) &  \tn 
% Row Count 20 (+ 4)
% Row 5
\SetRowColor{white}
\seqsplit{lastIndexOf} & {\emph{index}} = {\emph{arr}}.indexOf({\emph{searchElement}}{[}, {\emph{fromIndex}} = arr.length - 1{]}) &  \tn 
% Row Count 25 (+ 5)
\hhline{>{\arrayrulecolor{DarkBackground}}---}
\end{tabularx}
\par\addvspace{1.3em}

\begin{tabularx}{5.377cm}{p{0.73232 cm} x{2.70043 cm} x{1.14425 cm} }
\SetRowColor{DarkBackground}
\mymulticolumn{3}{x{5.377cm}}{\bf\textcolor{white}{Array instance Iteration methods}}  \tn
% Row 0
\SetRowColor{LightBackground}
\mymulticolumn{3}{x{5.377cm}}{forEach} \tn 
% Row Count 1 (+ 1)
% Row 1
\SetRowColor{white}
map & return new array &  \tn 
% Row Count 2 (+ 1)
% Row 2
\SetRowColor{LightBackground}
\seqsplit{filter} & return new array &  \tn 
% Row Count 3 (+ 1)
% Row 3
\SetRowColor{white}
every & return `true` if every element satisfies testing function &  \tn 
% Row Count 6 (+ 3)
% Row 4
\SetRowColor{LightBackground}
some & return `true` if at least one element satisfies testing function &  \tn 
% Row Count 9 (+ 3)
% Row 5
\SetRowColor{white}
find & return the found value or `undefined` &  \tn 
% Row Count 11 (+ 2)
% Row 6
\SetRowColor{LightBackground}
\seqsplit{findIndex} & return the found Index or `-1` &  \tn 
% Row Count 13 (+ 2)
% Row 7
\SetRowColor{white}
 & {\emph{callback}}{[}, {\emph{thisArg}}{]} &  \tn 
% Row Count 14 (+ 1)
% Row 8
\SetRowColor{LightBackground}
 & {\bf{callback}} & {\bf{currentValue}} \tn 
% Row Count 16 (+ 2)
% Row 9
\SetRowColor{white}
 &  & {\bf{index}} \tn 
% Row Count 17 (+ 1)
% Row 10
\SetRowColor{LightBackground}
 &  & {\bf{array}} \tn 
% Row Count 18 (+ 1)
% Row 11
\SetRowColor{white}
\seqsplit{reduce} & accumulate &  \tn 
% Row Count 19 (+ 1)
% Row 12
\SetRowColor{LightBackground}
\seqsplit{reduceRight} & accumulate from end &  \tn 
% Row Count 21 (+ 2)
% Row 13
\SetRowColor{white}
 & {\emph{callback}}{[}, {\emph{initialValue}}{]} &  \tn 
% Row Count 23 (+ 2)
% Row 14
\SetRowColor{LightBackground}
 & {\bf{callback}} & {\bf{previousValue}} \tn 
% Row Count 25 (+ 2)
% Row 15
\SetRowColor{white}
 &  & {\bf{currentValue}} \tn 
% Row Count 27 (+ 2)
% Row 16
\SetRowColor{LightBackground}
 &  & {\bf{currentIndex}} \tn 
% Row Count 29 (+ 2)
% Row 17
\SetRowColor{white}
 &  & {\bf{array}} \tn 
% Row Count 30 (+ 1)
\end{tabularx}
\par\addvspace{1.3em}

\vfill
\columnbreak
\begin{tabularx}{5.377cm}{p{0.73232 cm} x{2.70043 cm} x{1.14425 cm} }
\SetRowColor{DarkBackground}
\mymulticolumn{3}{x{5.377cm}}{\bf\textcolor{white}{Array instance Iteration methods (cont)}}  \tn
% Row 18
\SetRowColor{LightBackground}
\seqsplit{entries} & key/value pairs &  \tn 
% Row Count 2 (+ 2)
% Row 19
\SetRowColor{white}
keys & keys &  \tn 
% Row Count 3 (+ 1)
% Row 20
\SetRowColor{LightBackground}
\seqsplit{values} & values &  \tn 
% Row Count 4 (+ 1)
% Row 21
\SetRowColor{white}
 & return an new `Array Iterator` object &  \tn 
% Row Count 6 (+ 2)
\hhline{>{\arrayrulecolor{DarkBackground}}---}
\SetRowColor{LightBackground}
\mymulticolumn{3}{x{5.377cm}}{Some of them can also use for array-like objects by {\bf{Array.prototype.{\emph{fun}}.call({\emph{array-like object}}, {\emph{args}})}}}  \tn 
\hhline{>{\arrayrulecolor{DarkBackground}}---}
\end{tabularx}
\par\addvspace{1.3em}

\begin{tabularx}{5.377cm}{x{0.91894 cm} x{1.2531 cm} x{1.00248 cm} x{1.00248 cm} }
\SetRowColor{DarkBackground}
\mymulticolumn{4}{x{5.377cm}}{\bf\textcolor{white}{All the Array instance methods}}  \tn
% Row 0
\SetRowColor{LightBackground}
\seqsplit{copyWithin} & fill & pop & push \tn 
% Row Count 2 (+ 2)
% Row 1
\SetRowColor{white}
reverse & shift & sort & splice \tn 
% Row Count 3 (+ 1)
% Row 2
\SetRowColor{LightBackground}
unshift & concat & join & slice \tn 
% Row Count 4 (+ 1)
% Row 3
\SetRowColor{white}
\seqsplit{toString} & \seqsplit{toLocaleString} & indexOf & \seqsplit{lastIndexOf} \tn 
% Row Count 6 (+ 2)
% Row 4
\SetRowColor{LightBackground}
forEach & entries & every & some \tn 
% Row Count 7 (+ 1)
% Row 5
\SetRowColor{white}
filter & find & \seqsplit{findIndex} & keys \tn 
% Row Count 8 (+ 1)
% Row 6
\SetRowColor{LightBackground}
map & reduce & \seqsplit{reduceRight} & values \tn 
% Row Count 10 (+ 2)
\hhline{>{\arrayrulecolor{DarkBackground}}----}
\end{tabularx}
\par\addvspace{1.3em}

\begin{tabularx}{5.377cm}{x{2.42581 cm} x{1.69349 cm} p{0.4577 cm} }
\SetRowColor{DarkBackground}
\mymulticolumn{3}{x{5.377cm}}{\bf\textcolor{white}{Create a string}}  \tn
% Row 0
\SetRowColor{LightBackground}
\mymulticolumn{3}{x{5.377cm}}{{\bf{String literals}}} \tn 
% Row Count 1 (+ 1)
% Row 1
\SetRowColor{white}
\mymulticolumn{3}{x{5.377cm}}{'string text'} \tn 
% Row Count 2 (+ 1)
% Row 2
\SetRowColor{LightBackground}
\mymulticolumn{3}{x{5.377cm}}{"string text"} \tn 
% Row Count 3 (+ 1)
% Row 3
\SetRowColor{white}
\mymulticolumn{3}{x{5.377cm}}{String({\emph{text}})} \tn 
% Row Count 4 (+ 1)
% Row 4
\SetRowColor{LightBackground}
\textbackslash{}`string text \$\{variable\}\textbackslash{}` & template strings &  \tn 
% Row Count 6 (+ 2)
% Row 5
\SetRowColor{white}
\mymulticolumn{3}{x{5.377cm}}{{\bf{Create by Char codes}}} \tn 
% Row Count 7 (+ 1)
% Row 6
\SetRowColor{LightBackground}
\mymulticolumn{3}{x{5.377cm}}{String.fromCharCode({\emph{num1}}{[}, ...{[}, {\emph{numN}}{]}{]})} \tn 
% Row Count 8 (+ 1)
\hhline{>{\arrayrulecolor{DarkBackground}}---}
\end{tabularx}
\par\addvspace{1.3em}

\begin{tabularx}{5.377cm}{x{1.46464 cm} x{1.55618 cm} x{1.55618 cm} }
\SetRowColor{DarkBackground}
\mymulticolumn{3}{x{5.377cm}}{\bf\textcolor{white}{String instance methods unrelated to HTML}}  \tn
% Row 0
\SetRowColor{LightBackground}
concat & {\emph{str}}.concat({\emph{string2}}, {\emph{string3}}{[}, ..., {\emph{stringN}}{]}) &  \tn 
% Row Count 4 (+ 4)
% Row 1
\SetRowColor{white}
repeat & {\emph{str}}.repeat({\emph{count}}) \{\{nl\}\}count will convert to integer \{\{nl\}\}'abc'.repeat(2) -\textgreater{} 'abcabc' &  \tn 
% Row Count 11 (+ 7)
% Row 2
\SetRowColor{LightBackground}
includes\{\{nl\}\}endsWith\{\{nl\}\}startsWith & {\emph{str}}.{\emph{funcName}}({\emph{searchString}}{[}, {\emph{position}}{]}) &  \tn 
% Row Count 15 (+ 4)
% Row 3
\SetRowColor{white}
 & {\bf{searchString}} & A string to be searched for within this string \tn 
% Row Count 19 (+ 4)
% Row 4
\SetRowColor{LightBackground}
 & {\bf{position}} & search from, optional \tn 
% Row Count 21 (+ 2)
% Row 5
\SetRowColor{white}
 & \seqsplit{case-sensitivity}, return `true` or `false` &  \tn 
% Row Count 25 (+ 4)
\hhline{>{\arrayrulecolor{DarkBackground}}---}
\end{tabularx}
\par\addvspace{1.3em}

\begin{tabularx}{5.377cm}{p{0.4577 cm} x{2.01388 cm} x{2.10542 cm} }
\SetRowColor{DarkBackground}
\mymulticolumn{3}{x{5.377cm}}{\bf\textcolor{white}{String instance methods related with RegExp}}  \tn
% Row 0
\SetRowColor{LightBackground}
\seqsplit{search} & {\emph{str}}.search({\emph{regexp}}) &  \tn 
% Row Count 2 (+ 2)
% Row 1
\SetRowColor{white}
 & return the index of first match or -1 &  \tn 
% Row Count 5 (+ 3)
% Row 2
\SetRowColor{LightBackground}
match & {\emph{str}}.match({\emph{regexp}}) \{\{nl\}\} same as {\emph{regexObj}}.exec({\emph{str}}) &  \tn 
% Row Count 9 (+ 4)
% Row 3
\SetRowColor{white}
 & return an array containing the entire match result or {\bf{null}} &  \tn 
% Row Count 13 (+ 4)
% Row 4
\SetRowColor{LightBackground}
 & result: input, index, 0, 1-n &  \tn 
% Row Count 15 (+ 2)
% Row 5
\SetRowColor{white}
\seqsplit{replace} & {\emph{str}}.replace({\emph{regexp}}|{\emph{substr}}, {\emph{newSubStr}}|{\emph{function}}) &  \tn 
% Row Count 19 (+ 4)
% Row 6
\SetRowColor{LightBackground}
 & {\bf{regexp \{\{nl\}\}substr}} & pattern \tn 
% Row Count 21 (+ 2)
% Row 7
\SetRowColor{white}
 & {\bf{newSubStr\{\{nl\}\}function}} & replacement \tn 
% Row Count 23 (+ 2)
% Row 8
\SetRowColor{LightBackground}
 &  & {\bf{newSubStr}} can include some special replacement patterns \tn 
% Row Count 27 (+ 4)
% Row 9
\SetRowColor{white}
 & \$\$ & inserts a '\$' \tn 
% Row Count 28 (+ 1)
% Row 10
\SetRowColor{LightBackground}
 & \$\& & inserts the matched substring \tn 
% Row Count 30 (+ 2)
\end{tabularx}
\par\addvspace{1.3em}

\vfill
\columnbreak
\begin{tabularx}{5.377cm}{p{0.4577 cm} x{2.01388 cm} x{2.10542 cm} }
\SetRowColor{DarkBackground}
\mymulticolumn{3}{x{5.377cm}}{\bf\textcolor{white}{String instance methods related with RegExp (cont)}}  \tn
% Row 11
\SetRowColor{LightBackground}
 & \$` & inserts the portion of the string that precedes the matched string \tn 
% Row Count 4 (+ 4)
% Row 12
\SetRowColor{white}
 & \$' & inserts the portion of the string that follows the matched substring \tn 
% Row Count 8 (+ 4)
% Row 13
\SetRowColor{LightBackground}
 & \${\emph{n}} or \${\emph{nn}} & {\emph{n}} and {\emph{nn}} are decimal digits, inserts the {\emph{n}}th parenthesized submatch string \tn 
% Row Count 13 (+ 5)
% Row 14
\SetRowColor{white}
 &  & {\bf{function}}'s result will be used as the replacement, and the arguments is: \tn 
% Row Count 18 (+ 5)
% Row 15
\SetRowColor{LightBackground}
 & match & like \$\& \tn 
% Row Count 19 (+ 1)
% Row 16
\SetRowColor{white}
 & p1, p2, ... & like \${\emph{n}} \tn 
% Row Count 20 (+ 1)
% Row 17
\SetRowColor{LightBackground}
 & offset & The offset of the matched substring within the whole string \tn 
% Row Count 24 (+ 4)
% Row 18
\SetRowColor{white}
 & string & the whole string \tn 
% Row Count 25 (+ 1)
\hhline{>{\arrayrulecolor{DarkBackground}}---}
\end{tabularx}
\par\addvspace{1.3em}

\begin{tabularx}{5.377cm}{p{0.59501 cm} x{3.52429 cm} p{0.4577 cm} }
\SetRowColor{DarkBackground}
\mymulticolumn{3}{x{5.377cm}}{\bf\textcolor{white}{String instance methods related HTML}}  \tn
% Row 0
\SetRowColor{LightBackground}
\seqsplit{anchor} & {\emph{str}}.anchor({\emph{name}}) &  \tn 
% Row Count 2 (+ 2)
% Row 1
\SetRowColor{white}
 & create and display an anchor (name property) in a document\{\{nl\}\} e.g. `\textless{}a name="name"\textgreater{}str\textless{}/a\textgreater{}` &  \tn 
% Row Count 6 (+ 4)
% Row 2
\SetRowColor{LightBackground}
link & {\emph{str}}.link({\emph{url}}) &  \tn 
% Row Count 7 (+ 1)
% Row 3
\SetRowColor{white}
 & create an HTML snippet for a hypertext link\{\{nl\}\} e.g. `\textless{}a href="url"\textgreater{}str\textless{}/a\textgreater{}` &  \tn 
% Row Count 10 (+ 3)
\hhline{>{\arrayrulecolor{DarkBackground}}---}
\end{tabularx}
\par\addvspace{1.3em}

\begin{tabularx}{5.377cm}{p{0.66832 cm} x{1.29487 cm} x{1.2531 cm} x{0.96071 cm} }
\SetRowColor{DarkBackground}
\mymulticolumn{4}{x{5.377cm}}{\bf\textcolor{white}{All the String instance methods}}  \tn
% Row 0
\SetRowColor{LightBackground}
\seqsplit{charAt} & charCodeAt & concat & includes \tn 
% Row Count 1 (+ 1)
% Row 1
\SetRowColor{white}
\seqsplit{endsWith} & indexOf & lastIndexOf & \seqsplit{localeCompare} \tn 
% Row Count 3 (+ 2)
% Row 2
\SetRowColor{LightBackground}
match & repeat & replace & search \tn 
% Row Count 4 (+ 1)
% Row 3
\SetRowColor{white}
slice & split & startsWith & substr \tn 
% Row Count 5 (+ 1)
% Row 4
\SetRowColor{LightBackground}
\seqsplit{substring} & \seqsplit{toLocaleLowerCase} & \seqsplit{toLocaleUpperCase} & \seqsplit{toLowerCase} \tn 
% Row Count 7 (+ 2)
% Row 5
\SetRowColor{white}
\seqsplit{toString} & toUpperCase & trim & valueOf \tn 
% Row Count 9 (+ 2)
% Row 6
\SetRowColor{LightBackground}
\seqsplit{anchor} & link &  &  \tn 
% Row Count 10 (+ 1)
\hhline{>{\arrayrulecolor{DarkBackground}}----}
\end{tabularx}
\par\addvspace{1.3em}

\begin{tabularx}{5.377cm}{p{1.09494 cm} x{3.88206 cm} }
\SetRowColor{DarkBackground}
\mymulticolumn{2}{x{5.377cm}}{\bf\textcolor{white}{Escape notation}}  \tn
% Row 0
\SetRowColor{LightBackground}
\textbackslash{}0 & the NULL character \tn 
% Row Count 1 (+ 1)
% Row 1
\SetRowColor{white}
\textbackslash{}' & single quote \tn 
% Row Count 2 (+ 1)
% Row 2
\SetRowColor{LightBackground}
\textbackslash{}" & double quote \tn 
% Row Count 3 (+ 1)
% Row 3
\SetRowColor{white}
\textbackslash{}\textbackslash{} & backslash \tn 
% Row Count 4 (+ 1)
% Row 4
\SetRowColor{LightBackground}
\textbackslash{}n & new line \tn 
% Row Count 5 (+ 1)
% Row 5
\SetRowColor{white}
\textbackslash{}r & carriage return \tn 
% Row Count 6 (+ 1)
% Row 6
\SetRowColor{LightBackground}
\textbackslash{}v & vertical tab \tn 
% Row Count 7 (+ 1)
% Row 7
\SetRowColor{white}
\textbackslash{}t & tab \tn 
% Row Count 8 (+ 1)
% Row 8
\SetRowColor{LightBackground}
\textbackslash{}b & backspace \tn 
% Row Count 9 (+ 1)
% Row 9
\SetRowColor{white}
\textbackslash{}f & form feed \tn 
% Row Count 10 (+ 1)
% Row 10
\SetRowColor{LightBackground}
\textbackslash{}uXXXX & unicode codepoint \tn 
% Row Count 11 (+ 1)
% Row 11
\SetRowColor{white}
\textbackslash{}xXX & the Latin-1 character \tn 
% Row Count 12 (+ 1)
\hhline{>{\arrayrulecolor{DarkBackground}}--}
\end{tabularx}
\par\addvspace{1.3em}

\begin{tabularx}{5.377cm}{p{0.96117 cm} x{1.73926 cm} x{1.87657 cm} }
\SetRowColor{DarkBackground}
\mymulticolumn{3}{x{5.377cm}}{\bf\textcolor{white}{Create a RegExp}}  \tn
% Row 0
\SetRowColor{LightBackground}
\mymulticolumn{3}{x{5.377cm}}{{\bf{literal notation}}} \tn 
% Row Count 1 (+ 1)
% Row 1
\SetRowColor{white}
\mymulticolumn{3}{x{5.377cm}}{/{\emph{pattern}}/{\emph{flags}}} \tn 
% Row Count 2 (+ 1)
% Row 2
\SetRowColor{LightBackground}
\mymulticolumn{3}{x{5.377cm}}{{\bf{constructor}}} \tn 
% Row Count 3 (+ 1)
% Row 3
\SetRowColor{white}
\mymulticolumn{3}{x{5.377cm}}{new RegExp({\emph{pattern}}{[}, {\emph{flags}}{]})} \tn 
% Row Count 4 (+ 1)
% Row 4
\SetRowColor{LightBackground}
~ & {\bf{pattern}} & The text \tn 
% Row Count 5 (+ 1)
% Row 5
\SetRowColor{white}
 & {\bf{flags}} &  \tn 
% Row Count 6 (+ 1)
% Row 6
\SetRowColor{LightBackground}
 & \{\{ar\}\}{\bf{g}} & global match \tn 
% Row Count 7 (+ 1)
% Row 7
\SetRowColor{white}
 & \{\{ar\}\}{\bf{i}} & ignore case \tn 
% Row Count 8 (+ 1)
% Row 8
\SetRowColor{LightBackground}
 & \{\{ar\}\}{\bf{m}} & multiline \tn 
% Row Count 9 (+ 1)
\hhline{>{\arrayrulecolor{DarkBackground}}---}
\SetRowColor{LightBackground}
\mymulticolumn{3}{x{5.377cm}}{use `test` to test for a match in its string parameter.}  \tn 
\hhline{>{\arrayrulecolor{DarkBackground}}---}
\end{tabularx}
\par\addvspace{1.3em}

\begin{tabularx}{5.377cm}{X}
\SetRowColor{DarkBackground}
\mymulticolumn{1}{x{5.377cm}}{\bf\textcolor{white}{Static property you may use}}  \tn
% Row 0
\SetRowColor{LightBackground}
\mymulticolumn{1}{x{5.377cm}}{{\bf{RegExp.lastIndex}}} \tn 
\mymulticolumn{1}{x{5.377cm}}{\hspace*{6 px}\rule{2px}{6px}\hspace*{6 px}The index at which to start the next match} \tn 
% Row Count 2 (+ 2)
\hhline{>{\arrayrulecolor{DarkBackground}}-}
\end{tabularx}
\par\addvspace{1.3em}

\begin{tabularx}{5.377cm}{x{1.24425 cm} x{3.73275 cm} }
\SetRowColor{DarkBackground}
\mymulticolumn{2}{x{5.377cm}}{\bf\textcolor{white}{RegEx Quick Reference}}  \tn
% Row 0
\SetRowColor{LightBackground}
\mymulticolumn{2}{x{5.377cm}}{{\bf{Character classes}}} \tn 
% Row Count 1 (+ 1)
% Row 1
\SetRowColor{white}
. & any character except newline \tn 
% Row Count 2 (+ 1)
% Row 2
\SetRowColor{LightBackground}
\textbackslash{}w \textbackslash{}d \textbackslash{}s & word, digit, whitespace \tn 
% Row Count 3 (+ 1)
% Row 3
\SetRowColor{white}
\textbackslash{}W \textbackslash{}D \textbackslash{}S & not word, digit, whitespace \tn 
% Row Count 4 (+ 1)
% Row 4
\SetRowColor{LightBackground}
{[}abc{]} & any of a, b, or c \tn 
% Row Count 5 (+ 1)
% Row 5
\SetRowColor{white}
{[}\textasciicircum{}abc{]} & not a, b, or c \tn 
% Row Count 6 (+ 1)
% Row 6
\SetRowColor{LightBackground}
{[}a-g{]} & character between a \& g \tn 
% Row Count 7 (+ 1)
% Row 7
\SetRowColor{white}
\mymulticolumn{2}{x{5.377cm}}{{\bf{Anchors}}} \tn 
% Row Count 8 (+ 1)
% Row 8
\SetRowColor{LightBackground}
\textasciicircum{}abc\$ & start / end of the string \tn 
% Row Count 9 (+ 1)
% Row 9
\SetRowColor{white}
\textbackslash{}b \textbackslash{}B & word, not-word boundary \tn 
% Row Count 10 (+ 1)
% Row 10
\SetRowColor{LightBackground}
\mymulticolumn{2}{x{5.377cm}}{{\bf{Escaped characters}}} \tn 
% Row Count 11 (+ 1)
% Row 11
\SetRowColor{white}
\textbackslash{}. * \textbackslash{}\textbackslash{} & escaped special characters \tn 
% Row Count 12 (+ 1)
% Row 12
\SetRowColor{LightBackground}
\textbackslash{}t \textbackslash{}n \textbackslash{}r & tab, linefeed, carriage return \tn 
% Row Count 13 (+ 1)
% Row 13
\SetRowColor{white}
\mymulticolumn{2}{x{5.377cm}}{{\bf{Groups \& Lookaround}}} \tn 
% Row Count 14 (+ 1)
% Row 14
\SetRowColor{LightBackground}
(abc) & capture group \tn 
% Row Count 15 (+ 1)
% Row 15
\SetRowColor{white}
\textbackslash{}1 & backreference to group \#1 \tn 
% Row Count 16 (+ 1)
% Row 16
\SetRowColor{LightBackground}
(?:abc) & non-capturing group \tn 
% Row Count 17 (+ 1)
% Row 17
\SetRowColor{white}
(?=abc) & positive lookahead \tn 
% Row Count 18 (+ 1)
% Row 18
\SetRowColor{LightBackground}
(?!abc) & negative lookahead \tn 
% Row Count 19 (+ 1)
% Row 19
\SetRowColor{white}
\mymulticolumn{2}{x{5.377cm}}{{\bf{Quantifiers \& Alternation}}} \tn 
% Row Count 20 (+ 1)
% Row 20
\SetRowColor{LightBackground}
a* a+ a? & 0 or more, 1 or more, 0 or 1 \tn 
% Row Count 21 (+ 1)
% Row 21
\SetRowColor{white}
a\{5\} a\{2,\} & exactly five, two or more \tn 
% Row Count 22 (+ 1)
% Row 22
\SetRowColor{LightBackground}
a\{1, 3\} & between one \& three \tn 
% Row Count 23 (+ 1)
% Row 23
\SetRowColor{white}
a+? a\{2,\}? & match as few as possible \tn 
% Row Count 24 (+ 1)
% Row 24
\SetRowColor{LightBackground}
ab|cd & match ab or cd \tn 
% Row Count 25 (+ 1)
\hhline{>{\arrayrulecolor{DarkBackground}}--}
\SetRowColor{LightBackground}
\mymulticolumn{2}{x{5.377cm}}{Reference from \{\{popup="https://www.regexr.com"\}\}regexr.com\{\{/popup\}\}}  \tn 
\hhline{>{\arrayrulecolor{DarkBackground}}--}
\end{tabularx}
\par\addvspace{1.3em}


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

\end{document}