What is an object?

Functions

• What is a function?
• Pre-defined functions
• Scope of Variables
• Function Expressions
• Anonymous Functions
• Callback Functions

Objects

• What is an object?
• Accessing Object Properties
• Calling an Object’s Methods
• Altering Properties/Methods

Array Properties and Methods

• The length property
• Stack Methods
• Queue Methods
• Reordering Methods
• Manipulation Methods
• Location Methods
• Iterative Methods
• Working with array of objects

DOM

• The Document Object Model
• Node Relationships
• Working with the Contents of Elements
• Getting Elements by ID, Tag Name, or Class
• Adding and removing element

Built-in Objects

• Object Types
• The String Object
• The Window Object

Using Events in JavaScript

• What are events?
• Handling events
• DOM manipulation using events

Handling Input and Output

• Understanding HTML Forms
• Working with the Form Object
• Validating user input

Ajax and JSON

• Introduction to AJAX and JSON
• Viewing AJAX in action
• Using the XMLHttpRequest object
• Putting Objects in Motion with JSON

Data types like number and string can store only one value at a time. So, to store more than one value at a time, we have arrays and objects in JavaScript. As we already know, arrays have numbered indexes starting from 0. But in objects, data is stored as key-value pairs. These key-value pairs are known as properties. An object is very similar to an array but with the difference that you define the keys yourself. You’re not limited to using only numeric indexes but can use friendlier keys, such as first_name, age, and so on.

Example: 

var hero = 	{
  breed: 'Turtle',
  occupation: 'Ninja'
};

Here, the object hero has two properties. Each property is in the form of a key-value pair.

As you already know, an array is just a list of values. Each value has an index (a numeric key) starting from zero and incrementing by one for each value.

var myarr = ['red', 'blue', 'yellow', 'purple'];
myarr;
//["red", "blue", "yellow", "purple"]
myarr[0]
//"red"
myarr[3]
//"purple"

If you put the indexes in one column and the values in another, you’ll end up with a table of key/value pairs like this:

Let’s take a look at a simple object and examine its parts:

var hero = 	{
  breed: 'Turtle',
  occupation: 'Ninja'
};

You can see that:

• The name of the variable that contains the object is hero.
• Instead of [ and ] which you use to define an array, you use { and } for objects.
• You separate the elements (called properties) contained in the object with commas.
• The key/value pairs are divided by colons, as key: value.
• The keys (names of the properties) can optionally be placed in quotation marks.

For example these are all the same:

var o = {prop: 1};
var o = {"prop": 1};
var o = {'prop': 1};

It’s recommended that you don’t quote the names of the properties (it is also less typing!), but there are some cases when you have must use quotes:

• If the property name is one of the reserved words in JavaScript.
• If it contains spaces or special characters (anything other than letters, numbers, and the underscore character).
• If it starts with a number.

Properties and Methods

When talking about arrays, you say that they contain elements. When talking about objects, you say that they contain properties. A property of an object can contain a function, because functions are just data. In this case, you say that this property is a method.

var dog =	{
  name: 'Benji',
  talk: function(){
	    alert('Woof, woof!');
      }
};

Examples

Create an object with a property and print the property value in the console.

var obj = {
  property: 1
}
console.log(obj.property);

Create an object named ‘student’ with firstname, lastname and age properties and print them in the console.

var maths = {
  add: function(a,b){
         return a + b;
       }
}