Javascript/Jquery 3.3 conversion function from non strict to strict and sequential calls

Question

I'm trying to turn an old non-strict function to a version that is compatible with the strict version and with Jquery 3.3

The old function allowed me to recall the various functions also sequentially, obtaining a single final result, something that in the new one I can not reproduce after several attempts.

The old function is:

    var num_modali = 0;

    _modale = function(){

            this.livello_m = num_modali;

            this.percorso = function(){
                return (this.livello_m > 0) ? $('body').find('#modale_' + this.livello_m).find(modale_content) : $('body');
            };

            this.listarecord = function(){
                return lista_record = (this.livello_m > 0) ? '#lista_records_modale' : '#lista_records';
            };

            this._pre = function(){
                this.livello_m--;
                return this;
            };

            this._go = function(){
                return this.percorso();
            };

            this._getlivello = function(){
                var livello = (this.livello_m > 0) ? this.livello_m : 0;
                return livello;
            };

            this._chiudi = function(where){
                $destroy_modale();
                return this;
            };

            this._delete = function(what){
                this.percorso().find(this.listarecord()).find(what).remove(what);
                return this;
            };


            if(this instanceof _modale){
                return this;
            }else{
                return new _modale();
            }


        };

with this I could also call in this way: _modale()._pre()._pre()._go();

The global variable num_modali is used by a second function that deals with managing the modal

The new function:

var _modale = {
    livello_m: num_modali,

    percorso: function(){
        return (this.livello_m > 0) ? 'body #modale_' + this.livello_m + ' .modale_content' : 'body';
    },
    listaRecord: function(){
        return (num_modali > 0) ? '#lista_records_modale' : '#lista_records';
    },
    pre: function(){
        return this.livello_m - 1;
    },
    go: function(){
        return this.percorso();
    },
    getlivello: function(){
        return (this.livello_m > 0) ? this.livello_m : 0;
    },
    chiudi: function(){
        modale.destroyModale();
        //return this;
    },
    _delete: function(what){
        _modale.percorso().find(_modale.listaRecord()).find(what).remove(what);
    }
};

If I try to execute the same sequential call: _modale.pre().pre().go(); return _modale.pre(...).pre is not a function

How can I change the function according to strict directives and get the same operation?

Answer 1

You need to return this in your function for it to be chainable :

pre: function(){
  this.livello_m--;

  return this; // Here
}