JavaScript questions

Basic questions:

  1. Difference between Javascript and Jquery
  2. Var c = 2; ?
  3. C= 3; // do you need to declare a variable before usage in javascript?
  4. Scopes in javascript?how is it defined in javascript
  5. this keyword in javascript
  6. quirks mode in javascript
    http://www.quirksmode.org/js/this.html
  7. DOM objects
  8. is javascript Object oriented ?
  9. when is DOM created? When is DOM called? When are HTML elements created?
  10. who calls the document.ready() function? Is it a callback function
    How jquery auto detect that the DOM has been loaded
  11. How is the jquery data connection works?
  12. what is jquery success and failure? Are they function names in the jquery api?
  13. what is a callback function? How is it different from normal function call of
    function3(){

Function1()
Function2()

}

Advanced Javascript Questions

  1. What is the difference between == and ===? Which one would you use?

[me: equal meaning, value equal]

The equality (==) operator will compare for equality after doing necessary type casting, the identity operator (===) doesn’t do any conversions. A good practice suggested by Douglas Crockford is to always use strict equality

===, or ‘strict comparison’ means is the same type and equal

== simply means equal

“1″ == 1 // true”1″ === 1 // false

An example of type coercion at work. Basically anytime your value is the “same” but the type isn’t then == works.

Please use === everywhere. There’s no need to use ==. checking for types is always better

” == ‘0’          // false0 == ”            // true0 == ‘0’           // true false == ‘false’   // falsefalse == ‘0’       // true false == undefined // falsefalse == null      // falsenull == undefined  // true

JavaScript has both strict and type-converting equality comparison. For strict equality the objects being compared must have the same type and:

  • Two strings are strictly equal when they have the same sequence of characters, same length, and same characters in corresponding positions.
  • Two numbers are strictly equal when they are numerically equal (have the same number value). NaN is not equal to anything, including NaN. Positive and negative zeros are equal to one another.
  • Two Boolean operands are strictly equal if both are true or both are false.
  • Two objects are strictly equal if they refer to the same Object.
  • Null and Undefined types are == (but not ===).
  1. How would you check if a variable is null/undefined?

//check if bar is null

bar === null

//check if bar is undefined

typeof bar === “undefined”

3.Safely turning a JSON string into an object

jQuery.parseJSON( jsonString ); // using jquery

JSON.parse(jsonString); // without jquery

4) What is the difference between jquery.parsejson and json.parse?

jQuery will use the native JSON.parse method if it is available, and otherwise it will try to evaluate the data with a new Function, which is kind of like eval.

So yes, you should definitely use jQuery.parseJSON.

5) event.preventDefault() vs. return false   [Add more points if answered correctly]

http://stackoverflow.com/questions/1357118/event-preventdefault-vs-return-false?rq=1

#1 event.preventDefault()
  • $(‘a’).click(function (e) {    // custom handling here    e.preventDefault();});
#2 return false
  • $(‘a’).click(function () {    // custom handling here    return false;});

6) Is there any significant difference between those two methods of stopping event propagation?

Answer1:

return false from within a jQuery event handler is effectively the same as calling both e.preventDefault and e.stopPropagation on the passed jQuery.Event object.

e.preventDefault() will prevent the default event from occuring, e.stopPropagation() will prevent the event from bubbling up and return false will do both. Note that this behaviour differs from normal (non-jQuery) event handlers, in which, notably, return false does not stop the event from bubbling up.

7)  Explain event bubbling example in this scenario?
Answer:

– Outer Div

Google

document.getElementById(‘inner’).addEventListener(‘click’, function(e){

alert(e.type);

return false // DOES NOT STOP EVENT BUBBLING

}, false)

  • Here, when you click on Google link, you get two alerts ‘click’ and ‘Outer clicked’
– Answer 2:

There is at least one clear advantage when using event.preventDefault() over using return false. Suppose you are capturing the click event on an anchor tag, otherwise which it would be a big problem if the user were to be navigated away from the current page. If your click handler uses return false to prevent browser navigation, it opens the possibility that the interpreter will not reach the return statement and the browser will proceed to execute the anchor tag’s default behavior.

$(‘a’).click(function (e) {  // custom handling here   // oops…runtime error…where oh where will the href take me?   return false;});

The benefit to using event.preventDefault() is that you can add this as the first line in the handler, thereby guaranteeing that the anchor’s default behavior will not fire, regardless if the last line of the function is not reached (eg. runtime error).

$(‘a’).click(function (e) {  e.preventDefault();   // custom handling here   // oops…runtime error, but at least the user isn’t navigated away.});