Friday, February 17, 2012

Deadly Flex interview Questions

This post is about the tough interview questions in Flex. There will always be some questions not answered by us. I have collected some of the tough interview questions and will update them periodically.

Question: If I have two functions with name function1 and function2 how can I call them at runtime using their name only, somewhat similar to reflection in Java. 
OR
How can I access a variable using its name as String parameter at run time in AS?
Answer: For accessing any function/property using its string name at run time we need to use this as shown below:




private function function1():void{

  Alert.show("One");

}

           

private function function2():void{

  Alert.show("Two");

}



protected function button1_clickHandler(event:MouseEvent):*

{

    for(var i:int = 1; i<=2; i++)

    {

        if(this["function" + i] is Function){

            this["function"+ i]();                       

            }

    }

}


And then we can call is using a simple click handler like:

<s:Button label="demo" click="button1_clickHandler(event)"/>

Question: I am using a ViewStack (or Accordion or any other navigator) and I have multiple VBox /NavigatorContent (etc.). When I move to other child of viestack I observed the scrollbars and I found it sets its content area size based on the first child. What can I do to fix this problem?
Answer: Set resizeToContent property to true. After that the content area will be re-sized automatically whenever we switch among children.

Question: I am having a scenario where I want user information to be available across the application. Shall I use FlexGlobals.topLevelApplication or static variables? Which one would be better?
Answer:  If we use FlexGlobals.topLevelApplication then our code gets bound to almost 90% of Flex classes and it becomes highly coupled, which is not good. The better way is to use static variable to convey that information. But the best way would be to inject value in our client instance using delegation or dependency injection library/framework e.g. Parsley.
You can find the interview questions about parsley here.

Question: What is a dynamic class? How is it different from Sealed class?
Answer:dynamic class defines an object that can be altered at run time by adding or changing properties and methods. A class that is not dynamic, such as the String class, is a sealed class. You cannot add properties or methods to a sealed class at run time. We create a dynamic class by using the dynamic attribute when you declare a class.
dynamic class Protean

{
    private var privateGreeting:String = "hi";
    public var publicGreeting:String = "hello";
    function Protean()
    {
        trace("Protean instance created");
    }
}


We can instantiate it and then can add properties or methods to it outside of class declarations.
var myProtean:Protean = new Protean();

myProtean.aString = "testing";
myProtean.aNumber = 3;
trace(myProtean.aString, myProtean.aNumber); // testing 3
myProtean.traceProtean = function ()
{
    trace(this.aString, this.aNumber);
};
myProtean.traceProtean(); // testing 3
more can be read here.



Question: What are the restrictions with a dynamic class? 
Answer: We can dynamically add only public properties and methods. Sealed classes are more efficient as they do not need to create a hash table to store the properties and methods that are unknown during compilation. 

Another obvious restriction is that dynamically added functions can’t access private members of the dynamic class. So if we don't need to add any new property/method later, it is best to use sealed classes.

Question: How can we instantiate a class at run-time in action-script?
Answer:In Java, we can do this using:

String className = "com.mittal.Navigator";
Class clazz = Class.forName(className);


If we want the same thing in Action Script we can use getDefinitionByName() method:

var testNav:AClass;
var clazz:Class = Class(getDefinitionByName("
com.mittal.Navigator"));
testNav = new clazz();

More can be read here.

Question: Is Object class dynamic?  OR
How are we able to add properties to a object at runtime? 
Answer:Objects can be created dynamically as:
var p = {} or
var p = new Object()
var dyna:Object = { firstName: "John", lastName: "Smith" };

As Object is a dynamic class, we can add new properties at runtime. If we need 100 objects then we can create an empty array and then keep on adding them.
var myArray:Array = [];
var object1:Object = {};
var object2:Object = {};

Question: I am having a formula and i want that to be executed. But I observed that there is no eval() in AS3, what can we do?
Answer: The better way is to use ExternalInterface API and execute the formula in java-script, otherwise the UI will be sluggish if it take a lot of time to execute. If we still want to find a work-around for eval we can check here.

Question: How can we clone (duplicate) an object in ActionScript 3?
Answer: Please check this post:

Question: When I run the following code I get error. How can we fix it?


interface If { ... }

class Impl implements If { ... }



function test(type:Class, obj) {

  return obj instanceof type;

}



test(If, new Impl());

The call to test on the last line returns false, but it should be true. How can I do this check right, with the requirement that it must be inside the function?
[Adapted from http://stackoverflow.com/questions/2401345/actionscript-instanceof-for-dynamic-interface]
Answer:First of all avoid using instanceof operator. And if we still want to use we should replace the test with:
if(Object is IInterface) 


Question: Can we define a constructor for an MXML component?
Answer: No we cannot define constructor for an MXML component but we can write event listener for preinitializeinitialize, or creationComplete event to replace the constructor.These events are all defined by the UIComponent class, and inherited by all of its subclasses. If we create an MXML component that is not a subclass of UIComponent, we cannot take advantage of these events. We can instead implement the IMXMLObject interface in ourMXML component, and then implement the IMXMLObject.initialized() method


Question: What is Shared Object? How is it different from Cookie?
Answer: Shared Objects are like browser Cookies. They are used to store data on hard disk of
user and call that data during the same session or in a later session.
1. Shared Objects don’t expire by default.Cookie can expire and they generally do at end of session.
2. Shared Objects mostly  have size of 100KB each.Cookies can be disabled by the user and generally size of a cookie is 4KB. Also there is a limit of 300 cookies total and 20 cookies at maximum per site.
3. SOs are no security threat. Applications can access only their own shared objects.Cookies are sometimes considered security threat.
4. SOs are stored in a location specified by application and they are not transmitted to server. They are store in a location specified by the browser and transmitted to server thorough http.
5. SOs can store simple data types (String, Array and Date).

Question: What are the various functions in class SharedObject?
Answer: They can be created and deleted using some standard functions:
clear()- Purges all of the data from the SharedObject object, and deletes the SharedObject file from the disk.
flush()- Immediately writes the SharedObject file to a file on the client.
getLocal()- Returns a reference to the client's domain-specific, local SharedObject object. If none exists, this method creates a new shared object on the client.
getSize()- Gets the size of the SharedObject file, in bytes. The default size limit is 100 KB, although it can be larger if the client allows it.
Along with them, the class SharedObject also have following properties –
data Read-only property that represents the collection of attributes the shared object stores.
onStatus The shared object's event handler that is invoked for every warning, error, or informational note.

Question: An example of using Shared Object?
Answer: The following example shows how to create one.
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"

initialize="initApp()">

<mx:Script><![CDATA[

public var mySO:SharedObject;

[Bindable]

public var welcomeMessage:String;

public function initApp():void {

mySO = SharedObject.getLocal("mydata");

if (mySO.data.visitDate==null) {

welcomeMessage = "Hello first-timer!"

} else {

welcomeMessage = "Welcome back. You last visited on " +

getVisitDate();

}

}

private function getVisitDate():Date {

return mySO.data.visitDate;

}

private function storeDate():void {

mySO.data.visitDate = new Date();

mySO.flush();

}

private function deleteLSO():void {

// Deletes the SharedObject from the client machine.

// Next time they log in, they will be a 'first-timer'.

mySO.clear(); //Destroy the shared object

}

]]></mx:Script>

<mx:Label id="label1" text="{welcomeMessage}"/>

<mx:Button label="Log Out" click="storeDate()"/>

<mx:Button label="Delete LSO" click="deleteLSO()"/>

</mx:Application>


Question: What is local connection? How is this different from shared objects?
Answer: We can use LocalConnection to develop SWFs which can communicate to each other. LocalConnection object is used to call a method in another LocalConnection Object.The communication can be – within a single SWF file, between multiple SWF files, between content (SWF-based or HTML-based) in AIR applications, between content (SWF-based or HTML-based) in an AIR application and SWF content running in a browser. Unlike shared objects, they provide real-time exchange. We can use LocalConnection objects to communicate with in a single file, but that’s not a typical implementation. We can also use cross-scripting (it is when a SWF file communicates directly with another SWF file). This communication is done without use of fscommand() or JavaScript. These objects can communicate only among the files that are running on same client computer but they can be in different applications for example a file running in a browser and a SWF running in Adobe AIR. There will be two SFWs: one will be sending SWF and other will be receiving SWF. The sending side will have the method to be invoked, a LocalConnection object and a call to send() method The receiving side will also contain a LocalConnection object and a call to connect() method.This side will invoke the method from sending side. If we want two-way communication we need to use two connections. More.

Question: Can we exchange data between two local connections one in SWF running in our computer and other SWF accessed from some other computer on network? What are security restrictions while using local connection?
Answer: LocalConnection objects can communicate only among the files that are running on same client computer. We may call SWF from a network computer, but that will ultimately be running in our computer :)
The use of send() and connect() methods between the two sides for data exchange depend upon – files are in same domain, in different domains with predictable domain names, or in different domains with unpredictable or dynamic domain names. These are explained below.
Same Domain: The simplest one and permitted by default. Don’t need any security measure.

// receivingLC is in http://www.domain.com/receiving.swf

receivingLC.connect('myConnection');
// sendingLC is in http://www.domain.com/sending.swf
// myMethod() is defined in sending.swf
sendingLC.send('myConnection', 'myMethod');

Different domains with predictable domain names: When two SWF files from two different
domains communicate we need to allow communication between the two domains by calling the
allowDomain() method. We need to qualify the connection name in send() method with the
receiving side LocalConnection object’s domain’s name.


// receivingLC is in http://www.domain.com/receiving.swf

receivingLC.allowDomain('www.anotherdomain.com');

receivingLC.connect('myConnection');

// sendingLC is in http://www.anotherdomain.com/sending.swf

sendingLC.send('www.domain.com:myConnection', 'myMethod');

Different domains with unpredictable domain names: We may want receiving side more
portable between domains. So to avoid specifying the domain name in send() method, but to
show that both the sides are in different domain, we need to precede the connection name
with underscore (_) character in both send() and connect() calls. To allow communication
between two domains, we need to call allowDomain() and pass the allowed domain names to
allow calls. Alternatively, we can use wildcard (*) to allow all domains.


// receivingLC is in http://www.domain.com/receiving.swf

receivingLC.allowDomain('*');

receivingLC.connect('_myConnection');

// sendingLC is in http://www.anotherdomain.com/sending.swf

sendingLC.send('_myConnection', 'myMethod');
You can check more about this here.


Question: Differentiate allowDomain() and allowInsecureDomain() methods?
Answer: By default, a LocalConnection object is associated with the sandbox of the file that created it, and cross-domain calls to LocalConnection objects are not allowed unless you call the LocalConnection.allowDomain() method in the receiving file (the one which will receive the request from sender).
Both the methods are used for almost same purpose but the difference is -
allowInsecureDomain() method additionally permits SWF files from non-HTTPS origins to send LocalConnection calls to files from HTTPS origins. Consider a file X which is hosted using a secure protocol (https) and there is a file Y hosted on non-secure protocol. Then if Y wants to access method on X, X need to allow using allowInsecureDomain() method. We must call the allowInsecureDomain() method even if we are crossing a non-HTTPS/HTTPS boundary within the same domain; by default, LocalConnection calls are never permitted from non-HTTPS files to HTTPS files, even within the same domain.
When we load a file over HTTPS, we can be reasonably sure that the file will not be tampered with during delivery over the network. But if we permit a non-HTTPS file to make calls to the HTTPS file, we cannot trust the authenticity of LocalConnection calls arriving at our HTTPS file. That’s why using allowInsecureDomain () is not recommended.

Question: What is deep linking?
Answer: In a Flex application, we can smoothly move from one state to other, without fetching a
new page from server or refreshing the browser. But in page-oriented model of browser, every
state is coupled to URL and thus can be used to bookmark the URL, email to URL and to use
back-forward buttons. To add such URL-mapping to Flex application we use deep linking. This
works with certain browsers and also need scripting in browser to be enabled. This doesn’t work
with standalone Flash Player or AIR. When using this HistoryManager doesn’t work as it sets
the property historyManagementEnabled to false.

Question: What are the different ways of exchanging data with flex applications?
Answer: Flex applications generally lie in larger web applications that control security to state management. A flex application is generally loaded in a browser with in html wrapper which can also include JavaScript or other client side logic. There are many ways to interact – any combination of flashVars properties, query string parameters, the navigateToURL() method and ExternalInterface API.
To pass data to flex application, we can set flash variables in wrapper and then access them in
flex application using Application.application.parameters or
LoaderConfig.parameters objects.
We can use method of ExternalInterface API to call methods of Flex applications and vice
versa. We use addCallBack() method to expose methods of flex application to wrapper, and
use call() method to call methods in flex from wrapper. If wrapper is html we use them to
exchange data in JavaScript and Flex.
Flex -> Wrapper = call()
Wrapper -> Flex = addCallBack()
In some situations we want to open new window or navigate to a new location, then we use
navigateToURL() method. Although this is not part of ExternalInterface API, but this method let us
write JavaScript inside it, and invoke those functions inside resulting HTML page.

Question: What are the performance implications if we use ItemRenderer Function?
Answer: If we define an itemRendererFunction to determine the item renderer for each data item, Flex will not reuse item renderers. The itemRendererFunction must examine each data item and create the item renderers as necessary for the specific data item type. While Flex does not reuse item renderers, it only creates enough item renderers for the currently visible data items. For more information
http://help.adobe.com/en_US/flex/using/WS64909091-7042-4fb8-A243-8FD4E2990264.html

Question: What are the various ways to optimize item renderers?
Answer: Check this post.


Question: How can we change the default browser (say to Chrome) in FB?
Answer: We need to know the installation directory for chrome first. It is 
C:Documents and SettingsUserNameLocal SettingsApplication DataGoogleChrome
for windows XP and differs for different OS.

Then in FB go to windows -> preferennces -> General -> Web Browser and click on "Use extenral web browser" and click New. Then give the details of browser name and location of Chrome.exe file. And then select it and its all done!!


Updated on 27th Feb 2013

Question: What is the difference between deep copy and shallow copy?
Question: How can we use copy() method in ObjectUtil for deep copy? 
Question: Wen we use this method the type of the value object is lost if the value object does not have remote tag. How can we retain the type in such scenario?
Check the following link for all the answers:

10 comments:

FlexProg said...

Very nice Collection...very useful.

Unknown said...

Thanks Buddy :) Please let me know what can be improved?

Anonymous said...

Good post!!

Anonymous said...

Good one!!

Unknown said...

More ActionScript questions have been added here:
http://flex4java.blogspot.com/2012/02/good-flex-interview-questions-flex_20.html

Anonymous said...

All questions are really different and really tough to answer. Thanks Akhil!

Sonia said...

Awesome stuff!!

Ankur said...

i must say, nice collection buddy:), would love to see more stuff from you, thanx man

Shahid Noor said...

Very very nice collection.... These are really good questions. I was searching for it from long time.

Ramana said...

very good collection buddy............