How to access javascript variable's function

Question

I have a javascript file with this code:

(function () {

    var cookieconsent = {

        dismiss: function (evt) {
          evt.preventDefault && evt.preventDefault();
          evt.returnValue = false;
          this.setDismissedCookie();
          this.container.removeChild(this.element);
        },

        setDismissedCookie: function () {
          Util.setCookie(DISMISSED_COOKIE, 'yes', this.options.expiryDays, this.options.domain, this.options.path);
        }

    };

})();

How can I access the function "dismiss" from, let's say, the console of the browser or an a href link on the page?

This is the source of the file: Cookie Consent - GitHub

Thanks!

You cannot. The variable `cookieconsent` is local to the anonymous function in which it is declared. It is not visible or accessible outside that function (at least, not according to the code you posted). — Pointy, Jun 01 '16 at 13:48
Is this code you can modify or code that is included on a page you're trying to modify/use? — IMTheNachoMan, Jun 01 '16 at 13:48
Also, if you *really* "have a JavaScript file with this code", understand that your code does absolutely nothing. — Pointy, Jun 01 '16 at 13:49
@IMTheNachoMan this code is a JS file included in my page. I can edit it, but I would need to access that function from the code in my HTML page — MeV, Jun 01 '16 at 13:49
@Pointy, I am able to trigger that function when clicking on a button and I would like to trigger the same event when clicking on the page. This function dismiss a popup basically. — MeV, Jun 01 '16 at 13:50
Again, the code you posted *does not do anything at all*. If you're going to ask a question, it's important that the *real* code be posted. — Pointy, Jun 01 '16 at 13:51
@IMTheNachoMan I haven't written that function, it's the javascript included in my page. — MeV, Jun 01 '16 at 13:51
This is the source of the file: https://github.com/silktide/cookieconsent2/blob/master/cookieconsent.js — MeV, Jun 01 '16 at 13:51

score 2 · Answer 1 · answered Jun 01 '16 at 13:53

You cannot because the variable is defined in the scope of the anonymous function that is called when this script is executed. You can however alter the code the make the variable accessible like this:

(function (global) {

    global.cookieconsent = {

        ...

    };

})(this);

score 2 · Accepted Answer · edited May 23 '17 at 11:58

A variable is accessible in its scope only. So if you do

function helloWorld(){
  var test = "Test";
}

test is only available inside helloWorld.

When you do

var test = "test";

function notify(){
  console.log(test);
}

test will be accessible since it is defined in higher scope.

When you do same thing in a JS file, since this variable is not enclosed inside a function, it becomes a part of global scope (window) and hence they are available everywhere.

If you wish to make a variable global, you can use window.variableName and access it.

Note: Its a bad practice to pollute global scope. Refer Why are global variables considered bad practice?

Also if you wish to bind a function on HTML element, try

document.getElementById("elementId").addEventListener("click", cookieconsent.dismiss)

About accessing it on console, try logging it in console and then you can save logged object in a global object using chrome debugger and test it.

score 1 · Answer 3 · answered Jun 01 '16 at 13:52

1

Just remove the var keyword and access the function as cookieconsent.dismiss from the global context. See the @Pointy's comment to your question.

answered Jun 01 '16 at 13:52

Jan Turoň

31,451
23
125
169

score 1 · Answer 4 · answered Jun 01 '16 at 13:52

1

I suppose you could try a few different approaches:

(function () {

    window.cookieconsent = {

        dismiss: function (evt) {
          evt.preventDefault && evt.preventDefault();
          evt.returnValue = false;
          this.setDismissedCookie();
          this.container.removeChild(this.element);
        },

        setDismissedCookie: function () {
          Util.setCookie(DISMISSED_COOKIE, 'yes', this.options.expiryDays, this.options.domain, this.options.path);
        }

    };

})();

cookieconsent.dismiss();

answered Jun 01 '16 at 13:52

IMTheNachoMan

5,343
5
40
89

1

Do refer following post before using global scope: [Why are global variables considered bad practice?](http://stackoverflow.com/questions/10525582/why-are-global-variables-considered-bad-practice) – Rajesh Jun 01 '16 at 14:07
I will point out this is not very "good" code. If you can shed more light on what you're doing/trying-to-do then there might be a "better" solution. – IMTheNachoMan Jun 01 '16 at 14:07

How to access javascript variable's function

4 Answers4