1. (function(){
      return typeof arguments;
    })();

(a) “object” (b) “array” (c) “arguments” (d) “undefined”

The answer is (a). The arguments array is of type “object”. My first instinct was to think its an array, until I realized there was a typeof to be considered.

2. var f = function g(){ return 23; };
    typeof g();

This results in an error because the function g has been assigned to the var f. So the answer is (d)

3. (function(x){
      delete x;
      return x;
    })(1);
  

I made the mistake of assuming I could delete x, but apparently you cannot delete arguments inside a function. So the answer is 1 which is option (a).

4. var y = 1, x = y = typeof x;
    x;
  

The answer here is “number”, because after assigning a value of 1 to y, x is also assigned that value. Doing a typeof on 1 obviously yields “number”.

5. (function f(f){
      return typeof f();
    })(function(){ return 1; });
  

Notice that we pass a function which returns 1 to the function f, which inturn executes the passed function and evaluates the type of the returned value. So typeof 1 results in “number” which is option (a)

 6. var foo = {
      bar: function() { return this.baz; },
      baz: 1
    };
    (function(){
      return typeof arguments[0]();
    })(foo.bar);
 

This returns “undefined” because when the foo.bar function is executed, “this” refers to the window scope which ofcourse knows nothing about baz. How do you fix this?
Remember how to use JavaScript’s call() and apply()? If not, check here
In this case, we need to specify the “this” to be the object “foo”, like this:

 var foo = {     
      bar: function() { return this.baz; },
      baz: 1
    };
    (function(){
      return typeof arguments[0].call(foo);
    })(foo.bar);
    

7.  var foo = {
      bar: function(){ return this.baz; },
      baz: 1
    }
    typeof (f = foo.bar)();
  

The above returns “undefined” because assigning foo.bar to a global variable “f” means the value of “this” inside foo.bar is “window”, and again, since window would not have a baz property, the value is undefined.

 8. var f = (function f(){ return "1"; }, function g(){ return 2; })();
    typeof f;
  

This one tripped me up! The comma apparently executes the function on its right. “,” is a left-associative operator which returns the value on its right, which makes the above to be var f = 2. typeof 2 will return “number” which is option (b).

 9. var x = 1;
    if (function f(){}) {
      x += typeof f;
    }
    x;
  

This returns “1undefined” because x+ typeof f where “f” is undefined returns 1 + “undefined” = “1undefined”. Also note how if(function(){}) evaluated to true.

10.  var x = [typeof x, typeof y][1];
    typeof typeof x;
  

typeof “y” which is undefined returns “undefined”, typeof “undefined” is “string”, and another typeof on it still returns “string”.

11. (function(foo){
      return typeof foo.bar;
    })({ foo: { bar: 1 } });
  

This one is simple, typeof foo.bar is a trick question because the argument foo is just an object, so to really get the “bar” value, it has to be typeof foo.foo.bar in this case. Either way, the answer is “undefined”.

12. (function f(){
      function f(){ return 1; }
      return f();
      function f(){ return 2; }
    })();
  

I made the mistake of thinking the value is 1, but if you pay careful attention, you’ll realize both functions are called f, which means when return f() executes, function returns value 2 because its been parsed second. So the answer is “2″.

13. function f(){ return f; }
    new f() instanceof f;
  

This evaluates to false because new f() returns a function which is not an instanceof the function f.

14. with (function(x, undefined){}) length;
  

This evaluates to 2, because the functions length is the number of expected arguments.

However, as awesome as this service is, understanding their documentation on this topic is a whole another matter. I found it almost impossible to decipher, as a lot of things were unclear or left unexplained. Look here: http://developers.facebook.com/docs/reference/api/realtime/

Luckily I found a blog post explaining how to do this, here it is.

I’ll run down the steps again below, as a few of the steps are now easier:

1. Get access token: https://developers.facebook.com/tools/access_token/ gives you access tokens to all your apps on facebook.

2. Check if access token works:

curl "https://graph.facebook.com/<appid>/subscriptions?access_token=<access token from  step (1)>"

Since you originally have no subscriptions, you get:

{“data”:[]} or some kind of error.

3. If you got empty JSON back in step 2, now you can subscribe to updates(here I want to subscribe to user checkins):

curl -F 'object=user' \
-F 'callback_url=<callback url you have to implement>' \
-F 'fields=checkins' \
-F 'verify_token=<secret token>' \
"https://graph.facebook.com/<your-app-id>/subscriptions?access_token=<access token from (1)"

The callback_url should be something along the lines of: https://github.com/facebook/php-sdk/blob/master/examples/example.php

This call should return “null” if successful. Once you have subscribed to updates, Facebook starts posting activities of all your application users to the callback_url above.

4. To verify step 3 was successful, run step 2 again, and this time, it should return something like this:

{"data":[{"object":"user","callback_url":"http:\/\/yourdomain.com\/callback.php","fields":["checkins"],"active":true}]}

The above response means the subscription to updates about user checkins are now active. Hopefully this helps people who are confused about how to get real time updates working.

First of all, you need to have the permissions to access a user’s checkin data. Look at http://developers.facebook.com/tools/explorer for information on this.

Once you have the required permissions and the user is logged in via Facebook connect:

//dojo.hitch to make the object scope available
FB.api("/me/checkins", dojo.hitch(this, function(response){
	if(response.data && response.data.length > 0) {
		dojo.forEach(response.data, function(item) {
            var locationId = item.id; 
            var locationName = item.place.name; //name of the place
            // To get a Facebook link to the location
            var locationLink = this.getLocationLink(locationName, locationId);
            console.log(locationLink); //print location link
        });
	}
}));

/**
* Output like this: http://www.facebook.com/pages/Espetus-Churrascaria-Brazilian-Steakhouse/166393336742282
*/
getLocationLink: function(locationName, locationId) {        
        var baseURL = 'http://wwww.facebook.com/pages/';
        var locationNameArr = locationName.split(' ');
        var locationLink = '';
        for(var i = 0; i < locationNameArr.length; i++) {
            locationLink += locationNameArr[i];
            if(i != locationNameArr.length-1) locationLink += "-";
        }        
        return baseURL + locationLink + '/' + locationId;
    },
    

More information on whats available with the Checkin object is outlined here: http://developers.facebook.com/docs/reference/api/checkin/

The /me/checkins request usually returns the most recent 25 checkins, with a hook to access more of the checkin information if required.

Basics on how to set up and register a facebook app have been covered elsewhere, over here I’m going to focus on the code which makes this happen.

To get started, make sure you import the Facebook JavaScript file. You also need to add a div whose id is fb-root, and you also specify your application credentials. For example:

<div id="fb-root"></div>
<script src="http://connect.facebook.net/en_US/all.js"></script>
<script>
  FB.init({
    appId  : 'YOUR APP ID',
    status : true, // check login status
    cookie : true, // enable cookies to allow the server to access the session
    xfbml  : true  // parse XFBML
  });
</script>

Once you do this, the FB object becomes available for use in your application. The best way to invite the user to login and/or provide permissions to your application is to use the FB.getLoginStatus() method:

FB.getLoginStatus(function(response) {
	(response.session) ? showAccountInfo(): showLoginButton(); 
	FB.Event.subscribe('auth.statusChange', function() { // do something when auth status changes }); 
});

If the user is not logged in or has not provided the required permissions to your application, display the login button.

<img style="cursor: pointer;" 
onclick="FB.login( function(response) {yourObject.onStatus(response)},{ perms: 'email,publish_stream,offline_access,user_checkins,friends_birthday' })"
src="https://s-static.ak.fbcdn.net/rsrc.php/zB6N8/hash/4li2k73z.gif"/>

The image, when clicked, calls the onStatus() method. “yourObject” assumes you are writing Object oriented JavaScript and the object is available in the namespace.

The permissions requested above are: email,publish_stream,offline_access,user_checkins,friends_birthday. You may want less, more or just the default information facebook makes available about every user. More information on permissions is available here: https://developers.facebook.com/tools/explorer

Thats it! The steps to have a user login and provide the required permissions to your application using the Facebook Graph API using JavaScript.

In Dojo, attaching events to an element are done as below:

dojo.connect(dojo.byId('elementId'), 'onclick'/*or other events*/, scope/*context*/, function(event) {
   //do something when the event happens.
});

Eugene Lazutkin’s solution here on StackOverflow is perfect in my opinion. I’ve started using it in all the Dijit widgets I’ve been writing. I put this in the destroy() method of the widget.

dojo.forEach(handles, dojo.disconnect);

http://jsfiddle.net/thxzc/1/

4 main concepts to properly understand the box model:

1. Content: The actual content area with a width and height specified to it.
2. Padding: Clears space inside the rectangle created for the content rectangle above. This padding also assumes he background color of the content area.
3. Margin: Clears space OUTSIDE the rectangle created for the content rectangle above.
4. Border: The border wraps around the content area/rectangle + the padding. It may or may not have its own color.

The actual size of the node includes the padding and the border. So if the width of a node is 200px, and it has a 10px padding and 1px border around it. Its real width is 222px(width + paddingLeft + paddingRight + borderLeft + borderRight).

Execute the example again and you will see how the height and width of the content area are computed: http://jsfiddle.net/thxzc/1/

Dont like my method to filter duplicates in an array using JavaScript. Anyone have a better approach? http://bit.ly/mt1H7f #javascript #dojo—
  (@vikasrao) June 04, 2011

My friend pointed out that I can use a map. Since a JavaScript object is essentially a map. I came up with:

var arr = [
    { name: "a", age: 24},
    { name: "b", age: 25},
    { name: "a", age: 24},
    { name: "b", age: 25}
];

var newarr = [];
var unique = {};

dojo.forEach(arr, function(item) {
    if (!unique[item.age]) {
        newarr.push(item);
        unique[item.age] = item;
    }
});

console.log(dojo.toJson(newarr)); //prints [{"name":"a","age":24},{"name":"b","age":25}]

Here’s a JsFiddle link for the above code: http://jsfiddle.net/k6v3R/1/

I’m sure there are better solutions out there, but the complexity for the above code is O(n) although I’m thinking I don’t need to use both an object and an array to filter unique items.

Call and Apply are JavaScript methods used to pass the required object scope for a function to execute as expected.

The syntax for the JavaScript call method:

fun.call(object, arg1, arg2, ...)

The syntax for the JavaScript apply method:

fun.apply(object, [argsArray])

The main difference is that call() accepts an argument list, while apply() accepts a single array of arguments.

So if you want to call a function which prints something and pass an object scope for it to execute in, you can do:

function printSomething() {
    console.log(this);
}
printSomething.apply(new SomeObject(),[]); // empty arguments array
// OR
printSomething.call(new SomeObject()); // no arguments

Here’s a JsFiddle example below which explains how scope can be passed as required: http://jsfiddle.net/8uRXe/8/

The first alert window uses the scope of the dojo widget, while the second call without any scope passed to it uses the default window scope for the “this” object printed from the printSomething() method.

Dojo provides a hitch method which allows the programmer to pass around scope. This hitch method along with dojo.connect is probably what I love most about Dojo.

  var myObj = {
        foo: "bar"
    };
    var func = dojo.hitch(myObj, function() {
        console.log(this.foo);
    });
    func();

Here’s a small example continuing the earlier examples: http://jsfiddle.net/8uRXe/9/

Hopefully this sheds some light on these 2 powerful JavaScript methods.

//where emailString is the string under consideration
if(/^[a-zA-Z0-9._-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{3}$/.test(emailString)) {
 console.log("valid email address");
}

Breakdown of : /^[a-zA-Z0-9._-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{3}$

• First part checks for alpha numberic characters, period, underscore and – are allowed.
• Needs to have an @ sign
• Last part can only contain 3 characters (a-z or A-Z) alphabets only, if you want anywhere between 2-4 characters, you can use {2,4} instead of {3} like I have.

UPDATE:
This below should work just as well as the above regex. For more useful info, check this out.

(/^[/\w/._-]+@[/\w/.-]+\.[a-zA-Z]{3}$/.test("vikas123@gmail.com"))

The above code in action here

FB.api("/me/friends?fields=id,name,birthday,picture, link", dojo.hitch(this, function(response) {
    var birthdays = response.data; //list of friend objects from facebook
    var currentMonth = new Date().getMonth() + 1;
    var upcoming = [];
    dojo.forEach(birthdays, function(item) {
        if (item.birthday) {
            var bday = item.birthday;
            //if the birthday is after today
            if (currentMonth <= bday.substr(0, 2) * 1 && new Date().getDate() <= new Date(bday).getDate()) {
                upcoming.push(item);
            }
        }
    });

    //set the year to current year because of birth years being different.
    var year = new Date().getFullYear();
    upcoming = upcoming.sort(function(a, b) {
        return new Date(a.birthday).setYear(year) - new Date(b.birthday).setYear(year);
    });

    console.log(upcoming);//console log here, but do whatever you want with the sorted friends
}));