Using Prototype on JS

Asked

Viewed 93 times

2

I am in need of a help in the use of Prototypes, I want to organize and maintain a cleaner code and can reuse my classes at other times... And in the research the use of Prototype seems to be something advantageous... (I may have got it wrong, correct me...)

First I’ll put my code down and then my doubts...

var Model = function(hello) {
    this.hello = hello; 

    //meu teste
    this._init();
}

Model.prototype = function(){
    var _init = function(){
        console.log("Init...");

        this.helloWorld();
    },

    _helloWorld = function(){
        alert(this.hello)
    };

    return {
        helloWorld : _helloWorld
    };
}();

1° Doubt: Inside my Builder how could I call my function "_init"? Since it’s private, I’d like you to take the first call inside the builder.. In my example above, I made the call via "this. _init()", but had the error:

Uncaught TypeError: this._init is not a function

2° Doubt: Within my "_init" function will I, and will I have calls from other methods, in this example: "_helloWorld", would the way I did work? Or what the right way?

Valeu Pessoal.

  • 1

    Interesting fact: why not use the JS class in this case?

  • @Andersoncarloswoss has an example? As I commented, at first the way to structure code so pleased me... But, I’m open to new tips!

1 answer

2


The point is that you didn’t export the function _init to the body of prototype, as it did with the function helloWorld; thus, it will exist only in the local scope of the function that defines the prototype, but not on the object itself. To solve, simply export the function:

var Model = function(hello) {
    this.hello = hello; 

    // Chamando o método "init"
    this.init();
}

Model.prototype = function(){
    var _init = function(){
        console.log("Init...");

        this.helloWorld();
    },

    _helloWorld = function(){
        console.log('Hello ' + this.hello)  // Alterei para console.log para facilitar a visualização
    };

    return {
        init: _init,  // Exportanto para o prototype a função _init
        helloWorld : _helloWorld
    };
}();

const m = new Model('world');

But ES6 has defined the class structure in Javascript and has a very good support already, except in the IE family. With her, you can do:

class Model {
  constructor(name) {
    this.name = name
  }
  
  hello() {
    console.log('Hello ' + this.name)
  }
}

const m = new Model('world')

m.hello()

You can read more about the classes in MDN: Classes in Javascript.

Related:

  • a question, within the "Init" function, could I call the "_helloWorld" method instead of exporting Helloworld in the prototype? The idea was that _helloWorld, for example, would be a private method and could not be accessed directly m.helloWorld(), thank you for your help!!!

  • @Ronisommerfeld Can, but with a detail. In this case, the function _helloWorld will not be associated with the object, being a normal function, not a method, which implies that the this inside _helloWorld will not point to your object, but to the function itself. This way, you will need to pass the object you want to work with via parameter. Take an example: https://repl.it/@acwoss/Precioustartactivecontent

  • now I can understand... That’s what I’d like to know. Thank you very much for your help!

Browser other questions tagged

You are not signed in. Login or sign up in order to post.