Pushing variable to an existing function with javascript

Question

So, lets say I have a function like this

(function($){
   $.fn.test = function(opts){
      var   _object = $(this),
            _opts = $.extend({}, $.fn.test.defaults, opts),
            _callback = _opts.objects[1].callback

      /* some code here */

      _callback() /* calling for a callback */
   }

   $.fn.test.defaults = { 
      /* not that important for now */
   }
})

That's how I initialise that function

$('.element').test({ 
   option: 0,   /* not important */
   variable: 1, /* not important */
   objects: [ 
      { 
         "object"   : ".element2",
         "callback" : false
      }, 
      { 
         "object"   : ".element3", /* THIS IS OBJECT № 2 */
         "callback" : function(){ 
            /* >>> {THIS PART} <<< */
            console.log (this)
         }
      },
   ]

So on {THIS PART} it just returns the data of object №2, but I would like the callback function to run on my _object element from $.fn.test so it would output the data of $('.element'). I can't make it hardcoded, and can't put instead console.log (this) just console.log ($('.element')) - as I'm trying to make more dynamic function. So I need to replace this with my _object element at the moment when it's calling for a callback right here _callback() /* calling for a callback */ . I definitely can't use replace as it's not a string, but I had an idea to convert function to a string, change what I need and then convert to function - but that sounds like inappropriate solution.

Do you have any ideas in your mind? What can you suggest?

Thank you in advance.

Sergio Flores · Accepted Answer · 2014-12-05 18:38:39Z

1

I'm not sure if I understand you correctly but if you want to get the $.fn.test scope you can try something like this:

$.fn.test = function(opts){
  var _object = $(this),
      _opts = $.extend({}, $.fn.test.defaults, opts),
      _callback = _opts.objects[1].callback;

  _callback(this);
}

and

$('.element').test({ 
   option: 0,
   variable: 1,
   objects: [ 
      { 
         "object": ".element2",
         "callback": false
      }, 
      { 
         "object": ".element3",
         "callback" : function(parentScope){ 
            console.log(parentScope);
         }
      },
   ] 
});

answered Dec 5, 2014 at 18:38

Sergio Flores

5,4475 gold badges40 silver badges60 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Jev Over a year ago

I find it very useful, simple, and fixing my problem. Thank you

guest271314 · Accepted Answer · 2014-12-05 19:05:40Z

Note, If interpret question correctly , requirement to return _object = $(this) as this at console.log (this) _callback ?

Try

    (function($){
       $.fn.test = function(opts){
          var _object = $(this),
                _opts = $.extend({}, $.fn.test.defaults, opts),
                _callback = _opts.objects[1].callback;

          /* some code here */
          // call `_object` as `this` at `_callback`
          _callback.call(_object) /* calling for a callback */


       $.fn.test.defaults = { 
          /* not that important for now */
       }
    }
    }(jQuery));

See Function.prototype.call() , Function.prototype.apply() , Function.prototype.bind()

    (function($){
       $.fn.test = function(opts){
          var _object = $(this),
                _opts = $.extend({}, $.fn.test.defaults, opts),
                _callback = _opts.objects[1].callback;
    
          /* some code here */
          // call `_object` as `this` at `_callback`
          _callback.call(_object) /* calling for a callback */
    
    
       $.fn.test.defaults = { 
          /* not that important for now */
       }
    }
    }(jQuery));

$('html').test({ 
   objects: [ 
      { 
         "object"   : ".element2",
         "callback" : false
      }, 
      { 
         "object"   : ".element3", /* THIS IS OBJECT № 2 */
         "callback" : function(){ 
            /* >>> {THIS PART} <<< */
            console.log(this);
            $(this).find("body").append(this[0].tagName)
         }
      },
   ]
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>

Collectives™ on Stack Overflow

Pushing variable to an existing function with javascript

2 Answers 2

1 Comment

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Related