JavaScript Methods and this Keyword

JavaScript Methods and this Keyword

With the help of examples, you will learn about JavaScript object methods and this keyword in this tutorial.

Objects in JavaScript can also contain functions. As an example:

// object containing method
const person = {
    name: 'John',
    greet: function() { console.log('hello'); }
};

In the preceding example, a person object has two keys (name and greet), each with a string value and a function value.

As a result, the JavaScript method is essentially an object property with a function value.

Accessing Object Methods

A dot notation is used to access an object method. The syntax is as follows:

objectName.methodKey()

You can get to a property by using an objectName and a key. You can call a method by providing an objectName and a key for that method (). As an example:

// accessing method and property
const person = {
    name: 'John',
    greet: function() { console.log('hello'); }
};

// accessing property
person.name; // John

// accessing method
person.greet(); // hello

In this case, the greet method is accessed as person.greet() rather than person.greet.

If you merely use person.greet to access the method, you will get a function definition.

person.greet; // ƒ () { console.log('hello'); }

JavaScript Built-In Methods

There are numerous built-in method in JavaScript. As an example:

let number = '23.32';
let result = parseInt(number);

console.log(result); // 23

The Number object’s parseInt() method is used here to convert a numeric string value to an integer value.

Adding a Method to a JavaScript Object

You can also add a method in an object. For example:

// creating an object
let student = { };

// adding a property
student.name = 'John';

// adding a method
student.greet = function() {
    console.log('hello');
}

// accessing a method
student.greet(); // hello

An empty student object is generated in the preceding example. The name property is then added. Similarly, the greet method is now available. You can add a method and a property to an object in this manner.

JavaScript this Keyword

To access an object’s property from within a method of the same object, use this keyword. Consider the following example.

const person = {
    name: 'John',
    age: 30,

    // accessing name property by using this.name
    greet: function() { console.log('The name is' + ' ' + this.name); }
};

person.greet();

Output

The name is John

  • A person object is created in the preceding example. It has properties (name and age) and a greet method.
  • This keyword is used in the greet method when accessing an object’s property.
  • This keyword is used after. and key to access the properties of an object.

Note: When used with an object’s method in JavaScript, this keyword refers to the object. This is attached to an object.

However, a function within an object can access its variable in the same way that a normal function would. As an example:

const person = {
    name: 'John',
    age: 30,
    greet: function() {
        let surname = 'Doe';
        console.log('The name is' + ' ' + this.name + ' ' + surname); }
};

person.greet();

Output

The name is John

You may like:

continue and break Statements in JavaScript

javascript methods javascript methods javascript methods javascript methods javascript methods

Leave a Reply