Defining variable outside of the class vs using it as a property inside the class

Question

I'm not sure about the definition of cookieExists outside of the ieAlert class. Is it ok that the variable cookieExists is outside of the class ieAlert? Or should I define it as a property inside the class definition?

var cookieExists = document.cookie.indexOf('ie11_cookie') >= 0;

class ieAlert {

  // Method for checking if IE11
  static isIE() {  
    return window.navigator.userAgent.match(/(MSIE|Trident)/);
  }
  // Method for setting a cookie
  static createCookie(name,value,days) {
    if (days) {
      var date = new Date();
      date.setTime(date.getTime()+(days*24*60*60*1000));
      var expires = "; expires="+date.toGMTString();
    }
    else var expires = "";
    document.cookie = name+"="+value+expires+"; path=/";
  }
}


if (!ieAlert.isIE() && !cookieExists) {
  window.alert("Your browser is outdated!");
  ieAlert.createCookie('myCookie', 'ie11_cookie', 1);
}

module.exports = ieAlert;

Whether it is a variable or a property, that's OK. However in case of a property, it must be static, and it must be defined outside of the `ieAlert` class. — Maxime Launois, Jul 07 '19 at 16:07
Side note: If your class is not intended to ever be instantiated (like with `new`), then I would define it as an object literal instead: `const ieAlert = {` -- and leave out the `static` keywords. — trincot, Jul 07 '19 at 16:14
For future reference, I suggest that you close the loop on your [previous question](https://stackoverflow.com/q/56923441/1541563) before asking a new, heavily related question in a short span of time. Sometimes studying the answers on the previous question will help to answer other related questions you have, and will avoid the appearance that you're [asking Stack Overflow to write your code for you](https://meta.stackoverflow.com/q/274630/1541563). — Patrick Roberts, Jul 07 '19 at 16:16
@trincot that's exactly what I wrote [in my last answer](https://stackoverflow.com/a/56923797/1541563) — Patrick Roberts, Jul 07 '19 at 16:17

Patrick Roberts · Answer 1 · 2019-07-07T16:41:13.637

By following the advice I already gave, you could simply define cookieExists as a property of ieAlert. If you want the property access to re-evaluate the condition each time, then define it as a getter property:

const ieAlert = {
  // Method for checking if IE11
  isIE () {  
    return /MSIE|Trident/.test(window.navigator.userAgent);
  },
  get cookieExists () {
    return document.cookie.includes('ie11_cookie');
  },
  // Method for setting a cookie
  createCookie (name, value, days) {
    const cookie = [`${name}=${value}`, 'path=/'];

    if (days) {
      const date = new Date();
      date.setTime(date.getTime()+(days*24*60*60*1000));
      cookie.splice(1, 0, `expires=${date.toGMTString()}`);
    }

    document.cookie = cookie.join('; ');
  }
};

if (!ieAlert.isIE() && !ieAlert.cookieExists) {
  window.alert("Your browser is outdated!");
  // ieAlert.cookieExists === false
  ieAlert.createCookie('myCookie', 'ie11_cookie', 1);
  // ieAlert.cookieExists === true
}

module.exports = ieAlert;

Thanks. But could you please explain why do I need this line: document.cookie = cookie.join('; '); — user1941537, Jul 07 '19 at 18:45
@user1941537 because in my suggested implementation, `cookie` is an array, not a string. You have to join the array elements together with `; ` as the separator to make it equivalent to your logic. — Patrick Roberts, Jul 07 '19 at 18:46

score 0 · Answer 2 · answered Jul 07 '19 at 16:16

I think this might need some more explanation regarding what you're looking to accomplish. Ran on its own, this code would execute without cookieExists being a class property.

However, since you're exporting it the class, I assume the question is pertaining to how this would operate as a module.

When this module is required and its code is loaded and evaluated, it will evaluate and execute the conditional expression. However, since the sole export is class ieAlert, and the evaluation of the conditional expression is not a part of that class at all, the result of evaluating the additional expression is what is known as a side effect of the module. See this stackoverflow question for more explanation.

This module would potentially affect the scope beyond defining the class ieAlert. In general, this wouldn't be recommended.

Maybe you could define a method of class ieAlert like so:

static findCookie() {
   return document.cookie.indexOf('ie11_cookie') >= 0;
}

That way, you can have more control over when the evaluation occurs.

Defining variable outside of the class vs using it as a property inside the class

2 Answers2