Update var using .change?

Question

I have an important question that I'm starting to face on 80% of the cases.

Lets say I have this:

var bcount = properties.count;
favicon.badge(bcount);
bcount.change(function() { favicon.badge(bcount); });

properties.count = its a number that changes depending on the user actions. favicon.badge its a javascript that shows the action, which is working good.

I tried to use .change on the bcount var, but is giving me error as I supposed because is not an element. Is there any way to listen a var when value changes?

The problem I'm facing is that when the count gets updated, with a new number. It only updates after refreshing the page.

Thanks!!

Edit: I'm trying to setup getter and stter:

var bcount = {
  a: properties.count,
  get b() { 
    return this.a;
  },
  set c(cname) {
    this.a;
  }
};

Is that okay? And now how i can init the call?

jquery functions are executed on DOM elements, not on javascript variables. If you want to change a variables value, use the assign operator `=`. If you want a listener to a variable change event (which doesn't exists out of the box), there's already resources on SO about it. — Adrian, Jun 29 '18 at 15:05
Thanks for you answer, can you give me an example on how use "assign operator" or link? Or something? Thanks!! — K3ny1, Jun 29 '18 at 15:06
https://stackoverflow.com/questions/11729598/how-can-i-attach-a-change-event-handler-to-a-variable — Adrian, Jun 29 '18 at 15:08
Try a getter and setter on bcount. https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Working_with_Objects#Defining_getters_and_setters — L0uis, Jun 29 '18 at 15:10

Ali Shahrivarian · Accepted Answer · 2018-06-29T16:03:37.713

I think you need get and set functionality. You can put logic in those functions and they will do what you want in variable get and set.

See this: es5-getters-setter

Sample from above link:

var person = {
    firstName: 'Jimmy',
    lastName: 'Smith',
    get fullName() {
        return this.firstName + ' ' + this.lastName;
    },
    set fullName (name) {
        var words = name.toString().split(' ');
        this.firstName = words[0] || '';
        this.lastName = words[1] || '';
    }
}

person.fullName = 'Jack Franklin';
console.log(person.firstName); // Jack
console.log(person.lastName) // Franklin

Edit:

Every field has its get and set. If you want to make other confused when they read your code do that. but the right thing is this:

var properties = {
  _count:0, // you hold count value here
  get count() { // every time you get "properties.count" this function will run
    // place for your code that must run on get, like "var bcount = properties.count"
    return this._count;
  },
  set count(new_count) { // every time you want to do "properties.count = some_int" this function will run
    // place for your code that must run on set, like "properties.count = some_int"
    this._count = new_count;
  }
};
// usage
properties.count = 10; // "properties._count" is "10" now
var bcount = properties.count; // you just got "properties._count" value

Thanks but properties.count belongs to a field so is that okay to use the same identifier? — K3ny1, Jun 29 '18 at 15:52
`get` and `set` functions won't add 2 field to your properties. they just one. you just need another field (mainly private) to store those functions needed data on that field. so as I wrote you can access `properties.count` as a field not function. — Ali Shahrivarian, Jun 29 '18 at 15:57

Update var using .change?

1 Answers1