CODEWITHSUNDEEP
javascript
Vikram Anand Bhushan
Vikram Anand Bhushan

Reputation: 4886

Difference between using the property of an object directly and returning using a function

In Mozilla MDN

I have following example

var Animal = {
  type: "Invertebrates", // Default value of properties
  displayType : function() {  // Method which will display type of Animal
    return this.type;
  }


}

So if I do

console.log(Animal.displayType()); \\Invertebrates

and

console.log(Animal.type); \\Invertebrates

Both the out put are same so what is the point of using a method to return the property of the function

Or what would be the right way to return an internal property of an object , Directly or using a function ?

Thanks & Regards

Upvotes: 0

Views: 46

Answers (3)

Joe
Joe

Reputation: 1885

The difference is when you pass them around. If I pass Animal.type to a function, I get the type immediatly, but if I pass the function I can then run it later and get the type at a future point.

Imagine I have an AJAX call in my code, and in the success method I want to do something based on the type. If I pass the type into my function, it could potentially change before the success function is called. In this case, having a function is better because we can calculate the type at the time the success happens.

Consider the following code:-

function test(typeProp, typeFunc) {
    $.ajax({
        url: '/GetTest',
        success: function() {
            if(typeProp === 'Cat') {
                //do something
            }
            if(typeFunc() === 'Cat') {
                //do something
            }
        }
    })
}

var Animal = {
  type: "Cat", // Default value of properties
  displayType : function() {  // Method which will display type of Animal
    return this.type;
  }

test(animal.type, animal.displayType);
animal.type = 'Dog';

Once the code gets to the success function, typeProp will be 'Cat', but typeFunc will return 'Dog';

Upvotes: 0

David H.
David H.

Reputation: 507

Sometimes you want to use its property to return some other information:

Example: You have a mapping of "Invertebrates" which returns the description of the word (dictionnary). Thus by calling displayDefinition() it will give you the definition

  displayDefinition: function() {  
    return dictionnaryFind(this.type);
  }

Upvotes: 0

Jacques de Hooge
Jacques de Hooge

Reputation: 6990

The point is that this function may compute what it returns, rather than read it from a property.

In general, functions like this, getters and setters, are said to enhance encapsulation and make your design more resilient against change. In addition to this, setters may trigger events, something that simple assignment to a property can't do.

By the way, the name 'property' in JS is very unfortunate, since in fact, in all other languages a property IS something only accessible via a getter and a setter.

Accessing attributes only via functions came in fashion when java beans were invented, to facilitate use of a tool called a bean box. Never mind what that is.

Applying getters and setters everywhere is wicked and totally unnecessary. It may easily slow your program down by factors.

They are very powerful, WHEN YOU NEED THEM, for the reasons I described. Don't only think at your current design, but also about future modifications. But adding getters and setters everywhere, in addition to making your code slow, will also make the amount of source code explode, which is in itself a hindrance to future modifications.

So you can use them if you deem it fit, but prefer common sense above all...

Upvotes: 3

Related Questions