Skip to content

J
javascript-demo
Commit 009ccf6d authored by Kyle Muldoon's avatar Kyle Muldoon
Browse files
Options

adding demo file

parent bddca624
Show whitespace changes
Inline Side-by-side
Showing with 153 additions and 0 deletions
conceptsDemo.html 0 → 100644
View file @ 009ccf6d
<html>
<head>
<style>
code {
font-family: Consolas,"courier new";
color: crimson;
background-color: #f1f1f1;
padding: 2px;
font-size: 105%;
display: block;
background: none;
white-space: pre;
-webkit-overflow-scrolling: touch;
overflow-x: scroll;
max-width: 100%;
min-width: 100px;
}
display: block;
background: none;
white-space: pre;
-webkit-overflow-scrolling: touch;
overflow-x: scroll;
max-width: 100%;
min-width: 100px;
padding: 0;
</style>
</head>
<body>
<header>
<h1>JavaScript: Demonstration of basic concepts</h1>
<hr>
</header>
<div class="conceptsContent">
<!-- ============================================================= -->
<div class="concept" id="variables">
<h2>Variables</h2>
<script>
var color = "Orange";
function myFunc() {
let color2 = "Blue";
document.write(color2);
}
let adder = (int1) => {
let total = int1;
return (int2) => {
return total + int2;
}
}
</script>
Global Variables:
<script>document.write(color);</script>
<br>
Local Variable in function:
<script>myFunc();</script>
<br>
Nested Funcions
<script>
let numFunc = adder(10);
document.write(`${numFunc(12)}`);
</script>
<br>
<hr>
</div>
<!-- ============================================================= -->
<div class="concept" id="functions">
<h2>Functions</h2>
<script>
function printUsername(username) {
document.write(username);
}
</script>
Function to print username:<br>
<code>
printUsername("kMuldoon@nisum.com")
</code>
<br>
<script>printUsername("kMuldoon@nisum.com")</script>
<br><br>
Self invoking anonymous function sqaure a number:
<br>
<code>((n) => document.write(n * n))(10);</code>
<br>
<script>
((n) => document.write(n * n))(10);
</script>
<hr>
</div>
<!-- ============================================================= -->
<div class="concept" id="conditionals">
<h2>Conditionals</h2>
<h4>IF ELSE-IF ELSE</h4>
<code>
let name = "kyle"; <br>
if (name === "bob") {
document.write("bob was here");
}
else if (name === "joe") {
document.write("joe was here");
}
else {
document.write("Kyle was here");
}
</code>
<script>
let name = "kyle";
if (name === "bob") {
document.write("bob was here");
}
else if (name === "joe") {
document.write("joe was here");
}
else {
document.write("Kyle was here");
}
</script>
<h4>SWITCH</h4>
<hr>
</div>
<!-- ============================================================= -->
<div class="concept" id="loops">
<h2>Loops</h2>
<hr>
</div>
</div>
</body>
</html>
\ No newline at end of file
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment