Java Script - Module I

JavaScriptModule I

byMustafa Qamar-ud-Din

[email protected]

Agenda

Why JavaScript?

Data Types

Flow Control Structures

Functions

Nested Functions

Recursion

Closures Error Handling

Objects

Built-in Objects

User-defined Objects

Document Object Model

DOM Level 1

DOM Level 2

DOM Level 3 Interview Questions

Recommended Readings

What’s Next?

Hands On

Why JavaScript?

"JavaScript is the only language that I’m aware of that people feel they don’t need to learn before they start using it."

- Douglas Crockford

Why JavaScript?

Web Development Client-Side Server-Side

Mobile Applications Windows 8 Applications Chrome Extensions VR Games & Graphics Desktop Applications (Elektron)

IoT

Data Types

Statements Expressions Variables

Hoisting Constants

Immutable Identifiers Mutable Values

Operators Assignment Increment, Decrement & Comparison

Logical ?: typeof

Weakly Typed Type Coercion Dynamic Typing

Primitive Types Booleans Numbers Strings Null Undefined NaN Symbols (ES6)

Composite Types Array Object

Flow Control Structures

if if / else if / else if / else while do while for switch continue break

Functions (First-class_function)

Nested Functions Recursion Closures Self Invoking Functions

Nested Functions

Create a function sum that will work like that:sum(a)(b) = a+b.

Yes, the syntax is dual brackets. Funny, isn’t it? For instance:

sum(1)(2) = 3

Sum(5)(-1) = 4

Source: http://javascript.info/tutorial/closures

Nested Functions

Create a function sum that will work like that:sum(a)(b) = a+b and accepts any number of brackets.

For instance:

sum(1)(2) == 3

sum(5)(-1)(2) == 6

sum(6)(-1)(-2)(-3) == 0

Sum(0)(1)(2)(3)(4)(5) == 15

Source: http://javascript.info/tutorial/closures

Closures

Here is a function to create an army of shooters:

function makeArmy() {

var shooters = []

for(var i=0; i<10; i++) {

var shooter = function() { // a shooter is a function

alert(i) // which should alert it's number

}

shooters.push(shooter)

}

return shooters

}

var army = makeArmy()

var shooter = army[0] // first shooter

shooter() // alerts 10, should be 0

shooter = army[5] // 5th shooter

shooter() // alerts 10, should be 5

// all shooters alert same: 10 instead of 1,2,3...10.

Why all shooters alert the same? How to make each shooter output it’s number?

Source: http://javascript.info/tutorial/closures

Error Handling

try catch finally window.onerror

Objects

Built-in Objects User-defined Objects

Function JSON Associative Array

Pass by Value & Reference Prototype Chain

Built-in Objects

Number String

getIndexOf getLastIndexOf search

RegEx match exec test

Date getTime / setTime getHours / setHours getMinutes / setMinutes getSeconds / setSeconds

Math random round

Global Methods parseInt parseFloat isNan

Objects

Built-in Objects User-defined Objects

Function JSON Associative Array

Pass by Value & Reference Prototype Chain

Objects

Methods is hasOwnProperty isPrototypeOf toString toSource valueOf apply bind Call

Operators instanceof typeof