\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{HelloGirish}
\pdfinfo{
  /Title (variables-js-vs-python.pdf)
  /Creator (Cheatography)
  /Author (HelloGirish)
  /Subject (Variables: JS vs Python 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}{3EA396}
\definecolor{LightBackground}{HTML}{F2F9F8}
\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{Variables: JS vs Python Cheat Sheet}}}} \\
    \normalsize{by \textcolor{DarkBackground}{HelloGirish} via \textcolor{DarkBackground}{\uline{cheatography.com/187623/cs/39153/}}}
\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}HelloGirish \\
  \uline{cheatography.com/hellogirish} \\
  \end{tabulary}
\vfill
\columnbreak
\begin{tabulary}{5.8cm}{L}
  \SetRowColor{FootBackground}
  \mymulticolumn{1}{p{5.377cm}}{\bf\textcolor{white}{Cheat Sheet}}  \\
   \vspace{-2pt}Published 9th June, 2023.\\
   Updated 9th June, 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{tabularx}{17.67cm}{x{8.635 cm} x{8.635 cm} }
\SetRowColor{DarkBackground}
\mymulticolumn{2}{x{17.67cm}}{\bf\textcolor{white}{Variables}}  \tn
% Row 0
\SetRowColor{LightBackground}
{\bf{Javascript}} & {\bf{Python}} \tn 
% Row Count 1 (+ 1)
% Row 1
\SetRowColor{white}
{\bf{Declaration}} \{\{nl\}\} using the {\bf{var, let, or const}} keywords & {\bf{Declaration}} \{\{nl\}\}Created simply by assigning a value. No explicit declaration is required. \tn 
% Row Count 6 (+ 5)
% Row 2
\SetRowColor{LightBackground}
{\bf{Dynamically typed}} \{\{nl\}\} The type of a variable can change during runtime. & {\bf{Dynamically typed}} \{\{nl\}\} Allow variables to hold values of different types throughout their lifetime. \tn 
% Row Count 12 (+ 6)
% Row 3
\SetRowColor{white}
{\bf{Scoping}} \{\{nl\}\}  Variables have function-level scope, meaning they are accessible within the function they are defined in. Variables declared with var are also hoisted, allowing them to be accessed before their actual declaration. & {\bf{Scoping}} \{\{nl\}\}  Variables have block-level scope, meaning they are accessible within the block they are defined in. Python does not have variable hoisting. \tn 
% Row Count 24 (+ 12)
% Row 4
\SetRowColor{LightBackground}
Variables in JavaScript typically follow camelCase naming convention \{\{nl\}\} (e.g., myVariable, firstName, totalAmount). & Variables in Python typically follow snake\_case naming convention \{\{nl\}\} (e.g., my\_variable, first\_name, total\_amount). \tn 
% Row Count 30 (+ 6)
\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}{Variables (cont)}}  \tn
% Row 5
\SetRowColor{LightBackground}
Variables can be declared without an initial value, and they will have the value undefined until assigned a value. variables do not have default values. & Variables need to be assigned an initial value when they are created. Otherwise, a NameError will occur. variables have default values of None for non-primitive data types, and 0 for primitive data types. \tn 
% Row Count 11 (+ 11)
% Row 6
\SetRowColor{white}
Variables declared outside of any function or block have global scope and can be accessed from anywhere in the code. & Variables declared outside of any function or block have global scope, but accessing them from within a function requires the {\bf{global}} keyword. \tn 
% Row Count 19 (+ 8)
% Row 7
\SetRowColor{LightBackground}
The null and undefined values are different. null indicates that a variable has no value, while undefined indicates that a variable has not yet been defined. & There is only one value for "no value", which is None \tn 
% Row Count 27 (+ 8)
% Row 8
\SetRowColor{white}
JavaScript has a dynamic type system, which means that the type of a variable can change at runtime. & Python has a static type system, which means that the type of a variable is known at compile time. \tn 
% Row Count 32 (+ 5)
\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}{Variables (cont)}}  \tn
% Row 9
\SetRowColor{LightBackground}
variables can be assigned values using the equal sign (=) & variables can be assigned values using the equals sign (=) or the colon (:) \tn 
% Row Count 4 (+ 4)
% Row 10
\SetRowColor{white}
variables are mutable by default. This means that their values can be changed after they are assigned. & variables are immutable by default. This means that their values cannot be changed after they are assigned. \tn 
% Row Count 10 (+ 6)
% Row 11
\SetRowColor{LightBackground}
two variables are equal if they have the same value, regardless of their type & two variables are equal if they have the same type and the same value. \tn 
% Row Count 14 (+ 4)
% Row 12
\SetRowColor{white}
primitive data types: undefined, Boolean, String, Number, BigInt, Symbol, and null & primitive data types: int, float, bool, and str \tn 
% Row Count 19 (+ 5)
% Row 13
\SetRowColor{LightBackground}
type coercion is automatic. This means that if you try to perform an operation on two values of different types, the values will be automatically converted to the same type before the operation is performed. & type coercion is not automatic. You must explicitly convert values to the desired type before performing an operation on them. \tn 
% Row Count 30 (+ 11)
\hhline{>{\arrayrulecolor{DarkBackground}}--}
\end{tabularx}
\par\addvspace{1.3em}

\begin{tabularx}{17.67cm}{x{10.0166 cm} x{7.2534 cm} }
\SetRowColor{DarkBackground}
\mymulticolumn{2}{x{17.67cm}}{\bf\textcolor{white}{Strings}}  \tn
% Row 0
\SetRowColor{LightBackground}
{\bf{Javascript}} & {\bf{Python}} \tn 
% Row Count 1 (+ 1)
\hhline{>{\arrayrulecolor{DarkBackground}}--}
\end{tabularx}
\par\addvspace{1.3em}

\begin{tabularx}{17.67cm}{x{10.0166 cm} x{7.2534 cm} }
\SetRowColor{DarkBackground}
\mymulticolumn{2}{x{17.67cm}}{\bf\textcolor{white}{Array or List}}  \tn
% Row 0
\SetRowColor{LightBackground}
{\bf{Javascript}} & {\bf{Python}} \tn 
% Row Count 1 (+ 1)
\hhline{>{\arrayrulecolor{DarkBackground}}--}
\end{tabularx}
\par\addvspace{1.3em}



\end{document}