JavaScript as an OOP language

What is the definition of an OO programming?

Object-oriented programming (OOP) is a method programming paradigm that uses "objects" – data structures consisting of data fields and methods together with their interactions – to design applications and computer programs. Programming techniques may include features such as data abstraction, encapsulation, modularity, polymorphism, and inheritance (Wikipedia). So what is the connection between all of that and JavaScript?
Well, let's look over, with samples, all of the OOP characteristics and see for ourselves whether or not JavaScript have what it takes.

Objects:
This is plain and simple, JavaScript allows you to create classes and objects. You can have private and public variables and functions within. For example:

var myClass = function() {
   var privateVar = 'this is a private variable';
   this.publicVar = 'this is a public variable';

   function privateFunction() {
      return;
   }

   this.publicFunction = function() {
      return;
   }
}

Data Abstraction:
Similar to Java, JavaScript allows you to create an abstract class and extend it using prototype approach. For example: an abstract class named Animal and its usage with regard to various animals.

var Animal = function(type) {
   var animal;
   switch (type) {
      case "cat": animal = new Cat(); break;
      case "dog": animal = new Dog(); break;
      case "fly": animal = new Fly(); break;
   }

   this.eat = function() {
      animal.eat();
   }

   this.drink = function() {
      animal.drink();
   }

   this.speak = function() {
      animal.speak();
   }
}

var dog = new Animal('dog');
var cat = new Animal('cat');
dog.speak();
cat.eat();

Encapsulation:
JavaScript in its basis is encapsulated. A very simple and elegant way to demonstrate it is by using an anonymous function

(function() {
   var privateVar = 'this is private';
   this.publicVar = 'this is public';
})();

Another example will show a class and its usage

var Class = (function() {
   //Private members
   var privateVar = '';
   function privateFunction() {
      // Do something
   }

   return {
      //Public members
      publicFunction: function() {
         privateFunction();
      }
   }
})();

Class.publicFunction();

Modularity:
A very simple way to explain this is by describing a small problem and its solution.
An AJAX request is needed in an application. A handler dealing with these kinds of requests is a handler that we can call AjaxHandler (module A). A request can sent by XML (SOAP) or by coma separated variables. For handling XML we use another handler that deals with XML and nodes, we can call it XmlHandler (module B).
Both modules are incorporated into the same routine in order to retrieve data from the server, although they are composed separately and can be tested separately.

Polymorphism:
In order to use polymorphism with JavaScript all you have to do is to override the appropriate function. For example:

var Dog = function() {
   this.bark = function() {
      alert("wuff");
   };
}

var dog = new Dog();
dog.bark(); // "wuff"

function Cat() { }
Cat.prototype = new Dog();
Cat.prototype.bark = function() {
   alert("miao");
}

var cat = new Cat();
cat.bark(); // "miao"

Inheritance:
Inheritance in JavaScript can be done in various ways, among which are: prototype chaining, constructor “stealing” and other methods. Here I will show a combination of the two, as presented by Nicholas C. Zakas in “Professional JavaScript® for Web Developers, 2nd Edition, 2009”

function SuperType(name) {
   this.name = name;
   this.colors = ["red", "blue", "green"];
}
SuperType.prototype.sayName = function() {
   alert(this.name);
};

function SubType(name, age) {
   //inherit properties
   SuperType.call(this, name);
   this.age = age;
}

//inherit methods
SubType.prototype = new SuperType();
SubType.prototype.sayAge = function() {
   alert(this.age);
};

var instance1 = new SubType("Nicholas", 29);
instance1.colors.push("black");
alert(instance1.colors); // red,blue,green,black
instance1.sayName();     // Nicholas;
instance1.sayAge();      // 29

var instance2 = new SubType("Greg", 27);
alert(instance2.colors); // red,blue,green
instance2.sayName();     // Greg;
instance2.sayAge();      // 27

Getting the real height for a modal window

Ever used a modal window? I know that I have.
One of the main problems with it, that when you open it, the background element does not fill the entire document, but only the visible area. For this reason we use a function that gives us the entire scrolling height of the body/documentElement.

//----------------------------------------------------
// getScrollHeight
// return - entire document height
//----------------------------------------------------
function getScrollHeight() {
   var d = document.body;
   var de = document.documentElement;

   return Math.max(d.scrollHeight,
                          de.scrollHeight,
                          d.offsetHeight,
                          de.offsetHeight,
                          d.clientHeight,
                          de.clientHeight
   );
}

To use it in a script just write something like:
document.getElementById('modalWindow').style.height = getScrollHeight() + 'px';

Word 2007

Well well well….

Apparently you can post directly from word 2007. It took me only 5000 years to find it!

So now that I know this small and unimportant issue I'll post more frequently.

Cheers for now.

How to retrieve rows 50-60 (or anything else)

Let's say that we have a table and we want to retrieve only rows 50 to 60 from it. We can accomplish that in more than one way. In this short blog I will show the shortest (in my mind anyway) way to do that.

Our table scheme looks like this

CREATE TABLE testTable ( 
   id INT, 
   title NVARCHAR(250), 
   data XML
) 

In order to obtain the required rows we will use the CTE, which is built into the SQL Server.

WITH t1 (rowId, id, title, data) AS ( 
   SELECT ROW_NUMBER() OVER (ORDER BY id), id, title, data 
   FROM testTable
) 
SELECT * FROM t1 
WHERE rowId BETWEEN 50 AND 60

As can be seen in this example, the rows 50 to 60 are display as the result of the query.
Now I will explain what was done in this sample.
1. A temp table named t1 was created.
2. A query in the form similar to SELECT * FROM testTable was inserted into the new temp table. In addition to all of the fields, a new function named ROW_NUMBER() was used. This function adds (similar to IDENTITY) incremented row numbers.
3. Finally, a simple select between statement was called.

Hope that this is in some help to all.... I know that it's good and simple way to retrieve data.