CODEWITHSUNDEEP
javascriptclass
user1941537
user1941537

Reputation: 6675

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

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;

Upvotes: 0

Views: 106

Answers (2)

Patrick Roberts
Patrick Roberts

Reputation: 51816

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;

Upvotes: 2

user11041631
user11041631

Reputation: 1

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.

Upvotes: 0

Related Questions