JavaScript Concepts

1. Case Sensitive

JavaScript is case sensitive. var numberAdd ; var numberadd; both are different variables.
HTML,unlike X HTML is not-case-sensitive.This means

2. Undefined ?

Variable declared without a value will have the value undefined.

var a=1

In this case the declared variable will have a value of undefined after the execution of the variable.

3. Scoping

Variable with global scoping: a variable and it's value is accessible and modifiable throughout your program.

var a=1;

//global scope
function one() {
 alert(a);
}

Variable with local scoping

var a = 1;

function two(a) {
  alert(a);
}

// local scope
function three() {
  var a = 3;
  alert(a);
}

4. this

In global execution context ''this" will refers to the global object.i.e is window object.but inside a function the value of this depends on how the function is called.

function fif()

{"use strict";console.log(this);}

 fif() //gives the window object in return

another way of this when a function is called as a method of an object.it's this is set to the object the method
is called on.in the fallowing example when o.f() is invoked 

var o = {
 prop: 37,
 f: function() {
 return this.prop;
 }
};
console.log(o.f()); // logs 37

when resolving a variable,JavaScript starts at the innermost scope and searches outwards.

5.Event System

the interactive webpage is dependent on the javascript event handling system.
Mouse event firing system 

• onmousedown/onmouseup/onmouseover/onmouseout/onmousemove - Mouse events
• onblur/onchange/onfocus/onselect/onsubmit/onreset/onkeydown/onkeypress/onkeyup -Input text filed events
• onclick/ondbclick - Click Events
• onload/onerror/onunload/onresize - page/window/browser load events

< input type="button" value="clickme" id="btn" >
< h1 onclick="this.innerHTML='Ooops!'">Click on this text!>/h1 >
< body onload="checkCookies()" >
< input type="text" id="fname" onchange="upperCase()" >

document.getElementById("btn").onclick =function()
{
 alert("btn is clicked")
}

Event Bubbling and Event Capturing

There are two ways of event propagation in the html dom, i.e. event bubbling and event capturing.event propagation is a way of defining the element order when an event occurs.if you have a "span"tag inside "div" tag , and user clicked on the "span" tag ,
so the most innermost element is capturing the event is called the event bubbling and then the event is propagated to outermost elements.
In capturing the event is first captured by the outer most element and propagated to the inner most element.