Feb 27, 2014

JavaScript cheat-sheet: Basic

If you are here to learn how to code in JavaScript, I highly suggest you DON'T use this as your only resource. Go to CodeAcademy or w3schools to get a more comprehensive guide to coding.

=== means equals to (useful in if statements)
!== means not equal to (again, useful in if statements)

Primitive Data Types:
Strings are created simply by opening up a pair of quotation marks (")
Numbers are integers or floats (such as 4 or 3.14)
Booleans are only true and false values (you simply write "true" or "false", without quotes)

% is the modulo operator. It prints the remainder of division operation.

confirm("Do you want to continue?");
Will display a confirm dialogue box. Returns a true or false.

alert("Something went wrong");
Only displays a dialogue box (use if you do not care about user input)

prompt("Enter in your name:");
Will display a dialogue box with text input. Returns the input as a string.

console.log("This message will be printed to your console (not the HTML page)");
Prints a message to the JavaScript console (this is usually found on a developer dashboard in browsers)

"This is a string".length;
Returns the character length of a string

"This is a string".substring(x, y);
Print out the portion of the string, with 'x' the character to start cutting from and 'y' the final character

var name = "String";
Assigning a variable (in this case a string)

"This is a String".match(/string/i)
This is string pattern matching, or Regular Expressions. Please see elsewhere how to use Regular expressions

var newArray = ["item 1", "item 2"];
Assiging an array of items.

var newFunction = function(variable) { return variable; };
Declaring a new function called newFunction, which can be called as newFunction("String")

var newObject = { key: "value", key2: 10, key3: function(value){ return value; } };
Declares a new object called newObject, with three properties.

var testObject = new newObject; testObject.key;
Declaring a new testObject of type newObject, and accessing the 'key' property

if (true) { return "True"; } else { return "False"; }
An "IF" conditional statement (with optional "ELSE")

for (var i = 0; i < condition; i++) { condition--; }
A "FOR" loop statement, with increment and decrement operators

switch (name) { case "value": return name; break; default: return false; }
A "SWITCH" or "CASE" statement.

while (value < 5) { value++; }
A "WHILE" loop.

try { arbitraryFunction(); } catch (err) { alert(err) }
A "try-catch" block.

throw "This is an error message";
An error thrown that is meant to be caught by a try-catch block. This just throws a simple string.

Math Object constants
Math.E
Math.PI
Math.SQRT2
Math.SQRT1_2
Math.LN2
Math.LN10
Math.LOG2E
Math.LOG10E

Math.round(4.13);
Rounds the number to the nearest integer (in this example it will output 4)

Math.random()
Output a pseudo-random number between 0 and 1

document.getElementById("id");
Returns the HTML DOM element that matches the given id string

document.getElementsByClassname("class");
Returns the array of HTML DOM elements that matches the given class string

document.getElementById("id").innerHTML;
Gets (or sets) the HTML that is in between the element tag (make sure you note the capitalisation)

document.createElement("name");
Creates an DOM element (but it is not attached automatically!)