Microsoft 70-480 Certification Javascript Notes

   I have been studying for the Microsoft's new exam, and since there is no study material is released from Microsoft yet, I would like to share with you some of my notes. 70-480 is about HTML 5 Javascript and CSS 3.
   I wrote about HTML 5 in past, if you are interested check out my older posts. To see where you are with this technology, you can try Smarterer. It's free, and they have all kind of tests you can take.

VALUE TYPES

 

    var a = typeof 1; // number

    var b = typeof 1.0; // number

    var c = typeof true; // boolean

    var d = typeof "hello"; // string

 

There are some special value types to know about. I am expecting some tricky questions about these.

    var x = null; // x is null
    var b = c; // b is undefined. "undefined" is a type

NUMBERS 

When it comes to the numbers, Javascript has a lot of options.     

    var a = Number.MIN_VALUE;
    var b = Number.MAX_VALUE;
    var c = Number.POSITIVE_INFINITY;
    var d = Number.NEGATIVE_INFINITY;
    var fail = 10/0;         // Infinity

          //NaN = Not A Number

    var test1 = NaN == NaN;  // false
    var test2 = isNaN(NaN);  // true
    var test3 = isNaN(fail); // true

As you can see, they can really get tricky!

BOOLEAN

What about the Boolean Types, I work with C# so it's pretty easy to figure out what is True or False

But Let's see how that works in JavaScript

    if ("hello") {
       //This is true
    }
    if (25) {
        // This is true
    }
    if (10/0) {
        //This is true
    }
    if (null) {
        //This is false
    }
    if (NaN) {
        //This is false
    }

    if (undefined) {
        //This is false
    }

 

OBJECTS     

var obj= {
        name: "Jim",
        "some value": 1,
        subData: {
            option: true,
            flavor: "Vanilla"
        }
    };

 Pay attention to "some value": 1  There is a space in this name, and to reach its value you need to use :  obj["some value"]

 

ARRAY

According to Microsoft's training video, they are saying we need pay attention to Array object and its methods.

 

var a = ["George", "Bob", "Thomas", "Tom", "Andy", "Kesha", "Mark", "Linda"];

a.sort();            // It sorts the array

a.reverse();

a.push({"Ted"});     // adds it to the end.

var obj = a.pop();   // removes from the end. obj will hold the removed value

array.shift();       //remove from beginning
array.unshift({});  // add to beginning

var where = array.indexOf(obj); // positional access

var myvar1 = a.join(); //myvar1 = George,Bob,Thomas,Tom,Andy,Kesha,Mark,Linda
  

var myvar2 = a.join("+"); //myvar2 = George+Bob+Thomas+Tom+Andy+Kesha+Mark+Linda

var isitexist = a.some(function(i) {
        return (i == "Bob");
    });  //Some works like Any() in Linq



var obj = a.every(function(i) {
            return (i.length> 3);

        }); //Every function tests if every item's length is larger than 3

var obj2 =  a.filter(function (i) {
            return (i.length> 4)
        }); //Filter function returns array of items which has a length of 4 or larger
 
var obj3 = a.map(function(i) {

            return i.length;
        }); // Map works like Select in Linq. 
 
 FUNCTIONS
I think Javascript functions are the most confusing part of this language.If you understand how functions
work in Javascript, you will understand the Javascript. I am sure you have heard it many times
that Functions are objects in Javascript. Here is a simple function.
  
 function Test() {

   return 90; 
 
    };

 
Very simple, we call the function and it returns 90.
Let's do this.
 
var myinteger = Test();
 
What do you think is the type of myinteger?
 
If you will write alert(typeof myinteger);

You will see that it is a function!
So what would happen if our function doesn't return anything.
If a function doesn't return any value, it will be undefined!
 
Also you can have a function in a function. Here is an example.
   
function add(x) {
        return function(y) {
            return x + y;
        };
    }
 
    var add5 = add(5);   // add5 is 5
    var no8 = add5(3);   
    alert(no8);  // no8 will be 8!
 
So what happened here?
When you called add(5), function returned a function! 
That made add5 a function which accepts a value(y)!
Also it still has the value of x in it!
We call the add5 function and pass another integer.
Then add5 function returned 8 (return x(5) + y(3)
This is called Closures
 
NAMESPACES
In Microsoft Training video, they talk about the NameSpaces. Everything is in the global namespace
in Javascript unless you are in a function.
Here is an example.
 
        if (true) {
            var x= 5;
        }
        var total x+5;
as you can see we define the x in if statement but we can still reach it out of block!
        function Test() {
            var x= 5;
        }
        var total x+5;

This code doesn't work, because we define the x in a function, and we can't use the x out of the function
By creating a function, we created a Scope. We can use the functions to create namespaces.
Because we can write functions in a function will make this look like a namespace.
Here is an example.
 
var myNameSpace = myNameSpace || { };

We are creating a function named myNameSpace here. 
All we are saying is Define myNameSpace function, if it exist it equals to itself, if not it's a new function!
 
To add functions to this namespace, we can 

      
(function(ns) {
        var currentDate = new Date();
    })(window.myNameSpace = window.myNameSpace || { });

 
Couple of things are happening here.
(function(ns) {
        var currentDate = new Date();
    })
This function is special, It will run only ONE time when browser reaches it. You CAN'T call it again after that!
By adding the namespace information at the end, we are attaching this function to the namespace!
 
JSON
 

Json is very useful in Javascript, and it is very simple serialize and deserialize an object.
WARNING : 
If object has function, You CAN'T SERIALIZE IT! It will THROW ERROR!


 
Here is a simple JSON array
var employees = [
        { "firstName": "John", "lastName": "Doe" },
        { "firstName": "Anna", "lastName": "Smith" },
        { "firstName": "Peter", "lastName": "Jones" }
    ];

 
We can reach to the objects and change their values very easy. 
    var lname = employees[0].lastName;
    employees[0].lastName = "Savran";
 
Let's create an object to serialize/deserialize it.
var employee = { };
    employee.FirstName = "Hasan";
    employee.Age = 32;

To Serialize it :   var JsonEmp = JSON.stringify(employee);    
JsonEmp = {"FirstName":"Hasan","Age":32}
 
To Deserialize it : var backToJs = JSON.parse(JsonEmp); 
 
 Error Handling
try {
   // line of code
}
catch(err) {
   // error occured, handle it here
   // Error object has the followings
   // .description
   // .message
   // .number
   // .stack  
}
finally{
   // These statements execute regardless of whether or not an exception was thrown or caught
}

 
 Removing Objects 

 You can use Delete to remove objects. Delete will return TRUE if operation is possible.
It return False if it's not. It will set the property or element to UNDEFINED
 
 
var x = { };
    delete x;
    var y = function() {
        myval2 : 54,
        obj56 : function() {
            myval = 34;
        }
    };
    delete y.obj56;
 
 INSTANCEOF OPERATOR

You can check the objects type with this operator. Here is an quick example.

 
var theDay = new Date(1995, 12, 17);
    if (theDay instanceof Date) {
        //It is TRUE
    }
 
IN OPERATOR
Here is useful operator to see if the index or function is exist in an object!
 
    var teas = new Array("Black", "Mint", "Sage", "Green", "Ginger");

    var a = 0 in teas; //return true; Index 0 is exist!
    a= 6 in teas; //return false; Index 6 is not exist!
    a = "Peach" in teas; // return FALSE! you must specify the index number not the value!
    a = "length" in teas; // return TRUE!! length is an Array property!
 
WITH STATEMENT
 
 document.write('Hi there, how are you?');
    document.write('Fine, thanks. And you?');
    document.write('Great!');
    // You can do the same thing like tHIS
    with (document) {
        write("Hi there, how are you?");
        write("Fine thanks, And you?");
        write("Great");
    }
 
THIS OBJECT
This object applies to the owner of the function!
 var f = function() {
        alert(this);
    };
    f();    //[Object Window] Window is the owner!
 
var obj = {
        name: "myObj",
        myFunc: function() {
            alert(this.name);
        }
    };
    obj.myFunc();   // "myobj" is the owner!
 
PROTOTYPE
I am not going to deep in this topic, I don't think they are going to ask any questions about this topic.
But just to be safe, I wanted to cover it.
Prototype represent the Object prototype object.
Here what Mozilla Developer Network says about this:
All objects in JavaScript are descended from Object Object; all objects inherit methods and properties from Object.prototype Object.prototype, although they may be overridden (except an Object with a null prototype, i.e. Object.create(null)). For example, other constructors' prototypes override the constructor property and provide their own toString methods. Changes to the Object prototype object are propagated to all objects unless the properties and methods subject to those changes are overridden further along the prototype chain.
 
We can use this to create new functions or copy functions from one object to the other one.
 function Customer(name, company) {
        this.name = name;
        this.company = company;
    }
 

Customer.prototype.send = function(email) {
//We created an email function in Customer object!    };
 
    var cust = new Customer();
    cust.send('email@email.com');   
 
I hope this would help you with the exam. I may add some more information later about the exam.