Tag Archives: javascript

Computer Algorithms: Bubble Sort

algorithms, , , , , , , , , , , , , , , , ,

Overview

It’s weird that bubble sort is the most famous sorting algorithm in practice since it is one of the worst approaches for data sorting. Why is bubble sort so famous? Perhaps because of its exotic name or because it is so easy to implement. First let’s take a look on its nature.

Bubble sort consists of comparing each pair of adjacent items. Then one of those two items is considered smaller (lighter) and if the lighter element is on the right side of its neighbour, they swap places. Thus the lightest element bubbles to the surface and at the end of each iteration it appears on the top. I’ll try to explain this simple principle with some pictures.

1. Each two adjacent elements are compared

In bubble sort we've to compare each two adjacent elements
In bubble sort we've to compare each two adjacent elements

Here “2” appears to be less than “4”, so it is considered lighter and it continues to bubble to the surface (the front of the array).
Continue reading Computer Algorithms: Bubble Sort →

JavaScript Performance: for vs. while

javascript, , , , , , , , , ,

JavaScript Loops

If you have read some preformance tests on JavaScript loops, you may have heard that “while” is faster than “for”. However the question is how faster is “while”? Here are some results, but first let’s take a look on the JavaScript code.

The for experiment

console.time('for');
for (var i = 0; i < 10000000; i++) {
	i / 2;
}
console.timeEnd('for');

The while experiment

console.time('while');
var i = 0;
while (i++ < 10000000) {
	i / 2;
}
console.timeEnd('while');

Note – these tests are performed and measured with Firebug on Firefox.

Results

It’s a fact, that you’ll get different results as many times as you run this snippet. It depends also on the enviroment and software/hardware specs. That is why I performed them 10 times and then I took the average value. Here are the values of my performance tests. Note that both for and while perform 10,000,000 iterations.

And the Winner Is

While is the winner with an average result of 83.5 milliseconds, while “for” result is 88 average milliseconds.

As the diagram bellow shows, the while loop is slightly faster. However we should be aware that these performance gains are significant for large number of iterations!

JavaScript Performance: for vs. while
JavaScript Performance: for vs. while

Does JavaScript undefined Equals undefined?

javascript, , , , , , , , , , , , ,

Weird JS

Does "undefined" equals "undefined"?
Does JavaScript "undefined" equals "undefined"?

As you know sometimes JavaScript can be weird. Let’s see the following example and let’s try to answer the question: does “undefined” equals “undefined”. What do I mean?

First take a look at the following code.

var a;
var b = undefined;
 
// alerts "false"
alert(b == a);

Both a and b are undefined, but they are NOT equal. Now let’s see where it can become a problem.

We have an object with one member variable that is not defined.

var f1 = function()
{
	this.myvar;
};
 
var obj1 = new f1();

Now you’d like to know whether the object “b” has the property “myvar”. There are lots of examples online, but what’s the right way?
Continue reading Does JavaScript undefined Equals undefined? →

OOP JavaScript: Accessing Public Methods in Private Methods

javascript, micro tutorial, web development, , , , , , , , , , , , , ,

As you know in JavaScript when you define a variable with the special word “var” the scope of this variable is within the function. So when you simply wite “var a = 5” the variable named “a” has a global scope and can be accessed in any function in the global scope.

var a = 5;
 
function f() { return a; } // returns 5

Thus f will return the value of “a” which equals to 5. You can also change the value of the global variable in the function body.

var a = 5;
function f() { a = 10; return a; }
console.log(a); // equals to 10

Now after we call the function f the value of “a” will equal to 10. This is because we reference the global variable “a” into the function body without using the keyword “var”. This means that if you put the “var” keyword the variable “a” inside the function body is no longer the same variable as the variable defined outside the body. It becames “local” and it’s visible only inside the function.
Continue reading OOP JavaScript: Accessing Public Methods in Private Methods →

A JavaScript Trick You Should Know

javascript, micro tutorial, PHP, , , , , , , , , , , , , , ,

JavaScript Strings

You should know that in JavaScript you cannot simply write a multilined code chunk, i.e. something like this:

var str = 'hello
world';

This will result in an error, which can be a problem when you deal with large strings. Imagine a string containing some HTML that should be injected via innerHTML. Now one possible solution is to concatenate two or more strings, by splitting the initial string.

var str = 'hello'
        + 'world';

Howerver this solution result in some additional operations like concatenation. It can be very nice if there was something like the PHP multiline string format.

The PHP Example

In PHP you have the same use case with strings. You can have a string concatenated over multiple lines, but you cannot split lines like so:

// the following line is wrong
$str = 'hello
world'; 
 
// a possible solution to the line above is
$str = 'hello'
     . 'world';
// which is very similar to the js solution in the second example
 
// ... but in PHP there is the so called HEREDOC
$str = <<<EOD
hello
world
EOD;

The heredoc gives us the power to write multiline strings.

The JavaScript Trick

Actually in JavaScript there is something that’s exactly what Heredoc is meant to be for PHP. Take a look at the last example:

var text = <>
this <br />
is
my
multi-line
text
</>.toString();
 
document.body.innerHTML = text;

Thus you can write multiline strings in the JavaScript code.