Javascript Data Types

Part 1

Primitive Data Types

Immutables (not changeables)

// Primitive Data Types 
String // 'Javascript is awesome!', "Really awesome!"
Number // 4, 150, 2345, 3.1459, -8675309
Boolean // true, false, -1, 0, 1, 
null // "defined" as no value
undefined // not yet defined (default)

Strings

The data type for plain language

Strings

// Javascript Strings

// 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';

Strings

// Javascript Strings

// 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 < 10; index++) {
  console.log('JavaScript'[index]);
} 

[2] = 'f';

// NOPE!!! 
// "J", "a", "v", "a", "S", "c", "r", "i", "p", "t"
// String Methods (helpers)

Strings Methods (helpers)

// How many characters?
'Don\'t sweat the technique'.length; // 25
// 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

Strings

  • Primitive Javascript Data Type
  • Immutable (no editing)
  • Characters, symbols, numbers
  • Escape special characters
  • Must be between balanced quotes
Key Takeaways

Strings Exercises!

Instructions:
"Coding tiiiime"

Numbers

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

Numbers

// Javascript Numbers

JavaScript Memory

563463456...

2357

45.3346636...

13

// Numbers are numbers
13, 2357, 5634634564356456
// Decimals too
45.33466362363
// Oh! Negative nums
-45324543

-45324543

Numbers

// 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

Numbers

// Javascript Numbers

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

> 3.14 + 5; // ???

> 3 * 5; // ???

> 15 / 3; // ???

> 15 % 9; // ???

JavaScript Memory

15

8.4

5

28

6

Numbers Methods(helpers)

// 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

Numbers Methods(helpers)

// 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"

Be Careful and pay attention to detail!

JavaScript Memory

64.44

54.441

1054.44

Numbers Methods (helpers)

// Javascript Numbers Methods

// What's this???
Number(10 + 54.435.toFixed(2)); 

Be Careful and pay attention to detail!

// And what about this?
Number(54.435.toFixed(2) + 10); 
// And this?
Number(54.435345.toFixed(2)) + 10; 
// Javascript Numbers Methods

Numbers

  • Primitive Javascript Data Type
  • Immutable (no editing)
  • Do number stuff
  • Be careful when using methods
  • Be when using with strings
  • Review documentation for the 'Math' JS library
Key Takeaways

Numbers

Exercises
Instructions:

Booleans

True, False | Truthy <> Falsy

Booleans

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

// Absolute Equivalence
> 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
> true, 1+, 'string', {}, [];
// "Falsy" <> Preston's pants are too colorful
> false, 0, null, undefined, "", NaN; 
// Relative Equivalence

"Bool"

// Absolute 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; // ???

"Bool"

// Absolute Equivalence

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";

"Bool"

// Absolute Equivalence

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;
    }

"Bool"

// Absolute Equivalence











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
  

"Bool"

// Relative Equivalence

JavaScript Memory

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

JavaScript CONSOLE

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

Booleans

Absolute Equivalence

Key Takeaways
  • Positive numbers (1, 2, 3)
  • "string value"
  • [  ] - (arrays)
  • { } - (objects)
  • true | false

Relative Equivalence

  • false
  • 0
  • NaN
  • "" - (empty string)
  • null, undefined

'falsy':

'truthy':

Booleans

Exercises
Instructions:

Javascript Data Types - Part 1

By telegraphprep

Javascript Data Types - Part 1

This is an introduction to the primitive Javascript data types

  • 1,330