declare static variable in javascript

Question

 var i=0;
 function mul()
 {
    var qty = document.getElementsByClassName("qty");
    var rs = document.getElementsByClassName("rs");
    var amt = document.getElementsByClassName("amt");
    var mul=(qty[i].value)*(rs[i].value);
    amt[i].setAttribute("value",mul);
   sp.appendChild(iteminp);
   sp.appendChild(qtyinp);
   sp.appendChild(rsinp);
   sp.appendChild(amtinp);
   i++;
}

In the above program i want the value of 'i' should be increased for each time we call the function and it should be same all over the program like static variable. how to do it?

Exactly that way. It's global, so every function will see the same i. — Federico klez Culloca
– Federico klez Culloca, Commented Dec 13, 2017 at 11:35
just drop the var before i . Then i would be a global variable — vibhor1997a
– vibhor1997a, Commented Dec 13, 2017 at 11:37
There's nowhere there for i to be considered static. Do you simply want a global variable? If yes then declare it as window._i = 1;, but this seems like a bad way to achieve something. (It's common practice to prefix global vars with an underscore, and certainly don't just call it i) — Reinstate Monica Cellio
– Reinstate Monica Cellio, Commented Dec 13, 2017 at 11:50

Jonathan · Accepted Answer · 2017-12-13 11:44:40Z

2

JS variables are local to a function or they are global. Since you declared i outside a function, it's global.

To prove this, save this as test.html, open it in your browser and press the button a few times. I simplified your function a bit!

<script>
var i=0
function mul(){
  alert("i: " + i++)
}
</script>
<button onclick='mul()'>Press me</button>

answered Dec 13, 2017 at 11:44

Jonathan

3491 silver badge9 bronze badges

Sign up to request clarification or add additional context in comments.

7 Comments

prabhu r Over a year ago

no , you see the above code in that i did like that but, for the second time if i call the function it is showing a error that " Uncaught TypeError: Cannot read property 'value' of undefined "

Jonathan Over a year ago

I think that error message is coming from this line: (qty[i].value)*(rs[i].value) - if qty[i] or rs[i] don't evaluate to something (because qty or rs has nothing at element i) then you will get that error. So I think that the problem is not related to i being global.

prabhu r Over a year ago

yeah, you are right the error is in that line, but what is the problem ?

prabhu r Over a year ago

when i run it for first time it is successfully executed but for the second time it is showing like that,but for the second time i am supplying a value,but i don't know why it is showing like that an how to solve it. can you please help to solve this?

prabhu r Over a year ago

can you give your num to contact?

|

F.Almeida · Accepted Answer · 2017-12-13 11:38:41Z

2

You can have a javascript file named globals.js(don't forget to include it in your index.html) then declare your global variable, which will be available in all your web solution.

globals.js:

var _i = 0; // Would not recomend using "i" as the variable name since it 
            // can polute the global scope

yourFile.js:

 function mul()
 {
   var qty = document.getElementsByClassName("qty");
   var rs = document.getElementsByClassName("rs");
   var amt = document.getElementsByClassName("amt");
   var mul=(qty[_i].value)*(rs[_i].value);
   amt[_i].setAttribute("value",mul);
   sp.appendChild(iteminp);
   sp.appendChild(qtyinp);
   sp.appendChild(rsinp);
   sp.appendChild(amtinp);
   _i++;
}

answered Dec 13, 2017 at 11:38

F.Almeida

4132 silver badges13 bronze badges

1 Comment

prabhu r Over a year ago

its like the same,its not working.can you please tell me any other way to solve this?

synthet1c · Accepted Answer · 2017-12-14 09:40:44Z

2

You could create a decorator function that can wrap your function with a counter that will give you access to the count through a read only property.

This solution will require modern browsers due to having used Symbol, but you could substitute this with a dunder property eg. __count__ in it's place.

// this is used to create a privaty property on your function
const COUNT = typeof Symbol !== 'undefined' ? Symbol('count') : '__count__'

// this function takes your function and wraps it with a counter
function counter(fn) {
  // this is called whenever you call the decorated function
  function _counter(...args) {
    // increment the counter
    _counter[COUNT]++
    // call the original function
    return fn(...args)
  }
  // create the private property on your function and the accessor
  Object.defineProperties(_counter, {
    [COUNT]: { value: 0, writable: true },
    name: { value: fn.name || 'counter' },
    count: { get: () => _counter[COUNT] }
  })
  // return the decorator function
  return _counter
}

// function to decorate
function _mul(x, y) {
  // do something to multiply
  return x * y
}

// decorate your functions with the counter
const mul = counter(_mul)
const mul2 = counter(_mul)

// proof that both counters are independent and work correctly
console.log(
  mul(1, 2), // 2
  mul(3, 4), // 12
  `mul has been called ${mul.count} times`
)
console.log(
  mul2(5, 6), // 30
  mul2(7, 8), // 56
  mul2(9, 10),// 90
  `mul2 has been called ${mul2.count} times`
)

<script src="https://codepen.io/synthet1c/pen/KyQQmL.js"></script>

edited Dec 14, 2017 at 9:40

answered Dec 13, 2017 at 12:01

synthet1c

6,3024 gold badges28 silver badges41 bronze badges

3 Comments

prabhu r Over a year ago

i can't understand this , can you please suggest me a edit in my above program

prabhu r Over a year ago

can you give you mobile number to contact?

synthet1c Over a year ago

Hi, sorry I did not reply. The function I provided wraps your function. it will attach a counter property to it that you can access using mul.count when you need to know how many times it had been called. This is the best solution because you are not polluting the global namespace with a variable. especially the use of i will bite you later as that is used in for loops by convention.

Collectives™ on Stack Overflow

declare static variable in javascript

3 Answers 3

7 Comments

1 Comment

3 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

7 Comments

1 Comment

3 Comments

Your Answer

Sign up or log in

Post as a guest

Related