JavaScript Programming/Objects

This lesson introduces JavaScript objects.

Objectives and Skills

edit

Objectives and skills for this lesson include:[1]

  • Complete and debug code that uses objects
    • Properties; methods; instantiation; Date object; retrieve date and time parts; localize date format (MM/DD vs DD/MM); add and subtract dates

Readings

edit
  1. Wikipedia: Associative array
  2. Wikibooks: JavaScript/Objects

Multimedia

edit
  1. YouTube: JavaScript Tutorial for Beginners - 18 - Objects
  2. YouTube: JavaScript Tutorial for Beginners - 19 - Objects Part 2
  3. YouTube: JavaScript Tutorial for Beginners - 20 - Objects Part 3
  4. YouTube: JavaScript Tutorial for Beginners - 21 - Objects Part 4
  5. YouTube: JavaScript Tutorial for Beginners - 22 - String Object
  6. YouTube: JavaScript Tutorial for Beginners - 51 - More on Objects
  7. YouTube: JavaScript this Keyword
  8. Javascript Objects Explained | Javascript Objects Tutorial

Examples

edit

Activities

edit

Complete the following activities using external JavaScript code. Apply JavaScript best practices, including comments, indentations, naming conventions, and constants. Use input elements for input and respond to input or change events, add buttons and respond to click events, or set a timer interval and respond to interval events. Use HTML elements for output. Use separate functions for each type of processing. Avoid global variables by passing parameters and returning results. Create test data to validate the accuracy of each program. Add comments at the top of the program and include references to any resources used.

  1. Create a web page that allows the user to enter book information for a bibliography. Include properties for title, author, year, publisher, city, and state. Respond to one or more user interface events to create an instance of a Book object and then display the book properties in APA format:[2]
         Last, F. M. (Year) Title. City, State: Publisher.
  2. Extend the program above by adding an APA method to your object that automatically formats the book for display. Use the APA method to format output, replacing the display code above.
  3. Extend the program above by adding an MLA method to your Book object that automatically formats the book for display. Display both APA and MLA formats for the book:[3]
        APA: Last, F. M. (Year) Title. City, State: Publisher.
        MLA: Last, First M. Title. Publisher, Year.
  4. Extend the program above, allowing the user to enter multiple book titles, one at a time. Add each book to an array of books. Display the full array in APA and MLA format after each object is added to the array.
  5. Extend the program above, allowing the user to choose either APA or MLA format, and display the selected format for each book. List the books in alphabetical order.

Lesson Summary

edit
  • An object is a set of properties or methods.[4] Each object holds related data.[5]
  • Objects are written in the name:value pair format.[4] Each pair must be separated by a comma. [5]
  • Object properties may be accessed using the dot notation or the bracket notation. [6]
  • Object properties can be a wide array of data types, such as arrays or even other objects.
  • In JavaScript, almost everything is an object. Only primitive date types, such as number, string, and Boolean, are not objects.[7]

Key Terms

edit
method
An action that an object can perform. A method is a function stored as a property, specific to that object. [8]
object
In JavaScript, almost "everything" is an object. Booleans, numbers, strings, dates, maths, regular expressions, arrays functions, and objects. All values, except primitive values, are objects.[9]
property
A property is a value associated with a JavaScript object.[10]

constructor

A constructor is a function that creates an object using the given inputs.

this
Refers to the owner of a function.[11]

See Also

edit

References

edit