Javascipt Basics - Part 2

I did one blogpost couple of months back regarding Javascript Basics. This is continuation of that post.

A)EncodeUri and EncodeUriComponent -
These are builtin function which are used to encode the parameters.

EncodeUri(uri)-- will encode the part of the Url after the "http://somehostName/{This part will be encoded}

EncodeUrlComponent(url) -- it assumes that you will passing only the parameter that you want to encode. It will encode whatever you pass to the function.

For eg: if you pass

var url = 'http://yashwant.dns.mycompany.com/H ome';
alert(encodeURI(url));
Output:http://yashwant.dns.mycompany.com/H%20ome%3C/defau%20lt.aspx%3E

alert(encodeURIComponent(url));
Output:http%3A%2F%2Fyashwant.dns.mycompany.com%2FH%20ome%3C%2Fdefau%20lt.aspx%3E

B) Functions as Data
Javascripts treats functions as Data. So a function can be assigned to a varaible.
for eg:
var x = function()
{
alert('this is a function');
}
This notation is called as function literal notation

C) Anonymous Functions
Anonymous function are declared in place and dont have a name. Main use of Anonymous functions are it makes the code more elegant. They are used a lot as callback functions. As we know that Functions can be treated as data, so we can pass a function to another function as a parameter in javascript.
For eg:

var y = function (functionParameter)
{
alert('I am in functionA');
//CallBack the anonymous function that you passedin
functionParameter();
}
y(function() { alert('I am the callback function')});

D) Global Objects

When we declare a varaible using the object literal notation i.e

var Person = {
firstName: 'Yashwant',
middleName: 'Jaywant',
lastName: 'Patil',
print: function() //This is a method
{
alert(this.firstName + " " + this.middleName + " " + this.lastName);
}
}

Person property gets attached to the global javascript variable. In this case, since the code is running in a browser "person" property gets attached to the WINDOW object. So you can call the print method on the Person object like this

//Person Varaible gets attached as a property of the Global Object i.e Window object
window['Person'].print();

E)Configuration Objects
The rule I follow while writing javascript functions is :If there are more than 3 parameters that need to be passed to a javascript function, it is better to pass it as a JSON configuration object.

for eg:

//Cofiguration Objects...
var func = function Print(configurationObj)
{
for (var j in configurationObj)
{
alert(configurationObj[j]);
}
}
var obj = {"firstName":"Yashwant",
"middleName":"Jaywant",
"lastName": "Patil"
};
Print(obj);

It makes the code easire to read and understand.

Thanks,
Yash

Facade Pattern

Facade pattern is a very simple but useful pattern.When I think of Facade pattern.. what comes to my mind is composition.

Complex System ----> Sub System 1
----> Sub System 2
----> Sub System 3
----> Sub System 4


For an external system we can create a wrapper which hides all the subsystems and provides an unified interface. Internall this wrapper will dispatch the call to the correct subsystems.

For eg:
public Class ComplexSystem
{
private SubSystem _subSystem1;
private SubSystem _subSystem2;
private SubSystem _subSystem3;

public void SubSystem1Method1()
{
_subSystem.Method1();
}

public void SubSystem2Method1()
{
_subSystem2.Method1();
}
public void SubSystem3Method1()
{
_subSystem3.Method1();
}
public void SubSystem4Method1()
{
_subSystem4.Method1();
}
}

I hope this explanation helps. You can donwload a real world example here: http://dotnetdevblog.googlepages.com/FacadePatters.zip

Thanks,
Yash

Javascript Basics......

Its been long time since I wrote a post. Was busy with lot of things.
Lately I have been working a lot with Javascript. This is the first time I am using Javascript heavily in a project.

Today I want to demonstrate some of the basic javascript concept.
1)Static Methods
2)Public Methods/Variables
3)Private Methods/Varables


In this project.. I created a simple server control which renders a link. Href of this link is a javascript function.



Javascript method CreateArt(...) creats an instance of a Window Object.
var win = new Window();

Window object'ss prototype property has two methods
1)Initialize(..) -- Sets the local variable firstName,middleName,lastName
2)Display(..) -- Displays the names in a table which is attached to the body of the document.





Another way to set the prototype is to add each function individually.

adding public variable/function and a private variable/function to the Window Object.

Declaring a public method is done using the this keyword.

Private methods are declared using a private Variable and then adding a method to that variable. The advantage of this is we dont expose this method from the class.

Static Method can be easily declared by adding that method to the class. for eg:

If you want to download the source code please click here --> http://dotnetdevblog.googlepages.com/JavascriptBlogApp.zip

I started loving javascript as a language after working on this project. I used to think javascript was not for real programmer but now I believe it has lot of goodness in it.

Embrace It :)

Thanks,

Yash

Implementing Strategy Design Pattern...

Implementing the strategy pattern helps in decoupling the application.The main idea behind you can interchange the different implementation of your algorithm without breaking the code.

What I mean by that is .. I have an interface, IGetData which defines a single method which returns a Customer object.

public interface IGetData
{
Customer GetData();
}

This interface is implemented by two different classes...SqlDataSource which gets the customer object from the SqlServer Database, while XmlDataSource gets the Customer object from the XmlDatasource.
The data class encapsulates the interface[IGetData]... in the Constructor of the Data class. you can pass in different implementations of IGetData. i.e you can pass any class which implements the IGetData interface.
By doing this .. you can have some factory method which will return the appropriate class which implements the IGetData interface.

PS: Click on the image to enlarge.

You can decouple more by using either factory or abstract factory pattern.
SourceCode download ---> http://dotnetdevblog.googlepages.com/StrategyPattern.zip

Happy Programming!!!
Yash

Accessing Embedded Resources in an assembly....

Recently I was working on a project where..I had to embed some Config.Xml files in an assembly. That assembly was later on added to the main project.

Accessing the resource:

Step1: Add the resource and make the "BUILD Action" as embedded resource in Visual Studio.

PS: Click on the image, to View the Code..

Step2: Use Reflector to get the resource Name.

Step3: Load the assembly .. and use the method "GetManifestResouceStream" to access the resource..

Assembly assembly = Assembly.Load("MyLib");
Stream st = assembly.GetManifestResourceStream("MyLib.Config.Config.xml");

Its a nice way to access embedded resources from the build..

Happy Programming!!!

Yash

Hello... today I found an interesting class ...PostBackOption class from the
System.Web.UI namespace. PostBackOption's is interesting becuase it lets you create controls like

Different implementation of StateBag

I am going to show some different implementations of StateBag... many times while developing .Net Application, you need to pass some data from one function to another for eg:

A() -> B() --> C()
OR

you want to keep data in some collection and spit it out during page rendering.


Instead of moving the data domain data from function to function, it is a good idea to put the data in the Application Context or in the StateBag.


StateBag -- This is implentation is not a session implentation but its global becuase I am making the stateBag a static variable.



PS:Click on the image to enlarge

StateBag1 implementation:

StateBag1 is a good implementation which exposes a property which will return the StateBag.. The StateBag is stored in the HttpContext. HttpContext provides a items collection where you can dump all your StateBag.This implementation will only work in web centric senario as HttpContext is not available in non web centric application.

StateBag2 implementation:

This implementation is similar to StateBag1 but can be used in non web-centric as it uses the CallContext object if HttpContext is not available.

Creating your ApplicationContext:

This is bascially a wrapper class around the HttpContext. You can store this AppContext object in the CallContext, this way only one instance is created per thread.I like this implementation a lot.

You need to searlize this StateBag before the page renders as a hidden string. When postBack happens that time you need to desearlize the StateBag to get the parameters back.

If you want to download the SourceCode ---> http://DotNetDevBlog.googlepages.com/WebApplication1.Zip

I hope you like the implentations :)

Happy Coding!!
Yash

Adding Reflector as External Tool in Visual Studio

I spend most of my dev time in Visual Studio. I hate to go out of VS and open some other programs like fiddler or reflector. In Visual studio you can easily add the tools that you use a lot by adding these tools as external tools.


All you have to do is go to Tools->External Tools, configure your tool over there ... Heres a screen shot of to configure Reflector in Visual Studio..





Thats it.... next time you want to use the reflector... all you have to do is go to tools and select Reflector.

Thanks,
Yash