Category Archives: JavaScript

Synchronous and Asynchronous

JavaScript itself is synchronous and single-threaded language. but you can write code in such a manner that function execution take a long time and can be interleaved with other operations.

First, let us use an analogy to understand Synchronous and Asynchronous.

Synchronous – You are in a Bus stop. When bus arrived, people will enter in a bus one by one. You cannot get into the bus until everybody in front of you gets in. and the same concept applies to the people standing behind you. This is Synchronous.

Executing something synchronously means, you wait for the task to finish before moving on to another task. Or we can say, two synchronous threads must be aware of one another, and one must execute in some way that is dependent on the other.

Asynchronous – Take household chores as an example. You put clothes to get washed and dry in a washer and dryer. Then you bake pizza in a oven. Meanwhile you are cutting veggies for salad. In this situation, couple of tasks are getting done at the same time. When the task is done. It will simply report back. This is asynchronous.

Executing something asynchronously means, you can move on to another task without waiting for the first task to get finished. The result of each task will be handled once the result is available. Or in other words, Asynchronous means two threads are totally independent, run parallely and neither one comes in each other way at the time of execution.

Try this code

Output will be :-

The output will be First Task, Second Task, Third Task. As javascript execute one function at a time and will wait for the function to be done before moving to the “Second Task”

Now try this code. I am using setTimeOut method here. The function will be processed in the background, while your program is doing other things.

Output will be :-

The setTimeout() method calls a function or evaluates an expression after a specified number of milliseconds. The setTimeout() method is asynchronous as it breaks the synchronous flow. This trick is used to execute the code after stacked events and fix timing-related problems.

AJAX (Asynchronous JavaScript and XML) requests are by default asynchronous, The XMLHttpRequest object is used to exchange data with a server behind the scenes. When the browser makes server requests. The response could take a little time. So you set up a function that will wait for the response to be sent back by the server, and react to it once the response is available. This whole process does not comes in the way of other functions.

Share

Understanding Javascript Closure

Closure is a nested function that has access to the variables in the outer (enclosing) function’s scope chain. It has access to variables in three scopes:

  • Variable in its own scope.
  • Variables in the enclosing (outer) function’s scope.
  • Global variables.

Best part of closure is that the nested (inner) function can access the variables from the outer scope even after the outer function has returned.

Share

Understanding delete operator in Javascript

Delete operator is used to delete the property of an object. It completely remove the property and keep the rest of the object intact.

  • The delete operator will not delete ordinary variables.
  • It cannot delete properties of the global object, which were declared with the var keyword.
  • However, it will delete “global variables,” which were not declared with var keyword. since they are actually properties of the global object ( window in the browser).
  • The delete operator doesn’t delete prototype property.

For examples:

The result would be undefined. In the above code, we have an object named as “person” which has the property “rank”, and as it is a self-invoking function, we will delete the “rank” property from object “person”. When we console.log the reference of the property the result will be undefined.

Let us go through some examples where delete operator doesn’t work:

The result would be 5. Delete operators don’t affect local variables. Here, “number” is not an object but a local variable. The delete operator will not delete ordinary variables.

The result would be 5. Delete operators don’t affect global variables declared with var keyword. Here, “number” is not an object but a global variable of type number.

The result would be “number is not defined”. Here, the global variable “number” is not defined with var keyword. hence, the delete operator will delete “number” since they are actually properties of the global object (window in the browser).

The result would be “Jane”. Delete operator will not affect prototype property. Here, “name” is a prototype property of team2.

Share

Cesium – How to show pyramid with polygon base in CZML ?

Share

Cesium – How to show multiple polylines using czml ?

By : https://github.com/AnalyticalGraphicsInc/cesium/issues/3598

Share

How to rotate flight marker towards arrival airport in leaflet ?

 

flight_market_heading

First it is important to know how it works –

    1. Check out Leaflet Rotated Marker  plugin https://github.com/bbecquet/Leaflet.RotatedMarker

rotationAngle property need a value and this is key. You will have to generate that dynamically based on aircraft position and destination airport.  Function below does the same calculate  and give rotationAngle.

Function in Python

Keep in mind that lat1 and long1 are the aircraft’s position. And lat2, long2 are airport destination where aircraft is heading.

 

Function in PHP

Function in JavaScript

Share

How to display two table columns per row using javascript ?

Share

How to Detecting Ad Blockers on Your Website using JavaScript ?

ad_blocker_phpmind
This code snippet will display a short message to the user on every page load if ad blockers in place.

It encourages readers to disable ad blocking from your site, which is as easy for them as a couple of clicks.

Share

Cesiumjs – Draw line around the globe ?

Draw-line-around-the-globe

Share

Cesium – How to changes the polygon positions on left click ?

changes-the-polygon-positions-on-left-click

Share