JavaScript Tutorial
JS - Introduction JS - Basic JS - Placement JS - Output JS - Statements JS - Syntax JS - Variables JS - Comments JS - Data Types JS - Operators JS - Operator Precedence JS - Condition JS - Switch JS - Functions JS - Objects JS - Loops For JS - Loops While JS - Break JS - Strings JS - String Methods JS - Numbers JS - Number Methods JS - Arrays JS - Array Methods JS - Array Iteration JS - Events JS - Event Listener JS - Event Propagation JS - Date JS - Math JS - Random JS - Boolean JS - Type Conversion JS - RegExp JS - Exception JS - Scope JS - Debugging JS - Hoisting JS - Strict Mode JS - this Keyword JS - Mistakes JS - Best Practices JS - Performance JS - Form Validation JS - ES6 Features
JS Objects
Object Definitions Object Properties Object Methods Object Constructors Object Prototypes
JS Functions
Function Definitions Function Parameters Function Call Function Apply Function Closures
JS HTML DOM
DOM Introduction DOM Methods DOM Selectors DOM HTML DOM CSS DOM Attributes DOM Navigation
JS Browser BOM
JS - Window JS - Screen JS - Location JS - History JS - Navigator JS - Popup Alert JS - Timing JS - Cookies
JS AJAX
AJAX - Introduction AJAX - XMLHttp AJAX - Request AJAX - Response AJAX - PHP
JS JSON
JSON - Introduction JSON - Syntax JSON - Data Types JSON - Parse JSON - Stringify JSON - Objects JSON - Arrays JSON - PHP JSON - JSONP
JS References
JavaScript Reference JavaScript Methods HTML DOM Reference

JavaScript Object Methods

A method is a function associated with an object, or, simply put, a method is a property of an object that is a function.

Methods are defined the way normal functions are defined, except that they have to be assigned as the property of an object.


Accessing JavaScript Methods

In order to retrieve an object method, you would call it much in the same way you would call a regular function, just attached to the object variable.

Run code

If you access a method without the () parentheses, it will return the function definition:

Run code

Using this for object references

JavaScript has a special keyword, this, that you can use within a method to refer to the current object.

You may have noticed something slightly strange in our method. Look at this one for example:

The this keyword refers to the current object the code is being written inside — so in this case this is equivalent to user.

In other words, this.firstName means the firstName property of this object.

You can learn more about the this keyword in out JS this Keyword tutorial.


Adding New Methods

In order to add a new method to an object, you would assign a new function to a property with the assignment operator (=).

This example adds "greet" method to the user object:

Run code

Getters and Setters

ECMAScript 5 (2009) introduced Getters and Setters.

A getter is a method that gets the value of a specific property.

A setter is a method that sets the value of a specific property.

You can define getters and setters on any predefined core object or user-defined object that supports the addition of new properties.


JavaScript Getter (The get Keyword)

This example uses a loc property to get the value of the location property:

Run code

JavaScript Setter (The set Keyword)

This example uses a loc property to set the value of the location property:

Run code

Difference between Function or Getter?

The following two examples shows the differences between function and getter:

Example 1 (Using Function):
Run code
Example 2 (Using Getter):
Run code

Example 1 access fullName as a function: user.fullName().

Example 2 access fullName as a property: user.fullName.

Using Getters and Setters:

  • It gives simpler syntax
  • It allows equal syntax for properties and methods
  • It can secure better data quality
  • It is useful for doing things behind-the-scenes

Object.defineProperty()

The Object.defineProperty() method can also be used to add Getters and Setters.

Syntax:
Object.defineProperty(object, property, {value : value})

Lets take an example of "counter" object:

Run code