This free JavaScript tutorial helps you to understand and use simple types and objects in JavaScript OOP (Object Oriented Programming). It's small post and very easy to learn, please go to the full JavaScript article for details.

• Demo
• Enlarge
• Reload
• New window

When I first started working with Javascript, I was a little surprise to know that you've got two "basic" types in BLOCKED SCRIPT there are simple types and objects. Simple types are numbers, strings, bools, null and undefined. Everything else is an object.

Objects are associated with two interesting features in BLOCKED SCRIPT

• unlike most OO languages, there really isn't the concept of a class in Javascript. It does support (probably a better word would be emulate?) many of the OO concepts you find in a OO language. For instance, inheritance relies on the prototype property (more about this in future posts). Using it well is a must if you want to write Javascript code;
• they're "mutable" and can be seen as a container of properties defined by the pair name/value (they're similar in features to what you get when you work with hashtables in.NET). Property names must be string and their values can be any Javascript value (except undefined because this value is used for identifying inexistent properties).

So, if there isn't a class concept, how do you create new objects in Javascript? You've got two options here: you can create an object literal (which I tend to call anonymous object) or you can create a function that initializes the fields of an object. In this post, we'll concentrate on looking at the basic features associated with object usage and we'll only be using object literals.

An object literal is delimited by curly braces and contains 0 or more properties defined through name:value pairs. Take a look at the following snippet:

var user = {
    name: "Luis",
    address: "Funchal"
};

You'll see that many developers delimit the name of a property with " or '. You only need to do that if the name you're using isn't a valid Javascript identifier or if it is a reserved keyword. Accessing the value is really simple too. For starters, we can use the well-known . notation:

alert(user.name);

Or you can use the not so well known indexer syntax:

alert(user["name"]);

The . syntax is the most used approach and you'll only see the indexer property being used in advanced scenarios (ex.: when you don't know beforehand the name of the property) or when the name isn't a valid Javascript identifier. Notice that the indexer syntax allows several interesting scenarios. For instance, the following snippet enumerates the properties of the user object:

for (var propName in user) {
    alert(propName + ":" + user[propName]);
}

The specs don't mention anything about the order in which the fields are enumerated, so don't take any dependencies on that. Accessing an inexistent property returns undefined:

alert(user.something);//undefined 

However, setting an inexistent property results in adding that property to the object. So, if the previous line of code was preceded by the next, it would return a valid value:

user.something = { msg: "Howdy" };

Btw, notice that the something property references another anonymous object (or, if you prefer the Javascript jargon, literal object). You can also remove an existing property from an object. To do that, we need to use the delete keyword. Try the following snippet:

user.something = { msg: "Howdy" };
alert(user.something);
delete user.something;
alert(user.something);

Running it will show you two alert messages: the first shows the info object and the second returns the undefined message. What I'm saying next won't probably mean much now, but it's important to remember that delete will only remove a property from the object if it exists (it won't remove prototype properties!).

And I guess this wraps this post.  In the next post, we'll keep looking at objects and we'll talk about functions and their role in Javascript OO. Keep tuned!

• Code
• Print

• Comment (1)
• Write

by cheryl, 15/06/2010 06:06 PM
OOP Reply

I don't think javascript can do OOP, but now I will learn as I will learn IP Address Classes too

by mocua.com, 18/06/2010 02:06 AM
Reply

bên này nhiều code đc, mình sẽ đưa sang diễn đàn bên mình cho mọi người tham khảo và học tập

by Preview

Cancel reply

Write your comment

Comments of Guest will be previwed before published
Give your real email to get notifying replies, or comment will be deleted

Your name *
Your email^g *
Your site

Comment's title

I assure 100% I am real human
I repeat I am not bot

• Sent (0)
• New