Skip to content

Instantly share code, notes, and snippets.

@RossComputerGuy
Created January 18, 2022 23:39
Show Gist options
  • Save RossComputerGuy/ca3797f6ba93bfbc54859f7d8ba80958 to your computer and use it in GitHub Desktop.
Save RossComputerGuy/ca3797f6ba93bfbc54859f7d8ba80958 to your computer and use it in GitHub Desktop.
Cursed JavaScript for School
<!DOCTYPE html>
<html>
<head>
<title>Cursed JavaScript</title>
</head>
<body>
<div id="app">
<h1>JavaScript: Everything is an Object</h1>
<p>In JavaScript, everything is an object. This means you can do some very weird things.</p>
<div id="content">
</div>
<h2>RNG</h2>
<p id="rng"></p>
<button id="rng-btn">Generate</button>
</div>
<style>
code {
display: block;
padding-left: 25px;
padding-right: 25px;
padding-top: 2px;
padding-bottom: 2px;
background-color: #a9a9a9;
color: #000;
}
</style>
<script>
(function() {
const rng = document.getElementById('rng');
const rng_btn = document.getElementById('rng-btn');
rng_btn.onclick = function() {
rng.innerText = "Random Number: " + Math.random();
};
rng_btn.onclick();
const content_el = document.getElementById('content');
const contents = [
{ input: '2 + true', out_type: 'number' },
{ input: '2 - false', out_type: 'number' },
{ input: 'typeof (NaN)', out_type: 'string' },
{ input: 'typeof (Infinity)', out_type: 'string' },
{ input: 'NaN + Infinity', out_type: 'number' },
{ input: '"2" + "5"', out_type: 'string' },
{ input: '2 + "5"', out_type: 'string' },
{ input: '10 + 5 % 2', out_type: 'string' },
{ input: '(10 + 5) % 2', out_type: 'string' },
{ input: '"dog" || "cat" || "cow"', out_type: 'string' },
{ input: '"dog" && "cat" && "cow"', out_type: 'string' }
];
const default_fmt = (input) => input.toString();
const type_fmt = {
'string': (input) => `"${input}"`,
'number': default_fmt
};
for (const content of contents) {
const output_pre_fmt = eval(content.input);
const output_fmt_fn = type_fmt[content.out_type] || default_format;
const output = output_fmt_fn(output_pre_fmt);
const el = document.createElement('code');
el.innerHTML = content.input + " = " + output;
content_el.appendChild(el);
}
})();
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment