Lesson 3: Using Objects

Print-friendly Version    Download tutorial

The JavaFX Script programming language is an object-oriented language. But what does that mean? What exactly is an object? Simply put, an object is a discrete software bundle that consists of state and behavior. To better understand software objects, it helps to step outside of software for a minute and think about concepts that you're already are familiar with.

Your television set, for example, is an object. It has both state (current channel, current volume, on, off) and behavior (change channels, adjust volume, turn on, turn off). We tend to think of a television as a single object, but in reality, a television is actually composed of many other objects (the buttons and knobs on its face are all objects, as are the various components inside the television). In many cases, these smaller objects are also made up of... you guessed it... other objects.

We can break down a television's components until we reach a point where we can go no further (a screw, for example, really is just a single object, it's not composed of anything else). If you've ever bought a piece of exercise gear, or anything else with "some assembly required", you've probably seen an exploded diagram in its documentation showing every single object in its construction. At a glance you can understand how many objects there are, and how those objects all fit together. The same is true of .fx source files: you can easily see how a script's objects all fit together to form a full application.

So what does a software object actually look like in terms of code? In the JavaFX Script programming language, an object is created with an object literal:

Address {
     street: "1 Main Street";
     city: "Santa Clara";
     state: "CA";
     zip: "95050";
}

This creates one Address object, for use in a hypothetical address book application. It is initialized with specific values for its street, city, state, and zip. In a real application, you can imagine that the address book's GUI components would be synchronized with its underlying Address objects, so that what appears on screen reflects the actual data that is stored by the program.

But before you try compiling this code, you need to know one more thing: the complier first needs a special "blueprint" (called a class) that describes exactly what data an Address object will contain. (In this example, we are saying that an Address has a street, city, state, and zip, but the compiler won't know that until we supply a class file that provides that information.) We don't discuss writing your own classes until the end of the tutorial, because the JavaFX Application Programming Interface (API) contains a large library of built-in classes that are ready to use in your own programs. Furthermore, since the JavaFX Script programming language is built on the Java platform, you can also access the Java programming language API as well.

Having said that, you can compile the Address example by downloading the file Address.fx (which provides the Address class definition) and placing it in the same directory as the sample code shown above. (Just be sure to save the sample code to a file with a different name, such as AddressTest.fx). Nothing in this code produces any output, but the very fact that it compiles is proof that object creation was successful.

---

Note: The Address object's variables (street, city, state, zip) in this example are technically known as instance variables. You can think of instance variables as the set of built-in attributes that each object is guaranteed to contain. In fact, the term "attribute" was used in early versions of the JavaFX Script programming language (you may still occasionally see it used in older documentation and demos.) In the world of object-oriented programming, the terms "instance" and "object" are synonymous, which is where this term comes from.

---

Object literal syntax is both simple to learn and intuitive to use. Continuing with our example, the first word (Address) specifies the type of object that you are creating. The opening and closing braces define the body of the object. Everything else (street, city, state, zip) initializes the object's instance variables.

Note that when declaring an object literal, the instance variables may be separated by commas, whitespace, or semi-colons. You can use either, but we generally stick to semi-colons throughout this tutorial. For a more formal description of this syntax, refer to Figure 6.38 in the JavaFX Script Programming Language Reference.

You can also assign the newly created object to a variable for later access:

var myAddress = Address {
     street: "1 Main Street";
     city: "Santa Clara";
     state: "CA";
     zip: "95050";
}

Or nest one object inside another:

var customer = Customer {
     firstName: "John";
     lastName: "Doe";
     phoneNum: "(408) 555-1212";
     address: Address {
          street: "1 Main Street";
          city: "Santa Clara";
          state: "CA";
          zip: "95050";
     }
}

In this last example, the Customer object introduces a few new variables, then contains the original Address object in a variable named address. Notice how we've indented the code as the objects begin to nest. Real-world applications will typically contain lots of nested objects; this nested pattern makes it easy to see at a glance what objects belong where. To compile this example, you will need to add Customer.fx to your current directory.

Real-World Example: Video Puzzle

The video puzzle demo takes a streaming video feed and chops it up into a puzzle. Here we have highlighted a section of its code that uses object literals. You should be able to recognize the syntax, even if you are not familiar with the given classes. In this code excerpt, the visible and content instance variables belong to the Group object. The x, y, width, height, arcWidth, arcHeight, fill, and blocksMouse instance variables belong to the Rectangle object. The Group object has been stored in a variable called previewDimOverlay for later access.

In addition to instance variables, objects may contain instance functions as well. You can invoke an object's instance functions by typing the name of the variable (customer in the following example), followed by a dot ("."), followed by the function that you want to invoke:

var customer = Customer {
     firstName: "John";
     lastName: "Doe";
     phoneNum: "(408) 555-1212"
     address: Address {
          street: "1 Main Street";
          city: "Santa Clara";
          state: "CA";
          zip: "95050";
     }
}

customer.printName();
customer.printPhoneNum();
customer.printAddress();

This results in the following output:

Name: John Doe
Phone: (408) 555-1212
Street: 1 Main Street
City: Santa Clara
State: CA
Zip: 95050

Instance functions can also be defined to accept parameters and return values, as you learned in the previous lesson.