Understanding Javascript _this, various types of function calls, and how to call a function inside a function?

I am learning how to reverse engineer existing javascript code, and I ran into several problems related to the fact that I do not understand how basic javascript works. The code below along with a screenshot of the comments that I have.

The code begins with a var warper declaration .

  • And then the warper variable is equal to the function inside the function? Why is this not a normal call to the Warper () function , but its inside another function?
  • I noticed the use of this. How does this differ from the usual one that is commonly used?
  • The identifier # btn-submit is activated when clicked. I see that it calls the click_submit function, but why exactly is Warper.prototype.click_submit instead of just click_submit () ?
  • And my last question I really want to do is call the click_submit function via js without pressing the # btn-submit button.

Question: How do I call the warper.click_submit function using js without having to click a button? I am trying to integrate this into another piece of my code.

I tried warper.prototype.click_submit and it does nothing. I guess it because its inside a function in a function?

enter image description here

(function() {
  var Warper;

  Warper = (function() {
    function Warper() {
      this.check_compatibility();
      this.attach_ux();
      if (window.SALT_DEFAULT != null) {
        $('#salt').val(window.SALT_DEFAULT);
        $('#salt').attr('disabled', true);
        $('.salt-label').text('Prefilled salt');
      }
    }

    Warper.prototype.check_compatibility = function() {
      if (typeof Int32Array === "undefined" || Int32Array === null) {
        return $('.form-container').html('<p>\n  Sorry, but your browser is too old to run WarpWallet, which requires Int32Array support.\n</p>');
      }
    };

    Warper.prototype.attach_ux = function() {
      $('#btn-submit').on('click', (function(_this) {
        return function() {
          return _this.click_submit();
        };
      })(this));
      $('#btn-reset').on('click', (function(_this) {
        return function() {
          return _this.click_reset();
        };
      })(this));
      return $('.what-salt').on('click', (function(_this) {
        return function() {
          return $('.salt-explanation').toggle();
        };
      })(this));
    };


    Warper.prototype.click_submit = function() {
      $('#btn-submit').attr('disabled', true).html('Running...');
      $('#btn-reset').attr('disabled', true).html('Running...');
      $('#passphrase, #salt, checkbox-salt-confirm').attr('disabled', true);
      $('.progress-pbkdf2, .progress-scrypt').html('');
      $('.progress-form').show();
      return warpwallet.run({
        passphrase: $('#passphrase').val(),
        salt: $('#salt').val(),
        progress_hook: (function(_this) {
          return function(o) {
            return _this.progress_hook(o);
          };
        })(this),
        params: window.params
      }, (function(_this) {
        return function(res) {
          $('#passphrase, #checkbox-salt-confirm').attr('disabled', false);
          if (window.SALT_DEFAULT == null) {
            $('#salt').attr('disabled', false);
          }
          $('#private-key').val(res["private"]);
          _this.write_qrs(res["public"], res["private"]);
          return console.log;
        };
      })(this));
    }; //click_submit

    return Warper;

  })(); // Warper End

  $(function() {
    return new Warper();
  });

}).call(this); // End Function
+4
source share
2 answers

The code begins with a var warper declaration .

  • warper ? Warper(), ?

. .

  • . , ?

_this - , this. , , this ( , ). , , this ( "" ) , . _this, that self.

  • # btn-submit . , click_submit, Warper.prototype.click_submit click_submit()?

, . this.clik_submit = function(){...}, . , function click_submit(){...} , .

  • , , click_submit js,

    btn-submit.

warper, click_submit. ( ) . click , . jquery , $("#btn-submit").click();

+4

Warper - .

Warper.prototype.attach_ux = function() {
  $('#btn-submit').on('click', (function(_this) { //2
    return function() {
      return _this.click_submit(); //3
  };
})(this));//1. 

on//1 'this' Warper Warper.prototype.attach_ux.

on//2 _this - , , // 1.

// 1 Warper, click_submit.

IIFE- .

$('#btn-submit').on('click', function(_this) { 
    return function() {
      return _this.click_submit();
  };
})

_this click, . Warper IIFE .

+1

Source: https://habr.com/ru/post/1659138/


All Articles