Entries Tagged as 'Javascript'

Understanding event handler and parallel processing

Posted by Vikas on August 08, 2011
  0 comments

Hi,

These days I was trying to play with browser’s local database. I got very much interesting experience while assigning a value to variable.

I used the following code in JavaScript (Only works in Firefox)



var db;

var request = mozIndexedDB.open("MyTestDatabase");

request.onerror = function(event) {

  alert("Why didn't you allow my web app to use IndexedDB?!");

};

request.onsuccess = function(event) {

  db = request.result;

  //db = event.target.result; //also tried this

  console.log(db); //get the object

};



console.log(db); //get undefined

In browser’s console, I get two outputs. One is undefined and another is Database Object.
I was wondering why it happens.

Moreover, first is says undefined. Then second is object. If I add one more line next to all code

alert("Database is: " + db);

Then I get undefined, in result.

If I put alert() call in between then both results are same (database object).

After some time I realize that I was making an asynchronous call. Then I understood that onsuccess() was not just a handler or function but it is an “event handler” which will trigger when particular event occurs.

I should wait until this hander executed. Again as it is an asynchronous call, it will not notify us. We may need to use busy waiting function.

Thread that comes in mind! Lucky we have setInterval() function, to make some delay. Read more here.



var timer = setInterval(function() {

    if(!db) // Not ready yet.

        return;

    // We have a db so we can stop waiting

    clearInterval(timer);

    // and get on with our real work.

    start_main_application();

}, 100);



function start_main_application(){

    console.log(db);

    //do rest of the code.

}


 

But then again, I can call start_main_application() function from handler itself!!!! no need to use timer!!

I really need to think difference between Synchronous and asynchronous, sequential and parallel execution, starting multi-threads and joining them.

After all, my question is can we convert synchronous call to asynchronous?

Please feel free to comment…




Javascript and Numbers

Posted by Nirav Patel on May 20, 2011
  0 comments

Hello

Once I wonder that why the I got the 10 value in my javascript variable x in the following example.

var x = 1 + 011;

After, googling some times I got that it was a radix param issue [More].

While parsing into the number javascript assumes the following:

  • If the string begins with "0", the javascript consider the string as octal number and convert it to decimal number.
  • If the string begins with "0x", the javascript consider the string as hexadecimal number and convert it to decimal number.
  • If the string begins with any other value, it will consider as decimal number

 

So in above example 011 considered as an octal number and javascript converts it to decimal number 9 and then add 1 to 9 so I got the answer 10.




innerHTML vs appendChild

Posted by Vikas on November 11, 2010
  0 comments

 

Today I was testing my code, and I found interesting stuff on innerHTML and appendChild method.

I was trying to add new elements to the div.

First, I was creating element by calling DOM method (document.createElement()) and then I append it to my div by calling appendChild() method of the HTML div element.

 




Place Scripts at the Bottom of Your Page

Posted by Pradeep on August 27, 2010
  0 comments

Placing JavaScripts at the bottom of the page  is a  good way to makeother things of the page download faster.

Keep in mind — the most important goal is to make the page load as speedily as achievable for the user. As soon as load script statement is encountered the browser tries to download and becomes unresponsive until the whole file has been loaded. Therefore, the user will have to wait longer before noticing some development or rendering in the page.

If you have JavaScript (JS} files whose only intention is to add functionality for example, after a button is clicked — go ahead and place those files at the bottom, just before the closing body tag.

Superior way

<p>MyContent</p>  

<script type="text/javascript" src="js/genral.js"></script>  

<script type="text/javascript" src="js/event.js"></script>  

</body>  

</html>  

 




how to prevent your site from being framed

Posted by Nirav Patel on June 08, 2010
  0 comments

If you do not want that  someone links your web site within a frame, the following javascript code will enable you to prevent your web site from being framed.

Add the following code to your <body> tag:

<body onLoad="if (self != top) top.location = self.location">




jQuery code and syntax guidelines for improved code performance

Posted by Nirav Patel on May 28, 2010
  0 comments

If you want to publish your jQuery plugins following jQuery core code writing guidelines is a good idea. Here is the some of the guidelines.

  • Do NOT append an element to the DOM in your loop.
  • Don't use string concatenation, instead use array's join() method for a very long strings.
  • Don't use "string".match() for RegExp, instead use .test() or .exec()
  • Local variables are declared and initialized on one line just below the function declaration with no extra line:
  • All strings are in double quotes " ", not single quotes ' ':
  • The last but not least, variable naming uses camelCase.

See more details




Correct Method to check if a Javascript function is Exists or not

Posted by Nirav Patel on April 27, 2010
  0 comments

Hi everyone,

Sometime you might want to call a function in Javascript but check whether the function exists or not before calling it. You can test if a function exists in Javascript by simply testing for the name of it in an if() condition.

But Note that you can't test for the function name by itself.
This will work but if the function doesn't exist the Javascript will error out.

if(some_function_name)
		{}

The Correct method is Like this

 if(window.some_function_name)
		{} 
 

It's a method of the window object so you need to test for window.some_function_name like so, where some_function_name is the name of the function you wish to test for.