The data type for plain language

// RULE 1: Must be between balanced quotes
typeof 'Javascript is awesome!'; // 'string'

// RULE 2: Escape special characters
'Can\'t beat Javascript so don\'t try';

// RULE 3: Can have numbers, symbols, ANYTHING
'Jenny\'s #: ($%@)867-5309';

// Indexed, starting at 0
'Dancing in the street'[0]; // "D"
 0123456789...

// Immutable 
'I hear, the secrets that...'
 0123456789...

// Iterable (can loop through)
for (var index = 0; index < 9; index++) {
  console.log('JavaScript'[index]);
} 

[2] = 'f';

// NOPE!!! 

// "J", "a", "v", "a", "S", "c", "r", "i", "p", "t"

// How many characters?
'Don\'t sweat the technique'.length // 24

// Convert to uppercase
'dance, magic dance!'.toUpperCase // 'DANCE, MAGIC DANCE'

// Where is the letter
'Borderline!'.indexOf('r'); // 2

// Search for other Javascript string methods
// Use them when possible

Just do all the stuff you do with numbers...

JavaScript Memory

563463456...

2357

45.3346636...

13

// Numbers are numbers
13, 2357, 5634634564356456

// Decimals too
45.33466362363

// Oh! Negative nums
-45324543

-45324543

// Javascript Numbers

// Mathmatical operations
> 21 + 7: // ???

> 3.14 + 5: // ???

> 3 * 5; // ???

> 15 / 3 // ???

> 15 % 9; // ???

JavaScript Memory

3 * 5

3.14 + 5

15 / 3

21 + 7

15 % 9

// Javascript Numbers

// Mathmatical operations
> 21 + 7: // ???

> 3.14 + 5: // ???

> 3 * 5; // ???

> 15 / 3 // ???

> 15 % 9; // ???

JavaScript Memory

15

8.4

5

28

6

// Javascript Numbers' "METHODS"

// Is this a number?
typeof 523454      // ???

// 'STRINGIFY' this number
55.00.toString();  // ???
77.toString();     // ???
(99).toString();   // ???

// Numberify a 'STRINGIFIED'
Number('453');     // ???

JavaScript Memory

ERROR

55

"99"

"number"

453

// Javascript Numbers Methods

// When adding numbers
600 + '400'; // ???

// When using some methods
54.435345.toFixed(2); // ???

// Combining methods and operations
10 + 54.435.toFixed(2); // ???

// Just to be safe???
Number(10 + 54.435.toFixed(2)); // ???

JavaScript Memory

"1054.44"

"54.44"

Try it!

"600400"

JavaScript Memory

64.44

54.441

1054.44

True, False | Truthy <> Falsy

// No grey areas, evaluates explicitly to true or false

> true; // Stevie Wonder is a musical genius

> false; // Is water dry?

// Not explicitly true or false, "If I had to pick one"

// "Truthy" <> Drake is more pop music than anything
> 1, 'string', {one: 1}, [1, 2];

// "Falsy" <> Preston's pants are too colorful
> -1, 0, null, undefined, "", {}, []; 

// Relative Equivalence

JavaScript Memory

false

true

true

// Is 4 equal to 4
> 4 === 4; // ???

// Is 4 not equal to 5
> 4 !== 5; // ???

// Is 4 greater than 5
> 4 > 5; // ???

JavaScript Memory

false

false

true

// Is this the correct data type?
> typeof 'B, BBoys and [B]Girls' 

// Is this the correct data type?
> typeof 'Love is a battlefield!' 

// Is this the correct data type?
> typeof function letsDance() {} 

=== "string";

=== "number";

=== "function";

JavaScript Memory

false

> // Write a function that returns true 
  // if 'Moose rocks dance floors' EVALUATES to true
  (function() {

    // If the condition fails return false
    return false;
  })() // ???

    // Check if 'Moose rocks dance floors' is EQUAL to TRUE
    if ('Moose rocks dance floors' === true) {

JavaScript Memory

false

       // if yes, break the function and return true
       return true;
    }

JavaScript Memory

true

> // Create function that asks a user who the 5 goat rappers are
  (function() {
    var isTheGoat = false;

  })();

    // Google it!
    var goat = prompt("Who are the 5 goat rappers?").toUpperCase();

JavaScript Memory

false

    // Check if the 'goat' is the correct answer
    if (goat === 'DYLAN') {      
      // Is the goat?
      isTheGoat = true;

      // if correct, tell us who
      for (var i = 0; i < 5; i++) { alert(goat + '!') };
      

      // Then tell us why
      setTimeout(function() {alert('BECAUSE I SPIT HOT FIRE!')}, 2000);
      
     

      // Break out of the function and tell us the 'truth' 
      return isTheGoat; // OPTIONAL    
    }

    return isTheGoat; // true or false no matter what
  

JavaScript Memory

>// Does Moose rock dance floors?
 if ('Moose rocks dance floors!!!') {
    
    
    
  
 } // ???

JavaScript CONSOLE

    // If yes, print true
    console.log(true);

undefined

true

Absolute Equivalence

• true | false

Relative Equivalence

'falsy':

'truthy':

Let's make stuff happen!!!

Mathematical

• Addition - ( + )
• Subtraction - ( - )
• Multiplication - ( * )
• Division - ( / )
• Modulus - ( % )
• Increment - ( ++ )
• Decrement - ( -- )
• Greater than - ( >, >= )
• Less than - ( <, <= )

Access/Assign

• Brackets - ( [ ] )
• dot - ( . ) 
• Assignment - ( = )
• Assignment - ( += )
• Assignment - ( -= )

Comparison

• Equality ( === )
• Not equal ( !== )

Logical

• And - ( && )
• Or - ( || )
• Not - ( ! )

Ignore

• ( == )
• ( != )

Other

• Grouping - ( )
• Ternary - ( ? )

Keywords

• var
• function
• for
• in
• typeof
• this
• new

I quit!!!

Mathematical

• Addition - ( + )
• Modulus - ( % )

Access/Assign

• Brackets - ( [ ] )
• dot - ( . ) 
• Assignment - ( = )

Comparison

• Equality ( === )
• Not equal ( !== )

Ignore

• ( == )
• ( != )

Keywords

• typeof

Current concerns...

remember,

don't worry about:

Phew!!!

JavaScript Memory

"I would walk 500 miles..."

"I want to ride my BICYCLE!!!"

9

// Review the slides on numbers if necessary
> 5 + 4; // Self explanatory
> 12 % 4; // Modulus, gets the remainder

// One more thing...
'I want to ride my' 

// What about...
'I would walk ' + 500 + ' miles...' //???

8

+ ' BICYCLE!!!'; // ???

String 'concatenation'

For more complex operations, read the docs!

JavaScript Memory

true

// Are these the same? (in terms of ASCII)
> 1000 === 1000; // ???
> 5000 !== 5000; // ???

// And these...?
> 'Basketball' !== 'and Mr. Curtis Blow'; // ???
> 'Sussudio' === 'Sussudio'; // ???

// What about types?
typeof 'Do the Beat Street Strut!'; // ???
typeof { starlight: 'startbright'}; // ???
typeof 8675309; // ??? 
typeof function() {}; // ???

false

true

true

"object"

"string"

"number"

"function"

Again,  DO NOT use '!=' or '=='

// 'Assignment Operator' (NOT EQUALS!)
> var planet = 'rock!'; // (see variables)

// Arrays [bracket notation only]
['Don\'t', 'stop', 'the', planet][3]; // ???
['do', 'the', 'conga'][3] = 'beat'; // ???

// Objects
> { }['first'] = 'Gloria'; // ???
> { first: 'Gloria' }.last = 'Estefan'; // ???
> { music: 'is gonna get you!' }['music']; // ???

Just a quick intro, more on these later.

JavaScript Memory

"rock!"

"rock!"

{ "first":"Gloria" }

['do', 'the', 'conga', 'beat']

"is gonna get you!"

{ 
  "first":"Gloria",
  "last":"Estefan" 
}

Oh wait, I need to use that again

'Stevie Nicks'

'Edge of Seventeen'

001

002

Slot

JavaScript Memory

// Proper Declaration
> var name = 'Stevie Nicks'; 
> var song = 'Edge of Seventeen'; 

// Don't use (for now)
window.newerName = 'Charlie Parker';
window.newerSong = 'Early in the Morning';

// NEVER USE
newName = 'Eddie Money';
newSong = 'Take me home tonight';

Bad convention: 'new___'

// Declare and assign at the top of your scope/code
2 > var favBand = 'Earth Wind and Fire';
3 > var favSong = 'Fantasy';
4 
5 > console.log(favBand, favSong);

// Good Examples (declarations only)
> var songsArray;     // Descriptive of the reference
> var artistName;     // Single word
> var templeOfTheDog; // 'camelCase': hungryHungryHungry

// Words not to use (your code will break):
// > var new, var, in, function, String, Number, break, typeof...
// Basically, If your editor highlights the word, don't use it!

// Bad Examples (declarations only)
> var SongTitles;  // Start with lowercase
> var tracknumber; // Use camelCase
> var newArray;    // Of what?
> var &no$yb@ls;   // Code will break

Use 'console.log' to check values

'David'

'Bowie'

001

002

Slot

JavaScript Memory

> firstNameAgain;

> var firstNameAgain = 'David';

// What is Javascript doing?
> firstName = 001;
> lastName = 002;

// Proper Declaration
> var firstHame = 'David';
> var lastName = 'Bowie';

003

'David'

 = 003;

'StevieWonder'

'Stevie Wonder'

'Stevie'

'Wonder'

// Proper Declaration
> var firstHame = 'Stevie';
> var lastName = 'Wonder';

// We want his full Name
> firstName + lastName; 
// 'Stevie' + 'Wonder'

// Fix the formatting
> firstName + ' ' + lastName; 
// 'Stevie' + ' ' + 'Wonder'

JavaScript Memory

Reference Error

// Print the fullName
console.log(fullName); // ???

Slot

JavaScript Memory

JavaScript Console

'Scott Weiland'

'Scott'

JavaScript Memory

undefined

'Scott Weiland'

'Scott'

JavaScript Console

'Scott Weiland'

Makes a copy for 'primitive' types.

// Declare before using
> var fullName = 'Scott Weiland';
> var firstName = fullName.split(' ')[0];

> console.log(fullName); // ???
> console.log(firstName); // ???

34 // What's gonna happen?
35 > console.log(stoneTemplePilots); // ???
36 > var stoneTemplePilots = fullName; // ???

// Overwriting
> fullName = 'Stone Temple Pilots'; // ???
> console.log(fullName); // ???

'Declared' or 'namespaced' but not 'defined' before it's used. Hence 'undefined'

001

002

Slot

003

// 001

// 002

'Stone Temple Pilots'

004

'Stone Temple Pilots'

// 004

// 003

// 001

// 002

// 004

'Radio'

'Head'

JavaScript Memory

'Radio Head'

JavaScript Console

'Radio Head'

How does the interpreter work?

1 // Top of code scope
2 > var firstName; // undefined
3 > var lastName; // undefined
// skip lines 4 - 53

001

002

Slot

003

54 > lastName => 002 // 'Head'

55 > firstName => 001 // 'Radio'

53 // When we do this:
54 > var firstName = 'Radio';
55 > var lastName = 'Head';
56 > console.log(firstName + ' ' + lastName);

54 > lastName = 'Head' 
55 > firstName = 'Radio'
56 > console.log(lastName + ' ' + firstName);

56 > console.log(001 + ' ' + 002); // ???

56 > console.log(firstName + ' ' + lastName);

Create a 'namespace' and'hoist' anything with the 'var' keyword to the top of the scope

Execute the statement depending on the variables.

Then assign them

// 003