\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{tronghao}
\pdfinfo{
  /Title (haodt-javascript-cheatsheet.pdf)
  /Creator (Cheatography)
  /Author (tronghao)
  /Subject (haodt-javascript-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}{EDBE21}
\definecolor{LightBackground}{HTML}{FDFAF1}
\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{haodt-javascript-cheatsheet Cheat Sheet}}}} \\
    \normalsize{by \textcolor{DarkBackground}{tronghao} via \textcolor{DarkBackground}{\uline{cheatography.com/174041/cs/37921/}}}
\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}tronghao \\
  \uline{cheatography.com/tronghao} \\
  \end{tabulary}
\vfill
\columnbreak
\begin{tabulary}{5.8cm}{L}
  \SetRowColor{FootBackground}
  \mymulticolumn{1}{p{5.377cm}}{\bf\textcolor{white}{Cheat Sheet}}  \\
   \vspace{-2pt}Published 26th March, 2023.\\
   Updated 9th April, 2023.\\
   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}{X}
\SetRowColor{DarkBackground}
\mymulticolumn{1}{x{5.377cm}}{\bf\textcolor{white}{Blog}}  \tn
% Row 0
\SetRowColor{LightBackground}
\mymulticolumn{1}{x{5.377cm}}{\seqsplit{https://blogcongnghe.tronghao.com/javascript-course/}} \tn 
% Row Count 2 (+ 2)
\hhline{>{\arrayrulecolor{DarkBackground}}-}
\end{tabularx}
\par\addvspace{1.3em}

\begin{tabularx}{5.377cm}{x{1.94103 cm} x{3.03597 cm} }
\SetRowColor{DarkBackground}
\mymulticolumn{2}{x{5.377cm}}{\bf\textcolor{white}{Boolean}}  \tn
% Row 0
\SetRowColor{LightBackground}
Type conversion & Tự động ép kiểu \tn 
% Row Count 1 (+ 1)
% Row 1
\SetRowColor{white}
Type coercion & Ép kiểu ngầm \tn 
% Row Count 2 (+ 1)
% Row 2
\SetRowColor{LightBackground}
\mymulticolumn{2}{x{5.377cm}}{Truthy} \tn 
% Row Count 3 (+ 1)
% Row 3
\SetRowColor{white}
\mymulticolumn{2}{x{5.377cm}}{Falsy} \tn 
% Row Count 4 (+ 1)
% Row 4
\SetRowColor{LightBackground}
\mymulticolumn{2}{x{5.377cm}}{Logical operators} \tn 
% Row Count 5 (+ 1)
\hhline{>{\arrayrulecolor{DarkBackground}}--}
\end{tabularx}
\par\addvspace{1.3em}

\begin{tabularx}{5.377cm}{x{2.23965 cm} x{2.73735 cm} }
\SetRowColor{DarkBackground}
\mymulticolumn{2}{x{5.377cm}}{\bf\textcolor{white}{Number}}  \tn
% Row 0
\SetRowColor{LightBackground}
\seqsplit{Number.parseInt('1.5')} & 1 \tn 
% Row Count 2 (+ 2)
% Row 1
\SetRowColor{white}
\seqsplit{Number.parseFloat('1}.5')\{\{noshy\}\} & 1.5 =\textgreater{} cả parseInt và parseFloat luôn parse từ trái sang phải đến khi có lỗi \tn 
% Row Count 7 (+ 5)
% Row 2
\SetRowColor{LightBackground}
\mymulticolumn{2}{x{5.377cm}}{n.toFixed} \tn 
% Row Count 8 (+ 1)
% Row 3
\SetRowColor{white}
n.toPrecision & Làm tròn đến chữ số có nghĩa (bao gồm cả số nguyên và thập phân) \tn 
% Row Count 12 (+ 4)
\hhline{>{\arrayrulecolor{DarkBackground}}--}
\end{tabularx}
\par\addvspace{1.3em}

\begin{tabularx}{5.377cm}{x{1.4931 cm} x{3.4839 cm} }
\SetRowColor{DarkBackground}
\mymulticolumn{2}{x{5.377cm}}{\bf\textcolor{white}{Math}}  \tn
% Row 0
\SetRowColor{LightBackground}
\mymulticolumn{2}{x{5.377cm}}{Math.PI} \tn 
% Row Count 1 (+ 1)
% Row 1
\SetRowColor{white}
Math.SQRT2 & Căn bậc 2 \tn 
% Row Count 2 (+ 1)
% Row 2
\SetRowColor{LightBackground}
\seqsplit{Math.ceil(x)} & Làm tròn lên \tn 
% Row Count 3 (+ 1)
% Row 3
\SetRowColor{white}
\seqsplit{Math.floor(x)} & làm tròn xuống \tn 
% Row Count 5 (+ 2)
% Row 4
\SetRowColor{LightBackground}
\seqsplit{Math.round(x)} & Làm tròn như bình thường \tn 
% Row Count 7 (+ 2)
% Row 5
\SetRowColor{white}
\seqsplit{Math.trunc(x)} & Lấy nguyên bỏ thập phân \tn 
% Row Count 9 (+ 2)
% Row 6
\SetRowColor{LightBackground}
\seqsplit{Math.random()} & Random số thực từ 0-\textgreater{}1 \tn 
% Row Count 11 (+ 2)
% Row 7
\SetRowColor{white}
\mymulticolumn{2}{x{5.377cm}}{Math.abs(x)} \tn 
% Row Count 12 (+ 1)
% Row 8
\SetRowColor{LightBackground}
\mymulticolumn{2}{x{5.377cm}}{Math.pow(x, y)} \tn 
% Row Count 13 (+ 1)
% Row 9
\SetRowColor{white}
\mymulticolumn{2}{x{5.377cm}}{Math.sqrt(x)} \tn 
% Row Count 14 (+ 1)
% Row 10
\SetRowColor{LightBackground}
\mymulticolumn{2}{x{5.377cm}}{Số thực không so sánh bằng được} \tn 
% Row Count 15 (+ 1)
\hhline{>{\arrayrulecolor{DarkBackground}}--}
\end{tabularx}
\par\addvspace{1.3em}

\begin{tabularx}{5.377cm}{x{2.33919 cm} x{2.63781 cm} }
\SetRowColor{DarkBackground}
\mymulticolumn{2}{x{5.377cm}}{\bf\textcolor{white}{Object}}  \tn
% Row 0
\SetRowColor{LightBackground}
delete key & delete student.name \tn 
% Row Count 1 (+ 1)
% Row 1
\SetRowColor{white}
property value shorthand\{\{nobreak\}\} & \{ id: id\} =\textgreater{} \{ id \} \tn 
% Row Count 3 (+ 2)
% Row 2
\SetRowColor{LightBackground}
in & 'name' in student \tn 
% Row Count 4 (+ 1)
% Row 3
\SetRowColor{white}
clone object & Object.assign hoặc ... (spread opertator) \tn 
% Row Count 7 (+ 3)
% Row 4
\SetRowColor{LightBackground}
\mymulticolumn{2}{x{5.377cm}}{Clone chỉ 1 tầng, con của object không có clone ra =\textgreater{} Nên sử dụng thư viện cho clone} \tn 
% Row Count 9 (+ 2)
% Row 5
\SetRowColor{white}
Objec.keys & for ... in  (duyệt key) \tn 
% Row Count 11 (+ 2)
\hhline{>{\arrayrulecolor{DarkBackground}}--}
\end{tabularx}
\par\addvspace{1.3em}

\begin{tabularx}{5.377cm}{x{2.23965 cm} x{2.73735 cm} }
\SetRowColor{DarkBackground}
\mymulticolumn{2}{x{5.377cm}}{\bf\textcolor{white}{ES6}}  \tn
% Row 0
\SetRowColor{LightBackground}
strict mode & sử dụng ES5 hoặc không \tn 
% Row Count 2 (+ 2)
% Row 1
\SetRowColor{white}
hoisting & đem var và định nghĩa hàm (chỉ function declaration không phải arrow function) lên đầu file \tn 
% Row Count 7 (+ 5)
% Row 2
\SetRowColor{LightBackground}
IIFE & thực hiện function ngay sau khi định nghĩa \tn 
% Row Count 10 (+ 3)
% Row 3
\SetRowColor{white}
closures & hàm con sử dụng biến của hàm con ngay cả khi hàm cha đã kết thúc \tn 
% Row Count 14 (+ 4)
% Row 4
\SetRowColor{LightBackground}
Rest parameter & dấu ... \tn 
% Row Count 15 (+ 1)
% Row 5
\SetRowColor{white}
Arrow function & () =\textgreater{} \{\} \tn 
% Row Count 16 (+ 1)
% Row 6
\SetRowColor{LightBackground}
Curry function & hàm return về 1 function khác \tn 
% Row Count 18 (+ 2)
% Row 7
\SetRowColor{white}
\mymulticolumn{2}{x{5.377cm}}{{\bf{Enhand Object Property}}\{\{noshy\}\}} \tn 
% Row Count 19 (+ 1)
% Row 8
\SetRowColor{LightBackground}
Property shorthand & \{ id: id \} =\textgreater{} \{ id \} \tn 
% Row Count 20 (+ 1)
% Row 9
\SetRowColor{white}
computed property name\{\{nobreak\}\} & {[}{]}  Ex: student{[}'name'{]} \tn 
% Row Count 22 (+ 2)
% Row 10
\SetRowColor{LightBackground}
\mymulticolumn{2}{x{5.377cm}}{methor property} \tn 
% Row Count 23 (+ 1)
% Row 11
\SetRowColor{white}
destructuring & rút trích property \tn 
% Row Count 24 (+ 1)
% Row 12
\SetRowColor{LightBackground}
\mymulticolumn{2}{x{5.377cm}}{Object.assign} \tn 
% Row Count 25 (+ 1)
% Row 13
\SetRowColor{white}
\mymulticolumn{2}{x{5.377cm}}{this} \tn 
% Row Count 26 (+ 1)
% Row 14
\SetRowColor{LightBackground}
\mymulticolumn{2}{x{5.377cm}}{call} \tn 
% Row Count 27 (+ 1)
% Row 15
\SetRowColor{white}
\mymulticolumn{2}{x{5.377cm}}{apply} \tn 
% Row Count 28 (+ 1)
% Row 16
\SetRowColor{LightBackground}
bind & bind this cho 1 object cụ thể \tn 
% Row Count 30 (+ 2)
\end{tabularx}
\par\addvspace{1.3em}

\vfill
\columnbreak
\begin{tabularx}{5.377cm}{x{2.23965 cm} x{2.73735 cm} }
\SetRowColor{DarkBackground}
\mymulticolumn{2}{x{5.377cm}}{\bf\textcolor{white}{ES6 (cont)}}  \tn
% Row 17
\SetRowColor{LightBackground}
\mymulticolumn{2}{x{5.377cm}}{{\bf{Protocol}}} \tn 
% Row Count 1 (+ 1)
% Row 18
\SetRowColor{white}
iteration protocol & Chuẩn cho for ... of \tn 
% Row Count 2 (+ 1)
\hhline{>{\arrayrulecolor{DarkBackground}}--}
\end{tabularx}
\par\addvspace{1.3em}

\begin{tabularx}{5.377cm}{x{2.58804 cm} x{2.38896 cm} }
\SetRowColor{DarkBackground}
\mymulticolumn{2}{x{5.377cm}}{\bf\textcolor{white}{String}}  \tn
% Row 0
\SetRowColor{LightBackground}
Dấu backticks & \textbackslash{}`My \$\{name\}\textbackslash{}` \tn 
% Row Count 1 (+ 1)
% Row 1
\SetRowColor{white}
\mymulticolumn{2}{x{5.377cm}}{String sinh ra đã cố định không thay đổi được giá trị} \tn 
% Row Count 3 (+ 2)
% Row 2
\SetRowColor{LightBackground}
\mymulticolumn{2}{x{5.377cm}}{text.length} \tn 
% Row Count 4 (+ 1)
% Row 3
\SetRowColor{white}
\mymulticolumn{2}{x{5.377cm}}{.toLowerCase()} \tn 
% Row Count 5 (+ 1)
% Row 4
\SetRowColor{LightBackground}
\mymulticolumn{2}{x{5.377cm}}{.toUpperCase()} \tn 
% Row Count 6 (+ 1)
% Row 5
\SetRowColor{white}
\mymulticolumn{2}{x{5.377cm}}{.indexOf} \tn 
% Row Count 7 (+ 1)
% Row 6
\SetRowColor{LightBackground}
\mymulticolumn{2}{x{5.377cm}}{.lastIndexOf} \tn 
% Row Count 8 (+ 1)
% Row 7
\SetRowColor{white}
\mymulticolumn{2}{x{5.377cm}}{.startWith} \tn 
% Row Count 9 (+ 1)
% Row 8
\SetRowColor{LightBackground}
\mymulticolumn{2}{x{5.377cm}}{.includes} \tn 
% Row Count 10 (+ 1)
% Row 9
\SetRowColor{white}
\mymulticolumn{2}{x{5.377cm}}{.endsWith} \tn 
% Row Count 11 (+ 1)
% Row 10
\SetRowColor{LightBackground}
\mymulticolumn{2}{x{5.377cm}}{.slice(start, end)} \tn 
% Row Count 12 (+ 1)
% Row 11
\SetRowColor{white}
\mymulticolumn{2}{x{5.377cm}}{.substring(start, end)} \tn 
% Row Count 13 (+ 1)
% Row 12
\SetRowColor{LightBackground}
\mymulticolumn{2}{x{5.377cm}}{.replace} \tn 
% Row Count 14 (+ 1)
% Row 13
\SetRowColor{white}
\mymulticolumn{2}{x{5.377cm}}{.replaceAll} \tn 
% Row Count 15 (+ 1)
% Row 14
\SetRowColor{LightBackground}
\mymulticolumn{2}{x{5.377cm}}{.split()} \tn 
% Row Count 16 (+ 1)
% Row 15
\SetRowColor{white}
\mymulticolumn{2}{x{5.377cm}}{.join()} \tn 
% Row Count 17 (+ 1)
% Row 16
\SetRowColor{LightBackground}
\mymulticolumn{2}{x{5.377cm}}{Kí tự ellipsis '...' =\textgreater{} \textbackslash{}u2026} \tn 
% Row Count 18 (+ 1)
\hhline{>{\arrayrulecolor{DarkBackground}}--}
\end{tabularx}
\par\addvspace{1.3em}

\begin{tabularx}{5.377cm}{p{0.4977 cm} p{0.4977 cm} }
\SetRowColor{DarkBackground}
\mymulticolumn{2}{x{5.377cm}}{\bf\textcolor{white}{Array}}  \tn
% Row 0
\SetRowColor{LightBackground}
\mymulticolumn{2}{x{5.377cm}}{Array.isArray(arr)} \tn 
% Row Count 1 (+ 1)
% Row 1
\SetRowColor{white}
\mymulticolumn{2}{x{5.377cm}}{{\bf{Tồn tại phần tử}}} \tn 
% Row Count 2 (+ 1)
% Row 2
\SetRowColor{LightBackground}
\mymulticolumn{2}{x{5.377cm}}{every(callback)} \tn 
% Row Count 3 (+ 1)
% Row 3
\SetRowColor{white}
\mymulticolumn{2}{x{5.377cm}}{some (callback)} \tn 
% Row Count 4 (+ 1)
% Row 4
\SetRowColor{LightBackground}
\mymulticolumn{2}{x{5.377cm}}{indexOf} \tn 
% Row Count 5 (+ 1)
% Row 5
\SetRowColor{white}
\mymulticolumn{2}{x{5.377cm}}{lastIndexOf} \tn 
% Row Count 6 (+ 1)
% Row 6
\SetRowColor{LightBackground}
\mymulticolumn{2}{x{5.377cm}}{includes} \tn 
% Row Count 7 (+ 1)
% Row 7
\SetRowColor{white}
\mymulticolumn{2}{x{5.377cm}}{find} \tn 
% Row Count 8 (+ 1)
% Row 8
\SetRowColor{LightBackground}
\mymulticolumn{2}{x{5.377cm}}{findIndex} \tn 
% Row Count 9 (+ 1)
% Row 9
\SetRowColor{white}
\mymulticolumn{2}{x{5.377cm}}{{\bf{Thêm/Xóa phần tử}}\{\{noshy\}\}} \tn 
% Row Count 10 (+ 1)
% Row 10
\SetRowColor{LightBackground}
\mymulticolumn{2}{x{5.377cm}}{push} \tn 
% Row Count 11 (+ 1)
% Row 11
\SetRowColor{white}
\mymulticolumn{2}{x{5.377cm}}{pop} \tn 
% Row Count 12 (+ 1)
% Row 12
\SetRowColor{LightBackground}
\mymulticolumn{2}{x{5.377cm}}{shift} \tn 
% Row Count 13 (+ 1)
% Row 13
\SetRowColor{white}
\mymulticolumn{2}{x{5.377cm}}{unshift} \tn 
% Row Count 14 (+ 1)
% Row 14
\SetRowColor{LightBackground}
\mymulticolumn{2}{x{5.377cm}}{slice} \tn 
% Row Count 15 (+ 1)
% Row 15
\SetRowColor{white}
\mymulticolumn{2}{x{5.377cm}}{{\bf{Duyệt mảng}}} \tn 
% Row Count 16 (+ 1)
% Row 16
\SetRowColor{LightBackground}
\mymulticolumn{2}{x{5.377cm}}{.forEach} \tn 
% Row Count 17 (+ 1)
% Row 17
\SetRowColor{white}
\mymulticolumn{2}{x{5.377cm}}{for of} \tn 
% Row Count 18 (+ 1)
% Row 18
\SetRowColor{LightBackground}
\mymulticolumn{2}{x{5.377cm}}{map} \tn 
% Row Count 19 (+ 1)
% Row 19
\SetRowColor{white}
\mymulticolumn{2}{x{5.377cm}}{filter} \tn 
% Row Count 20 (+ 1)
% Row 20
\SetRowColor{LightBackground}
\mymulticolumn{2}{x{5.377cm}}{slice} \tn 
% Row Count 21 (+ 1)
% Row 21
\SetRowColor{white}
\mymulticolumn{2}{x{5.377cm}}{reduce} \tn 
% Row Count 22 (+ 1)
% Row 22
\SetRowColor{LightBackground}
\mymulticolumn{2}{x{5.377cm}}{fill} \tn 
% Row Count 23 (+ 1)
% Row 23
\SetRowColor{white}
\mymulticolumn{2}{x{5.377cm}}{join} \tn 
% Row Count 24 (+ 1)
% Row 24
\SetRowColor{LightBackground}
\mymulticolumn{2}{x{5.377cm}}{concat} \tn 
% Row Count 25 (+ 1)
% Row 25
\SetRowColor{white}
\mymulticolumn{2}{x{5.377cm}}{reverse} \tn 
% Row Count 26 (+ 1)
% Row 26
\SetRowColor{LightBackground}
\mymulticolumn{2}{x{5.377cm}}{sort} \tn 
% Row Count 27 (+ 1)
\hhline{>{\arrayrulecolor{DarkBackground}}--}
\end{tabularx}
\par\addvspace{1.3em}

\begin{tabularx}{5.377cm}{x{1.64241 cm} x{3.33459 cm} }
\SetRowColor{DarkBackground}
\mymulticolumn{2}{x{5.377cm}}{\bf\textcolor{white}{Lập trình bất đồng bộ}}  \tn
% Row 0
\SetRowColor{LightBackground}
setTimeout & lưu ý với this \tn 
% Row Count 1 (+ 1)
% Row 1
\SetRowColor{white}
debounce & Đợi cho đến khi không còn gọi nó nữa thì thực hiện \tn 
% Row Count 4 (+ 3)
% Row 2
\SetRowColor{LightBackground}
throttle & Trong bao nhiêu milisecond sẽ chỉ trigger 1 lần \tn 
% Row Count 7 (+ 3)
% Row 3
\SetRowColor{white}
\mymulticolumn{2}{x{5.377cm}}{setInterval} \tn 
% Row Count 8 (+ 1)
% Row 4
\SetRowColor{LightBackground}
EventLoop & Quan trọng \tn 
% Row Count 9 (+ 1)
% Row 5
\SetRowColor{white}
Ajax & XMLHttpRequest \tn 
% Row Count 10 (+ 1)
% Row 6
\SetRowColor{LightBackground}
 & RestApi \tn 
% Row Count 11 (+ 1)
% Row 7
\SetRowColor{white}
Promise & Fix callback hell \tn 
% Row Count 12 (+ 1)
% Row 8
\SetRowColor{LightBackground}
 & method \tn 
% Row Count 13 (+ 1)
% Row 9
\SetRowColor{white}
Promise chaining & .then nhiều lần \tn 
% Row Count 15 (+ 2)
% Row 10
\SetRowColor{LightBackground}
\mymulticolumn{2}{x{5.377cm}}{Fetch} \tn 
% Row Count 16 (+ 1)
% Row 11
\SetRowColor{white}
CSP & Content Security Policy \tn 
% Row Count 17 (+ 1)
% Row 12
\SetRowColor{LightBackground}
CORS & Cross-Ỏigin Resource Sharing \tn 
% Row Count 19 (+ 2)
% Row 13
\SetRowColor{white}
\mymulticolumn{2}{x{5.377cm}}{Async function} \tn 
% Row Count 20 (+ 1)
% Row 14
\SetRowColor{LightBackground}
\mymulticolumn{2}{x{5.377cm}}{Top level await} \tn 
% Row Count 21 (+ 1)
% Row 15
\SetRowColor{white}
\mymulticolumn{2}{x{5.377cm}}{JSON} \tn 
% Row Count 22 (+ 1)
% Row 16
\SetRowColor{LightBackground}
\seqsplit{JSON.parse(text)} & parse text thành biến js (có một số trường hợp bị lỗi) \tn 
% Row Count 25 (+ 3)
% Row 17
\SetRowColor{white}
\seqsplit{JSON.stringify(json)} & parse biến js thành text \tn 
% Row Count 27 (+ 2)
\hhline{>{\arrayrulecolor{DarkBackground}}--}
\end{tabularx}
\par\addvspace{1.3em}

\begin{tabularx}{5.377cm}{x{2.4885 cm} x{2.4885 cm} }
\SetRowColor{DarkBackground}
\mymulticolumn{2}{x{5.377cm}}{\bf\textcolor{white}{ESMAScript 2016 =\textgreater{} 2022}}  \tn
% Row 0
\SetRowColor{LightBackground}
\mymulticolumn{2}{x{5.377cm}}{{\bf{2016}}} \tn 
% Row Count 1 (+ 1)
% Row 1
\SetRowColor{white}
\mymulticolumn{2}{x{5.377cm}}{includes} \tn 
% Row Count 2 (+ 1)
% Row 2
\SetRowColor{LightBackground}
** & Lũy thừa \tn 
% Row Count 3 (+ 1)
% Row 3
\SetRowColor{white}
\mymulticolumn{2}{x{5.377cm}}{{\bf{2017}}} \tn 
% Row Count 4 (+ 1)
% Row 4
\SetRowColor{LightBackground}
\mymulticolumn{2}{x{5.377cm}}{Async function} \tn 
% Row Count 5 (+ 1)
% Row 5
\SetRowColor{white}
\mymulticolumn{2}{x{5.377cm}}{Shared memory and atomics} \tn 
% Row Count 6 (+ 1)
% Row 6
\SetRowColor{LightBackground}
String padding & padStart, padEnd \tn 
% Row Count 7 (+ 1)
% Row 7
\SetRowColor{white}
Object.value & Lấy value của object =\textgreater{} array \tn 
% Row Count 9 (+ 2)
% Row 8
\SetRowColor{LightBackground}
Object.keys & Lấy keys =\textgreater{} array \tn 
% Row Count 10 (+ 1)
% Row 9
\SetRowColor{white}
Object.entries & Lấy cả key và value \tn 
% Row Count 12 (+ 2)
% Row 10
\SetRowColor{LightBackground}
\mymulticolumn{2}{x{5.377cm}}{Object.getOwnPropertyDescription\{\{nobreak\}\}} \tn 
% Row Count 13 (+ 1)
% Row 11
\SetRowColor{white}
\mymulticolumn{2}{x{5.377cm}}{Trailing Commas} \tn 
% Row Count 14 (+ 1)
% Row 12
\SetRowColor{LightBackground}
\mymulticolumn{2}{x{5.377cm}}{{\bf{2018}}} \tn 
% Row Count 15 (+ 1)
% Row 13
\SetRowColor{white}
Rest/Spread properties for object \{\{nobreak\}\} & dấu ... \tn 
% Row Count 18 (+ 3)
% Row 14
\SetRowColor{LightBackground}
\mymulticolumn{2}{x{5.377cm}}{for await of} \tn 
% Row Count 19 (+ 1)
% Row 15
\SetRowColor{white}
\mymulticolumn{2}{x{5.377cm}}{finally()} \tn 
% Row Count 20 (+ 1)
% Row 16
\SetRowColor{LightBackground}
\mymulticolumn{2}{x{5.377cm}}{Regular expression} \tn 
% Row Count 21 (+ 1)
% Row 17
\SetRowColor{white}
\mymulticolumn{2}{x{5.377cm}}{{\bf{2019}}} \tn 
% Row Count 22 (+ 1)
% Row 18
\SetRowColor{LightBackground}
flat, flatMap & hạ cấp mảng \tn 
% Row Count 23 (+ 1)
% Row 19
\SetRowColor{white}
\mymulticolumn{2}{x{5.377cm}}{Object.fromEntries} \tn 
% Row Count 24 (+ 1)
% Row 20
\SetRowColor{LightBackground}
\mymulticolumn{2}{x{5.377cm}}{trimStart, trimEnd} \tn 
% Row Count 25 (+ 1)
% Row 21
\SetRowColor{white}
Optional catch binding & catch không cần truyền param error \tn 
% Row Count 27 (+ 2)
% Row 22
\SetRowColor{LightBackground}
sort() & Giữ thứ tự những phần tử giống nhau \tn 
% Row Count 30 (+ 3)
\end{tabularx}
\par\addvspace{1.3em}

\vfill
\columnbreak
\begin{tabularx}{5.377cm}{x{2.4885 cm} x{2.4885 cm} }
\SetRowColor{DarkBackground}
\mymulticolumn{2}{x{5.377cm}}{\bf\textcolor{white}{ESMAScript 2016 =\textgreater{} 2022 (cont)}}  \tn
% Row 23
\SetRowColor{LightBackground}
\mymulticolumn{2}{x{5.377cm}}{toString()} \tn 
% Row Count 1 (+ 1)
% Row 24
\SetRowColor{white}
\mymulticolumn{2}{x{5.377cm}}{{\bf{2020}}} \tn 
% Row Count 2 (+ 1)
% Row 25
\SetRowColor{LightBackground}
\mymulticolumn{2}{x{5.377cm}}{Thêm kiểu dữ liệu BigInt} \tn 
% Row Count 3 (+ 1)
% Row 26
\SetRowColor{white}
Dynamic import & import trong function lúc nào xài nó không phải import trên đầu \tn 
% Row Count 7 (+ 4)
% Row 27
\SetRowColor{LightBackground}
Nullish coalescing & ?? null và undefined mới tính lấy cái sau \tn 
% Row Count 10 (+ 3)
% Row 28
\SetRowColor{white}
optional chaining & ?. Ex: student?.name \tn 
% Row Count 11 (+ 1)
% Row 29
\SetRowColor{LightBackground}
\mymulticolumn{2}{x{5.377cm}}{globalThis} \tn 
% Row Count 12 (+ 1)
% Row 30
\SetRowColor{white}
Module namespace export\{\{nobreak\}\} & Thay vì import * rồi export thì giờ có thể export trên 1 dòng \tn 
% Row Count 16 (+ 4)
% Row 31
\SetRowColor{LightBackground}
\mymulticolumn{2}{x{5.377cm}}{for in} \tn 
% Row Count 17 (+ 1)
% Row 32
\SetRowColor{white}
\mymulticolumn{2}{x{5.377cm}}{import.meta} \tn 
% Row Count 18 (+ 1)
% Row 33
\SetRowColor{LightBackground}
\mymulticolumn{2}{x{5.377cm}}{{\bf{2021}}} \tn 
% Row Count 19 (+ 1)
% Row 34
\SetRowColor{white}
Logical asignment & ||=  \&\&=  ??= \tn 
% Row Count 20 (+ 1)
% Row 35
\SetRowColor{LightBackground}
Numberic operator & 1\_000\_000  nhìn dễ hơn \tn 
% Row Count 22 (+ 2)
% Row 36
\SetRowColor{white}
\mymulticolumn{2}{x{5.377cm}}{replaceAll} \tn 
% Row Count 23 (+ 1)
% Row 37
\SetRowColor{LightBackground}
\mymulticolumn{2}{x{5.377cm}}{promise.any} \tn 
% Row Count 24 (+ 1)
% Row 38
\SetRowColor{white}
\mymulticolumn{2}{x{5.377cm}}{{\bf{2022}}} \tn 
% Row Count 25 (+ 1)
% Row 39
\SetRowColor{LightBackground}
\mymulticolumn{2}{x{5.377cm}}{Top-level await} \tn 
% Row Count 26 (+ 1)
% Row 40
\SetRowColor{white}
\mymulticolumn{2}{x{5.377cm}}{private class} \tn 
% Row Count 27 (+ 1)
% Row 41
\SetRowColor{LightBackground}
\mymulticolumn{2}{x{5.377cm}}{Object.hasOwn} \tn 
% Row Count 28 (+ 1)
\hhline{>{\arrayrulecolor{DarkBackground}}--}
\end{tabularx}
\par\addvspace{1.3em}

\begin{tabularx}{5.377cm}{x{1.09494 cm} x{3.88206 cm} }
\SetRowColor{DarkBackground}
\mymulticolumn{2}{x{5.377cm}}{\bf\textcolor{white}{API và Postman}}  \tn
% Row 0
\SetRowColor{LightBackground}
Json Server & cung cấp database dạng json sẽ tự tạo được api \tn 
% Row Count 2 (+ 2)
% Row 1
\SetRowColor{white}
Browser & global object là window \tn 
% Row Count 3 (+ 1)
\hhline{>{\arrayrulecolor{DarkBackground}}--}
\end{tabularx}
\par\addvspace{1.3em}

\begin{tabularx}{5.377cm}{x{2.28942 cm} x{2.68758 cm} }
\SetRowColor{DarkBackground}
\mymulticolumn{2}{x{5.377cm}}{\bf\textcolor{white}{Web APIs}}  \tn
% Row 0
\SetRowColor{LightBackground}
\mymulticolumn{2}{x{5.377cm}}{{\bf{Browser URL}}} \tn 
% Row Count 1 (+ 1)
% Row 1
\SetRowColor{white}
\seqsplit{window.location.href} & có thể redirect và có thể back lại trang trước đó =\textgreater{} recomment sử dụng lấy url hiện tại \tn 
% Row Count 7 (+ 6)
% Row 2
\SetRowColor{LightBackground}
window.location.replace\{\{nobreak\}\} & redirect nhưng không back lại được trang trước đó \tn 
% Row Count 10 (+ 3)
% Row 3
\SetRowColor{white}
\seqsplit{window.location.assign} & di chuyển qua trang mới, recomment sử dụng cái này không sử dụng href \tn 
% Row Count 14 (+ 4)
% Row 4
\SetRowColor{LightBackground}
\mymulticolumn{2}{x{5.377cm}}{{\bf{Console API}}} \tn 
% Row Count 15 (+ 1)
% Row 5
\SetRowColor{white}
Log variations & log, info, debug, warn, error \tn 
% Row Count 17 (+ 2)
% Row 6
\SetRowColor{LightBackground}
Multiple values & Với string ``:\{\{nl\}\}\{\{nl\}\}+ \%o =\textgreater{} object\{\{nl\}\}\{\{nl\}\}+ \%s =\textgreater{} string\{\{nl\}\}\{\{nl\}\}+ \%i =\textgreater{} integer\{\{nl\}\}\{\{nl\}\}+ \%f =\textgreater{} float \tn 
% Row Count 23 (+ 6)
% Row 7
\SetRowColor{white}
Assert & show message khi condition là false \tn 
% Row Count 25 (+ 2)
% Row 8
\SetRowColor{LightBackground}
\mymulticolumn{2}{x{5.377cm}}{Counting} \tn 
% Row Count 26 (+ 1)
% Row 9
\SetRowColor{white}
Track time & time, timeLog, timeEnd \tn 
% Row Count 28 (+ 2)
% Row 10
\SetRowColor{LightBackground}
Groups & group, groupEnd, groupCollapsed \tn 
% Row Count 30 (+ 2)
\end{tabularx}
\par\addvspace{1.3em}

\vfill
\columnbreak
\begin{tabularx}{5.377cm}{x{2.28942 cm} x{2.68758 cm} }
\SetRowColor{DarkBackground}
\mymulticolumn{2}{x{5.377cm}}{\bf\textcolor{white}{Web APIs (cont)}}  \tn
% Row 11
\SetRowColor{LightBackground}
\mymulticolumn{2}{x{5.377cm}}{Stack trace} \tn 
% Row Count 1 (+ 1)
% Row 12
\SetRowColor{white}
\mymulticolumn{2}{x{5.377cm}}{Tables} \tn 
% Row Count 2 (+ 1)
% Row 13
\SetRowColor{LightBackground}
Styles & sử dụng \%c \tn 
% Row Count 3 (+ 1)
% Row 14
\SetRowColor{white}
\mymulticolumn{2}{x{5.377cm}}{Clear} \tn 
% Row Count 4 (+ 1)
% Row 15
\SetRowColor{LightBackground}
\mymulticolumn{2}{x{5.377cm}}{{\bf{Storage API}}} \tn 
% Row Count 5 (+ 1)
% Row 16
\SetRowColor{white}
Storage Interface & getItem, setItem, removeItem, clear \tn 
% Row Count 7 (+ 2)
% Row 17
\SetRowColor{LightBackground}
 & - LocalStorage, SessionStorage, hay cookie,… phải parse string rồi mới lưu\{\{nl\}\}- LocalStorage =\textgreater{} đóng tab hay đóng trình duyệt vẫn còn\{\{nl\}\}- SessionStorage =\textgreater{} đóng tab sẽ mất \tn 
% Row Count 17 (+ 10)
% Row 18
\SetRowColor{white}
\mymulticolumn{2}{x{5.377cm}}{{\bf{Browser Network}}} \tn 
% Row Count 18 (+ 1)
\hhline{>{\arrayrulecolor{DarkBackground}}--}
\end{tabularx}
\par\addvspace{1.3em}


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

\end{document}