JS practice

<!DOCTYPE html>
<html>

  <head>
    <link rel="stylesheet" href="style.css">
    <script src="script.js"></script>
    
    <script type=text/javascript>
      var abc = 'inline script';
      console.log(abc);
    </script>
    
    <script src="test.js"></script>
    
    <script src="dynamic.js"></script>
    
    <script src="structures.js"></script>
    
  </head>

  <body>
    <h1>Hello Testing Javascript!</h1>
    <div>
      <article>
        <header>
          <h3>Let's learn!</h3>
        </header>
        <section>
          <p>Javascript is okay.</p>
        </section>
      </article>
    </div>
  </body>

</html>

// Code goes here
console.log('Hey there buddy.')

// variables var take anything
var w = 5.654;
var x = 66;
var y = "yo yo yo";
var z = true;

// not a number
var none = NaN;

console.log(typeof w);


// Let's do some addition
var nothing = null;
// arrays
var something = [4 , 2];

// concats them
console.log(nothing + something);

var somethingbig = [5, 6, 7, 8];

// concats 2 and 5 in one index!
console.log(something + somethingbig);


// Subtract
var ac = 5;
var ad = '3';

// we get 2.
console.log(ac - ad);


// Lets call functions
var numA = 3;
var numB = 5;

calcAdd(numA, numB);

// Functions
function calcAdd(a, b){
  // strings are concatenated
  console.log('function: calcAdd = ' + a + b);
  // by adding parentheses it adds the numbers with
  // + as a math function
  console.log('function: calcAdd = ' + (a + b));
}

function calcAddAge(a, b){
  // strings are concatenated
  return a + b;
}

/* Styles go here */

This is just for javascript pratice...
Javascript is okay.

console.log('this is test.js');

// strict enforces strong 'typing'...?
"use strict";

// object
var Anime = {
  name: 'Ichigo',
  age: 15,
  power: 999
};

console.log(typeof Anime + ' ' + Anime.name + ' ' + Anime.age + ' ' + 
Anime.power)


// Hoisting
a = 'hoisting';
console.log(a + ' var a');
var a;


// Lets pass an object and call our function
var goodAge = 3;

console.log(Anime.name + ' before: ' + Anime.age);
console.log(Anime.age = calcAddAge(Anime.age, goodAge));
console.log(Anime.name + ' after: ' + Anime.age);

// if statement

if (Anime.age >= 18) {
  console.log(Anime.name + ' is an adult!');
} else if (Anime.age >= 21) {
  console.log(Anime.name + ' can drink juice!');
} else {
  console.log(Anime.name + ' is hiding.');
}

// more if, null is false, anything not 0 is true

var numCondition = 3;
var strCondition = 'lala';

if (numCondition) {
  console.log('numCondition: ' + numCondition + ' is true!');
} else {
  console.log('not true.');
}

if (strCondition) {
  console.log('strCondition: ' + strCondition + ' is true!');
} else {
  console.log('not true.');
}


// Now other things
// Undefined and false except with null
console.log('With NaN: ' + (NaN == NaN));
console.log('With undef: ' + (undefined == null));

// dynamic typing, which means any var can be anything
// js don't care...

var var1 = 5;
var Var1 = 10;

console.log('Dynamic ' + var1);
console.log('Dynamic ' + Var1);

// this is why typescript is better
var1 = '15';

console.log('Dynamic reassign ' + var1);


// Now let's look at switches.
// You can also remove break, to run other cases.
var winner = 3;

switch(winner) {
  case 1:
    console.log('winner: 1.');
    break;
  case 2:
    console.log('winner: 2.');
    break;
  case 3:
    console.log('winner: 3.');
    break;
  case 4:
    console.log('winner: 4.');
    break;
  default:
    console.log('winner: default.');
}

switch(winner) {
  case 1:
    console.log('new winner: 1.');
    break;
  case 2:
    console.log('new winner: 2.');
    break;
  case 3:
    // runs
    console.log('new winner: 3.');
  case 4:
    // runs
    console.log('another new winner: 4.');
    break;
  default:
    console.log('new winner: default.');
}

// let's practice control structures

console.log('-- structures --');

for (var d = 0; d < 3; d++) {
  console.log('for d: ' + d);
}

// inefficient for loops, but we can break
// and also continue
for (var n = 0; n < 2; n++) {
  for (var m = 0; m < 4; m++) {
    for (var o = 0; o < 2; o++) {
      console.log('triple multiply: ' + (n*m*o));
    }
    // we can also break out if m gets to 3
    if (m == 3) {
      break;
      // continue;
    } else {
      console.log('triple multiply: breakout!');
    }
  }
}

// you can also change your conditions in the for loop.
// make it anything you want.

var h = true;
for (var f = 5; f > 0; f-- ) {
  if (f % 2 === 0 && h) {
    console.log('f % ' + f + ' is even!');
  }
}


//// this crashes.
// var switcher = true;
// for (var xx = 0; (xx < 5 && switcher === true); x++) {
//   if ( xx % 2 === 0) {
//     // if even
//     console.log('switcher: ' + xx);
//   } else {
//     // it's odd, do nothing
//   }
// }
//// major crash