JavaScript Basics - 1

gistfile1.js

//
// What Javascript is Made of
// It ain't sugar, spice, and everything nice, but it'll do
//



///////////////////////////////////////////////////////////////////////////////////////
// Variables
// Javascript is reference based, meaning that variables only ever point to a piece of data. Defining a variable lets you use a piece of data elsewhere.
//

// NOTE: This is global, meaning no matter where you set the variable, it will be available everywhere
name = 'Timothy Kempf';

// This is scoped. This variable will only exist inside the "scope" it exists in. You'll learn about that later
// NOTE: since this scope is global, this variable is technically global too!
var scoped_name = 'Timothy Kempf';



///////////////////////////////////////////////////////////////////////////////////////
// Booleans
// Either true or false, that's it
//

var my_boolean = true;
var my_boolean2 = false;
// and we're all out.


///////////////////////////////////////////////////////////////////////////////////////
// Integers
// Integers are whole numbers, negative and positive
//

var my_integer = 5;
var my_integer2 = -5;
var my_integer3 = 2342349573498574389589345895345;



///////////////////////////////////////////////////////////////////////////////////////
// Floats
// Floating point numbers. Basically anything with a decimal point
//

var my_float = 5.5;
var my_float2 = -5000.4353;



///////////////////////////////////////////////////////////////////////////////////////
// Strings
// Letters/numbers/characters, are generally used to store text or words
//

var my_string = 'My name is Timothy Kempf. I make websites and sandwiches.';
var my_string2 = '   \' You can escape special characters with backslashes';

// NOTE: This is NOT an integer! When numbers are wrapped in quotes they're strings just like anything else!
var my_string3 = '54';



///////////////////////////////////////////////////////////////////////////////////////
// Arrays
// Groups of other javascript data types
//

var my_array = [ 0, 1, 2, 3, 4, 5 ];

// NOTE: You can put whatever you want into arrays, including other arrays, variables, etc. my_array will be the array we defined just before.
var my_array2 = [ 'anything can go in these', 23.4, 0, 'they\'re awesome', my_array ];

// NOTE: This is how you access data inside of an array! Remember that computers count from 0
my_array[0] === 0;
my_array[3] === 3;

my_array2[0] === 'anything can go in these';
my_array2[4] === my_array;



///////////////////////////////////////////////////////////////////////////////////////
// Objects
// Groups of other javascript data types, arranged with "keys"
//

var my_object = {
  my_key: 'my value',
	my_key2: 'my other value',
	my_key3: 3,
	my_key4: my_array
};

// NOTE: This is how you access data inside of an array! You use the name of the key to get what you want...
my_object['my_key'] === 'my value';
my_object['my_key4'] === my_array;

// NOTE: You can also access data like this. This is usually how you access data in objects
my_object.my_key2 === 'my other value';



///////////////////////////////////////////////////////////////////////////////////////
// Functions
// Blocks of executable code
//

// NOTE: This is how you assign a function globally. You pretty much never do it this way if you're cool
function addIntegers( integer_1, integer_2 ){
	
	return integer_1 + integer_2;
	
};

var multiplyIntegers = function( integer_1, integer_2 ){
	
	return integer_1 * integer_2;
	
};

// NOTE: This is how you access a function
that_cool_integer_function = addIntegers;

// NOTE: This is how you run a function
var result = multiplyIntegers( 5, 3 );
// result is 15



///////////////////////////////////////////////////////////////////////////////////////
// Regular Expressions
// Use these to match strings, or parts of strings
// Regex is a world unto itself. For now, just know what these look like.
//

var my_regex = /a/;

my_regex.test('a');
// this returns true

// NOTE: They usually end up looking worse than this
var youtube_id_regex = /(www\.youtube\.com\/watch)|(youtu\.be\/.{11})/;



///////////////////////////////////////////////////////////////////////////////////////
// EXTRA: Identifying what jQuery is made out of!
//

// This is a function! Note the parentheses. Javascript variables can actually use any unicode character for a name, jQuery uses $ for short
$();

// This is a function nested inside of an object!
$('html').append('<div>Hi mom!</div>');

// Since every time a jQuery function runs, it returns the original jQuery $ object again, you can do things like this
$('html').append('<div>Hi dad!</div>').append('<div>Hi sis!</div?').append('<div>Hi bro!</div>');

// Some jQuery functions return something that is not the jQuery $ object
$('html').html();
// This returns the contents of the <html> tag as a string