Some Javasript Tips

Posted: 1 October, 2008 in Technical

1. If element has some child-elements which have event-handler so that, in this case
if you run this command element.innerHTML += “<html element>any thing</html element>” –> It will remove every event-handlers of its child-elements.

2. When do you use: asynchronous or synchronous request
Normal, When we use Ajax.Request, so we will use asynchronous request, but some case we need using synchronous request:
ex: If we have the command lines as:

createFile(file){
Ajax.Request(for creating file data);
}

readFile(file){
Ajax.Request(for reading file data);
}

In this case, You need to using synchronous request for asserting that data is exists for the second request.

3. Key handler
– When using KeyMap component of Ext or (and key manager of other libraries). You note that They are only effect for textbox or textarea or document scope. When we use them for other elements, we must use them on document scope. –> It needs to check very careful.

4. Dom functions
+ Some DOM functions when we use them, It can make our system slow. We must try to not use some functions as: getElementsByClass, getElementsByName …
You can change by using getELementsBySelector, or childElements or descendants … for making searching area smaller.

+ Cross-browser problems
You note that, some time DOM function of Ext or prototype will be applied difference from each browser. It means that some time It can only return HTML elements, not Ext elements. In this case, you need re-create a Ext element for result.
Ex:
In IE, “event.target” has not Extended Prototype functions
If you want to use those functions you must change to “$(e.target)”

5. Upload file
When we want to upload a file with Iframe, You note that We don’t use XMLHttpRequest so, It this case we can not get response from server exactly. We can solve it by:
+ Try to using delay function with a time enough for client can receive response from server and after that we will get result from iframe. (not safe)
+ Try to using other request for validating or any thing (slow)
???

6. How to copy a object
As you see, in Javascript the object in operator will be reference. So some time, you want to copy to a new object and modify this object.
var One = new Person(‘one’);
var two = One; //Reference copy
var two = new Person(data of one); //copy

It means that you can make a new object by a instance of class of old object by data of old object.

7. Performance
Some time, a object is enable to be accessed too times for only purpose. In this case we need to cache that accessing step although source code can be longer.
Ex:
if (widget.getProperty().getChildPropertyValue(‘value’) != ‘CompositValidator’) {
Ext.MessageBox.alert(_(‘error’), _(‘It is not available for ‘)+_(widget.getProperty().getChildPropertyValue(‘value’)));
return;
}
It will be better if we change it to:
var name = widget.getProperty().getChildPropertyValue(‘value’);
if (name != ‘CompositValidator’) {
Ext.MessageBox.alert(_(‘error’), _(‘It is not available for ‘)+_(name));
return;
}

or

for (var i = 0; i < objectA.size(); i++) {
//any thing
}
It will be better if we change it to:
for (var i = 0, size = objectA.size(); i < size; i++) {
//any thing
}

Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s