Javascript Flashcards

assignment operator

x = 10

undefined (JS)

document.write();

turns special characters into strings

'Hello \'you\' there'

Boolean

"real" values

boolean

0 (zero), null, undefined, empty string

Modulus

10 % 3 = 1

Increment

var i = 1; i++; now i=2

Decrement

var i = 1; i--; now i=0

checks whether the operands' values are equal

var num = 10; // num == 8 will return false

equal and of same type

AND

Returns true, if both operands are true

OR

Returns true, if one of the operands is true

NOT

Returns true, if the operand is false, and false, if the operand is true

variable = (condition) ? value1: value2

assigns a value to a variable, based on some condition

if (condition) { statements }

a popup alert box that contains the information provided in parentheses

if (expression) { // executed if condition is true } else { // executed if condition is false }

specify a new condition if the first condition is false

switch (expression) { case n1: statements break; case n2: statements break; default: statements }

breaks out of the switch block

specifies the code to run if there is no case match

for (statement 1; statement 2; statement 3) { code block to be executed }

for (i=1; i<=5; i++) { document.write(i + "
"); }

while (condition) { code block }

var i=0; while (i<=10) { document.write(i + "
"); i++; }

var i=20; do { document.write(i + "
"); i++; } while (i<=25);

breaks only one iteration in the loop, and continues with the next iteration

A certain block of code that can be reused over and over again

function name() { //code to be executed }

function myFunction() { alert("Calling a Function!"); } myFunction(); //Alerts "Calling a Function!"

functionName(param1, param2, param3) { // some code }

The prompt() method takes two parameters.

var user = prompt("Please enter your name"); alert(user);

var result = confirm("Do you really want to leave this page?");

list of values that are written as name:value pairs

var person = { name: "John", age: 31, favColor: "green", height: 183 };

used to count the number of characters in a property or string.

var course = {name: "JS", lessons: 41}; document.write(course.name.length); //Outputs 2

Methods are functions that are stored as object properties.

objectName.methodName()

function person(name, age, color) { this.name = name; this.age = age; this.favColor = color; }

var p1 = new person("John", 42, "green");

refers to the current object

store multiple values in a single variable

var courses = new Array("HTML", "CSS", "JS");

allows you to join arrays

var c1 = ["HTML", "CSS"]; var c2 = ["JS", "C++"]; var courses = c1.concat(c2);

var number = Math.sqrt(4); document.write(number); //Outputs 2

calls a function or evaluates an expression at specified intervals (in milliseconds)

setInterval(calc, 2000);

var d = new Date(); //d stores the current date and time

consists of a year, a month, a day, an hour, a minute, a second, and milliseconds

Document Object Model

object oriented model of a page's logical structure

The DOM represents a document as a tree structure. HTML elements become interrelated nodes in the tree.

the owner (or root) of all objects in your webpage.

document.body.innerHTML = "Some text";

document.getElementById(id)

document.getElementsByClassName(name)

returns as array

document.getElementsByTagName(name)

returns as array

returns an array of an element's child nodes

returns the first child node of an element

returns the last child node of an element

returns true if an element has any child nodes, otherwise false

returns the next node at the same tree level

returns the previous node at the same tree level

returns the parent node of an element

clones an element and returns the resulting node

creates a new element node

creates a new text node

adds a new child node to an element as the last child node

inserts node1 as a child before node2

var child = document.getElementById("p1"); child.parentNode.removeChild(child);

element.replaceChild(newNode, oldNode)

allows you to create an animation relative to a container

call the function in window.onload to make sure the HTML is loaded or JS may not execute

A closure is an inner function that has access to the outer (enclosing) function’s variables—scope chain.

You create a closure by adding a function inside another function.

creates a new function that, when called, has its this keyword set to the provided value

used to stop a setInterval timer

occurs when the user clicks on an element

occurs when an object has loaded

occurs when the pointer is moved onto an element, or onto one of its children

occurs when the content of a form element the selection, or the checked state have changed

attaches an event handler to an element without overwriting existing event handlers

innermost element's event is handled first and then the outer element's event is handled

outermost element's event is handled first and then the inner