Tuesday, September 18, 2012

Things I wish I had been told about objects

You can read this in a nice wiki format here

When looking at tutorials and tips, you'll hear phrases like "the objects 'x' method" and "returns an 'x' object". If you're not sure what this means, it definitely helps to get a grasp of the concept of objects when you are programming.

A big problem I had when I first learned about Object Oriented Programming was that tutorials all needed to be so damn correct. Since I was only a noob this lead to confusion and frustration.

This post is not entirely correct, and in some ways just flat wrong. But it serves to bridge the gap between procedural programming and OOP for the newbie. If you continue down the golden path of OOP you'll find that a lot of the stuff I said here was fallacious, but it was a means to an end.

The confusing stuff

I'm going to start this article with a bunch of stuff you potentially won't understand. It's important that you read this stuff first so your brain gets ticking in the right direction. Once you have read the rest of the article, come back to the top and read the confusing stuff again. Hopefully it will click.

To confuse you further I am talking about Appcelerator's Titanium, a JavaScript API that is designed to convert familiar JavaScript to spooky Java and objective-c for phone apps. But regardless, the concepts are universal.

Classes

Objects are created from classes. Classes are essentially a list of functions and variables that interact with each other under a common name, usually stored in their own file. Classes serve the purpose of grouping relevant tasks together and making code nice and tidy.

When creating objects in your code (let's focus on Titaniums 'window' object), you'll notice that some of the functions are capitalized. Capitalized words are the classes.

Titanium.UI.createWindow()

In this example, Titanium is the core class that all the rest of the classes are based on. UI is a class that ''extends'' the Titanium class. The createWindow() bit is a ''method'' contained in the UI class. Since the Titanium class does all kinds of stuff already, the developers would have wanted to separate the sub-functions, for greater code maintainability.

For instance, having all the UI stuff in with the Database stuff (another sub-class of Titanium) would branch the Titanium class out way too much, so the UI and Database subclasses were made.

Part of ''extending'' a class involves inheriting all of the functions contained in the parent class. So where the Titanium class may contain a function that the UI class relies on, the UI class itself would not have any mention of this function because it has implicitly inherited that function.

This is why you have to write Titanium.UI to call functions relevant to the App UI (User Interface). Otherwise the UI class wouldn't know where half of its functions are.

Objects

When you create an object in Titanium (like the window object), you are creating an ''instance'' of the class. When you call the createWindow() function, and pass it a bunch of parameters, you are telling the UI class to use its createWindow() method to create a window object. This is what people mean when they say "constructor" method. When you call a constructor method you will generally (in Titanium at least) be returned an instance of the object you created.

When you create a window object you need to store it in a variable so that you can use the variable name to reference the object.

var win1 = Titanium.UI.createWindow();

If you were to look at the source code for your object, it would look a bit like this:

{
     this.open = function(){
          // all the open window code goodness
     }

     this.close = function(){
          // all the close window code goodness
     }

     this.title = "yourTitle" // this is set when you pass the title info to the object on creation

     this.backgroundColor = "yourColor" // set when you pass the info to the object on creation

// A bunch of other code that I have no idea how it looks
}

The functions are the methods of the object, which are called by calling the object, and then the method: win1.open();. The variables are the properties of the object, and operate similarly, but more on that below.

For terminology reasons, when you are looking at the class code for an object, variables are variables and functions are called functions. Once you create an object, the variables are called properties and the functions are called methods.

This is more for when you are learning about coding your own classes, for now just remember that a method is called from an object like win1.open() and a property like win1.backgroundColor.

The basic stuff

Take a breath, grab a drink and stop your head spinning, here comes the easier stuff. Make sure you go back and read that confusing stuff when you're done here.

So what is an object again?

An object is a group of methods and properties that simplifies the layout and modularity of a program. You create an object by calling it by name, and passing variables if needed. For instance, when you create your window in your app, you are actually creating a window "object".

var win1 = Ti.UI.createWindow()

This is what they mean on the docs when they say ''"returns a window object"''. What you have now is not a blank image of a window, but rather a group of methods you can use and properties that need to be defined in order to display a code-generated window, like the big code block above.

Object Methods and Properties

You can access your new objects methods and properties by calling the object name, then a dot '.' and then the method/property name. You would have called plenty of object methods in Titanium. Like win1.open().

You can also call object variables directly:

var backgroundColor = win1.backgroundColor;

Some people prefer to use the "getter" methods instead:

var backgroundColor = win1.getBackgroundColor();

You can set the properties with the "setter" methods:

win1.setBackgroundColor('#fff');

To check an object property, use the logical comparison operators ==, != etc.

if(win1.backgroundColor == '#fff'){ win1.setBackgroundColor('red'); }

Never done

That's just the tip of the iceberg for OOP, a short list to help you understand why the language looks the way it does, and give you a bit of insight into the inner workings of the code.

Now is a good time for you to go back to the confusing stuff at the top of the page and have a second read of it. You should also read up on creating classes in Java and JavaScript. Javascript uses a bit of a roundabout way of creating object methods and properties (google for Javascript prototype) and while you don't need to know about Java when using Titanium, it definitely helps if you have a better grassroots understanding of programming in general.

As always, you should read through the API documentation to find out what you can and can't do with each object type. It may seem like sucking eggs but you really will find some interesting methods in there.

No comments:

Post a Comment