HTML Page Layout Basics

Manish Damle

 

Page Layouts are nothing but an arrangement of the various HTML components, elements in some containers. Every web page has containers; we call the body which is a standard HTML tag.

Read More
Topics: salesforce.com, How To, html, CSS, JavaScript

JavaScript: Understanding the unrevealed - Part I

Rajkumar Gaikwad
JavaScript is one of the most confusing/misunderstood programming language, but also it is one of the world’s most popular programming language.
Despite it's popularity, it is such a misunderstood programming language. What’s the secret behind this?
In this blog I am going to be listing the unrevealed parts of this language and I am sure it will help you to understand the language in a better way.

JavaScript has no block level scope

What do you mean by block level scope?

Block level scope means variable declared inside a block of code that is enclosed by curly {} braces and is only visible inside that block not the outside of that block.
If a variable is visible outside that block that means programing language doesn’t support block level scope.
JavaScript has only function level scope that means whenever a particular function gets called it creates the context execution and in that it creates scope chain and variable environment .
We will see what is context execution and the difference between scope level chains and variable environment and what would be the lifetime of a variable in my next post. For now just understand that it allocates new memory locations to all the variable declared in that function and variables are accessible in that function only, which are available in scope chain and variable environment .

                For example,

                 <script>    
                             var testVariable = 1;
        
                              if(true){
                                        var testVariable = 2;
                                        console.log (testVariable);  // logs 2 as output
                               }        
                              console.log (testVariable); // logs 2 as output
                 </script>

NOTE : in ECMAScript 6 we have let keyword which allows to declare variable which has block level scope.
 

It’s a Single threaded event based language

It's a very confusing part for most of us that JavaScript is a single threaded or multi-threaded language.

Single threaded - Only one thing at a time.
Multi-threaded - More than one thing at a time.

JavaScript is a single threaded event based language, so what does event based single threaded language mean?
Everything under the hood in JavaScript is a single threaded but there are some external dependencies which can block the single threaded execution,they are modelled as event. Whatever might block that single threaded execution is queued up for processing (i.e. put into the special queue called EVENT QUEUE).
 

Whenever execution stack is empty JavaScript engine looks into this queue and check is there any event in event queue if yes execute it as in FIFO order.
 
Let’s jump to the example,



 

Flow of execution

Global execution context created --> logs ‘ Hi welcome'  - -> now click on document event gets added into event queue --> waitfor3Secs function gets called --> new execution context created for function waitfor3Secs and added it in on top stack --> after 3 second it logs ‘ wait is finished.. ’ --> popped last execution context --> Logs ‘ Execution finished...!! ’ --> finished global execution context -->execution stack is empty --> will check event queue and process event based on FIFO order by pushing each event on top of the execution stack --> now event handler gets called --> new execution context created for event handler --> logs ‘ welcome ’.

It’s a Dynamic typed language 

What does static typed mean?

In other programming language like C, JAVA if we write a statement like
 
Integer numOfCount = ‘three’;
 
It gives the compile time exception, because compiler is expecting integer typed value in variable.
 
But in JavaScript it internally typecast the variable based on type of its value as:
            
            var numOfCount = ‘three’;
            console.log (typeof numOfCount) // it logs string

 

Coercion in JavaScript

As I said above that JavaScript automatically type cast variable based on its value, because of such coercion some times JavaScript language becoemes a nightmare for developers because it produces unexpected result which weren’t expected by developer.
               
Example:
                                If (1<2<3) {
                                                console.log (‘it’s working as expected’);
                                }
 
                                If (3>2>1) {
                                           console.log (‘working as expected’);
                                } else {
                                                console.log (‘this wasn’t expected’);
                                }          
 
 JavaScript is a truly object-oriented programming language and everything is an object in js.
 Here '<' is an overloaded operator.

In the exapmple execution starts from left to right and first it calls '<' function with 3 and 2 as a parameter.
                 
            function < (param1, parm2) {
                                //…….
             }
 
This function returns TRUE because 3>2.  and next time it pass TRUE<1;             
Because of dynamic nature of js language js engine convert TRUE to 1, so expression becomes 1>1 and it returns false and logs ‘this wasn’t expected’.

Basically all these are the omissions as a part of the language designer, but if we know all these ptifalls then it really save us lots of time in debugging and helps us to understand this language in a better way.
Read More
Topics: salesforce.com, Learning, How To, JavaScript