We Keep Coding

Dynamacially change variable in function using number paramater [duplicate]

This question already has answers here:
"Variable" variables in JavaScript
(9 answers)
Closed 2 years ago.
Sorry for the strange title, it woudn't let me post the question otherwise. Essentially, I would like to update the count of a variable that is chosen depending on the function input. Here is a simplified version. In my code I have around 30 count variables. The countOne function input would be either 1,2 or 3 and would thus update the relevant count1,count2, or count3 depending on the input.
let count1 = 0;
let count2 = 0;
let count3= 0;
function countNumber(countOne, sum) {
count[countOne] = count[countOne] + sum;
}

The trick is to access property by name. But you need to put your count inside an object.
let data = {
count1: 0,
count2: 0,
count3: 0
};
function countNumber(countOne, sum) {
data["count" + countOne] += sum;
alert(`count1 = ${data.count1} --- count2 = ${data.count2} --- count3 = ${data.count3}`);
}
countNumber(1, 20);
countNumber(1, 5);
countNumber(2, 10);

Use each value of a for loop before the loop finishes [duplicate]

This question already has answers here:
How do JavaScript closures work?
(86 answers)
Closed 5 years ago.
I have a function that gets values using for loops and puts them into 1 variable. This variable is them stuck in a form where its is then submitted. But the problem is that the for loop would finish looping by the time the value is entered and submitted. So everytime I test it, the variable "value" = 9999. Can anyone please tell me how to add 1 to variable every time the function loops? Thanks in advance.
function myFunction() {
var value1;
var value2;
var value3;
var value4;
var value;
for (value1 = 0; value1 < 10; value1++) {
for (value2 = 0; value2 < 10; value2++) {
for (value3 = 0; value3 < 10; value3++) {
for (value4 = 0; value4 < 10; value4++) {
value = value1.toString() + value2.toString() + value3.toString() + value4.toString() + '#2018';
document.getElementById('pswd').value = value;
document.getElementById('uid').value = 'test';
document.getElementById('commentForm').submit();
}
}
}
}
}
var loop = setInterval(function() {
myFunction();
}, 2000);

If I'm reading your question correctly, you would like the number to go up by one each time the interval callback is called? You can accomplish this by keeping track of the value outside the function, and do a single increment each time the callback is called. However, you are using 4 variables to basically count from 0 to 9999. You can simplify that a lot by using one variable to increment. Then you can left pad it with zeroes. That would look like this.
var value = 0;
function myFunction() {
var pswd = value.toString().padStart(4, 0) + '#2018';
document.getElementById('pswd').value = pswd;
document.getElementById('uid').value = 'test';
document.getElementById('commentForm').submit();
value++;
if(value > 9999) {
value = 0;
}
}
var loop = setInterval(myFunction, 2000);
If you can't use padStart, you can use slice instead. You can replace that line with the following.
var pswd = ('0000' + value).slice(-4) + '#2018';

Function calls with loops [duplicate]

This question already has answers here:
JavaScript closure inside loops – simple practical example
(44 answers)
Closed 5 years ago.
Why when I click on my buttons there are always 100 in console log? And how I can fix this?
function SampleFunction(param){
console.log(param);
}
for (i = 0; i < 100; i++) {
$("#btn-" + i).on('click',function(e){
SampleFunction(i);
});
}

use let keyword
for (let i = 1; i < 9; i++) {
$("#btn-" + i).on('click',function(e){
SampleFunction(i);
});
}

Pure js approach
let allButtons = document.getElementsByTagName('button');
for(i=0;i<allButtons.length;i++) {
allButtons[i].onclick = getPosition;
}
function getPosition() {
let position = Array.from(allButtons).indexOf(this) + 1;
console.log(`you clicked button at position ${position}`)
}
<button id="button-1">1</button>
<button id="button-2">2</button>
<button id="button-3">3</button>
<button id="button-4">4</button>

Creating global variable within eventListener whitin the same "for" [duplicate]

This question already has answers here:
JavaScript closure inside loops – simple practical example
(44 answers)
Closed 6 years ago.
var buttons = document.querySelectorAll('button');
var span = document.querySelectorAll('.counter');
for (var i = 0; i < buttons.length; i++) {
buttons[i].addEventListener('click', function (event) {
span[i].innerText = parseInt(span[i].innerText) +1;
});
}
the inner span doesnt "see" the same [i] i use for buttons. the console returns "not defined" any suggestions on how to fix that problem?

This is because your event handler (click on your button), will run later, and that time, i is something else. You should use a closure to keep it internal:
var buttons = document.querySelectorAll('button');
var span = document.querySelectorAll('.counter');
for (var i = 0; i < buttons.length; i++) {
buttons[i].addEventListener('click', (function (i) {
return function (event) {
span[i].innerText = parseInt(span[i].innerText || 0) + 1;
};
}(i)));
}
<button>A</button>
<span class="counter"></span>
<button>B</button>
<span class="counter"></span>
<button>C</button>
<span class="counter"></span>

Javascript: using global variable in the function definition [duplicate]

This question already has answers here:
JavaScript closure inside loops – simple practical example
(44 answers)
Closed 9 years ago.
I am trying to execute the following code:
for (var i = 0; i <= 9; ++i) {
State.prototype["button" + i.toString()] = function () {
console.log("I am a digit button" + i.toString());
this.setValue(i.toString());
};
}
But it is wrong, because the i variable is common for all the function created.
For example I want the function State.prototype.button0() to work as:
console.log("I am a digit button" + "0");
this.setValue("0");
How to do it?

Pass it to a function, so that the value of i doesn't change:
for (var i = 0; i <= 9; ++i) {
(function(i){
State.prototype["button" + i.toString()] = function () {
console.log("I am a digit button" + i.toString());
this.setValue(i.toString());
};
})(i);
}