CSCI N341: Client-Side Web Programming Copyright ©2004  Department of Computer & Information Science "Object-Oriented" JavaScript

CSCI N341: Client-Side Web Programming Copyright ©2004  Department of Computer & Information Science Goals Review what objects areReview what objects are Understand InheritanceUnderstand Inheritance Understand EncapsulationUnderstand Encapsulation Understand PolymorphismUnderstand Polymorphism Define a JavaScript ObjectDefine a JavaScript Object

CSCI N341: Client-Side Web Programming Copyright ©2004  Department of Computer & Information Science REVIEW: Objects An object is a unique programming entity in a script and/or web page. An object has properties that describe it, methods which it can perform and events to which it can react.An object is a unique programming entity in a script and/or web page. An object has properties that describe it, methods which it can perform and events to which it can react.

CSCI N341: Client-Side Web Programming Copyright ©2004  Department of Computer & Information Science REVIEW: Properties A property (aka – "attribute") is a characteristic that describes an object. It is similar to an adjective in grammar. Properties are given values (Hair Color is a property; its value might be brown or red).A property (aka – "attribute") is a characteristic that describes an object. It is similar to an adjective in grammar. Properties are given values (Hair Color is a property; its value might be brown or red).

CSCI N341: Client-Side Web Programming Copyright ©2004  Department of Computer & Information Science REVIEW: Methods A method is something an object can do. It is similar to a verb in grammar. Sometimes we need to give methods descriptive words that tell it how to work. These descriptive words are called arguments (Running might be a method of the “human object”; an argument for running might be the speed at which to run).A method is something an object can do. It is similar to a verb in grammar. Sometimes we need to give methods descriptive words that tell it how to work. These descriptive words are called arguments (Running might be a method of the “human object”; an argument for running might be the speed at which to run).

CSCI N341: Client-Side Web Programming Copyright ©2004  Department of Computer & Information Science REVIEW: Events An event is something in an object’s environment to which that object can react. For the human object, a fire alarm is an event; Humans react to a fire alarm using a method – exiting the building.An event is something in an object’s environment to which that object can react. For the human object, a fire alarm is an event; Humans react to a fire alarm using a method – exiting the building.

CSCI N341: Client-Side Web Programming Copyright ©2004  Department of Computer & Information Science Inheritance Inheritance — The ability to create new classes that are based on existing ones. The methods (operations) and attributes (data) of the original class are usually incorporated into the new class, together with methods and attributes specific to the latter.Inheritance — The ability to create new classes that are based on existing ones. The methods (operations) and attributes (data) of the original class are usually incorporated into the new class, together with methods and attributes specific to the latter. These pre-defined blueprints already know how to perform many methods, and come with a framework for accompanying attributes.These pre-defined blueprints already know how to perform many methods, and come with a framework for accompanying attributes. For example, in Java there is a button class, which has an attribute of a label, and can perform certain tasks when clicked.For example, in Java there is a button class, which has an attribute of a label, and can perform certain tasks when clicked.

CSCI N341: Client-Side Web Programming Copyright ©2004  Department of Computer & Information Science Encapsulation Encapsulation is incorporation of data and operations on that data into a single unit in such a way that the data can only be accessed through these operations. This is the fundamental idea behind classes and objects. Also referred to as data hiding, traces its history to subroutines and functionsEncapsulation is incorporation of data and operations on that data into a single unit in such a way that the data can only be accessed through these operations. This is the fundamental idea behind classes and objects. Also referred to as data hiding, traces its history to subroutines and functions

CSCI N341: Client-Side Web Programming Copyright ©2004  Department of Computer & Information Science More on Encapsulation If one object passes a message to another, asking that a method be performed, the calling object doesn’t need to know the gory details of how the task was performed… it simply needs a final result back from the called objectIf one object passes a message to another, asking that a method be performed, the calling object doesn’t need to know the gory details of how the task was performed… it simply needs a final result back from the called object The called object is using encapsulation… its method detail and attribute values can remain hidden from view – and thereby protected.The called object is using encapsulation… its method detail and attribute values can remain hidden from view – and thereby protected. Encapsulation adds some built in quality control to programming by restricting access to variables and blocks of code and by forcing programmers to think in terms of small, focused subsections of code.Encapsulation adds some built in quality control to programming by restricting access to variables and blocks of code and by forcing programmers to think in terms of small, focused subsections of code.

CSCI N341: Client-Side Web Programming Copyright ©2004  Department of Computer & Information Science Polymorphism Polymorphism — The ability to create methods that perform a general function, which automatically adapts itself to work with objects of different classes.Polymorphism — The ability to create methods that perform a general function, which automatically adapts itself to work with objects of different classes. To design code supporting polymorphism, it means that you develop your code in general enough terms that it supports application in other ways.To design code supporting polymorphism, it means that you develop your code in general enough terms that it supports application in other ways. For example, imagine writing a close method for a door object. If you were thoughtful enough in the design, the same method could be utilized by a window object, or maybe even a mouth object!For example, imagine writing a close method for a door object. If you were thoughtful enough in the design, the same method could be utilized by a window object, or maybe even a mouth object!

CSCI N341: Client-Side Web Programming Copyright ©2004  Department of Computer & Information Science Is JavaScript an OOP language? Well, not really …Well, not really … We call JavaScript an "object-inspired" languageWe call JavaScript an "object-inspired" language It uses objects by way of supporting inheritance and encapsulation, but it doesn't really provide support for polymorphism.It uses objects by way of supporting inheritance and encapsulation, but it doesn't really provide support for polymorphism.

CSCI N341: Client-Side Web Programming Copyright ©2004  Department of Computer & Information Science “Object-Oriented” JavaScript More like “Object-Inspired” JavaScriptMore like “Object-Inspired” JavaScript We can create new, custom, re-usable objects in JavaScript that include their own methods, properties and events.We can create new, custom, re-usable objects in JavaScript that include their own methods, properties and events. Consider the following problem: “I want to record the color, brand, horsepower and price of several cars.”Consider the following problem: “I want to record the color, brand, horsepower and price of several cars.”

CSCI N341: Client-Side Web Programming Copyright ©2004  Department of Computer & Information Science Solution without OOP Design Uses parallel arraysUses parallel arrays Can be confusingCan be confusing –Difficult to keep track of which car has which color, brand, etc. Example:Example:

CSCI N341: Client-Side Web Programming Copyright ©2004  Department of Computer & Information Science Solution with OOP Design Calls to an API that contains the custom car objectCalls to an API that contains the custom car object Much cleaner codeMuch cleaner code Re-usable objectRe-usable object

CSCI N341: Client-Side Web Programming Copyright ©2004  Department of Computer & Information Science What is an API? API stands for Application Programming InterfaceAPI stands for Application Programming Interface Allows programmers to extend the current language to included customized componentsAllows programmers to extend the current language to included customized components Most modern languages incorporate APIsMost modern languages incorporate APIs

CSCI N341: Client-Side Web Programming Copyright ©2004  Department of Computer & Information Science Questions?