Dynamic name for JS variable

Question

Can you please guide me how to replace a long javascript with a loop or something similar? I've to create some variables and after that call a method after each key press.

var list1 = new List('list1', options);
var list2 = new List('list2', options);
var list3 = new List('list3', options);
var list4 = new List('list4', options);
var list5 = new List('list5', options);
var list6 = new List('list6', options);
var list7 = new List('list7', options);
var list8 = new List('list8', options);
var list9 = new List('list9', options);
var list10 = new List('list10', options);
var list11 = new List('list11', options);

$('.search-field').on('keyup', function () {
    window.scrollTo(0, 0);
    list1.search($(this).val());
    list2.search($(this).val());
    list3.search($(this).val());
    list4.search($(this).val());
    list5.search($(this).val());
    list6.search($(this).val());
    list7.search($(this).val());
    list8.search($(this).val());
    list9.search($(this).val());
    list10.search($(this).val());
    list11.search($(this).val());
});

You should be able to find a tutorial on how to work with a for loop pretty easily. And you may also want to check a tutorial on Arrays. — Andreas
– Andreas, Commented Apr 9, 2018 at 12:32
Possible duplicate of How do I create dynamic variable names inside a loop? — t.niese
– t.niese, Commented Apr 9, 2018 at 12:34
Another duplicate JavaScript: Dynamically Creating Variables for Loops — t.niese
– t.niese, Commented Apr 9, 2018 at 12:34
Possible duplicate of JavaScript: Dynamically Creating Variables for Loops — Peter B
– Peter B, Commented Apr 9, 2018 at 12:39

Michał Z. · Accepted Answer · 2018-04-09 12:38:34Z

2

You can group your variables as array or object.

For example (variables in object):

const n = 11;
var lists = {};

for(let i=1;i<=n;++i) {
    lists['list'+i] = new List('list'+i, options);
}

$('.search-field').on('keyup', function () {
    window.scrollTo(0, 0);
    for(let i=1;i<=n;++i) {
        lists['list'+i].search($(this).val());
    }
}

Where object key is "variable name" and value for that key is just value

object[key] = value // write value
object[key]         // read value

edited Apr 9, 2018 at 12:38

answered Apr 9, 2018 at 12:33

Michał Z.

1,3921 gold badge12 silver badges19 bronze badges

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

Comments

Cuong Vu · Accepted Answer · 2018-04-09 12:39:01Z

0

You can replace your code with this. Start with an empty array. Then use a for loop to add elements, then use another for loop to call function

const list = [];
for (let i = 0; i < 11; i++) {
  list[i] = new List('list' + i, options);
}


$('.search-field').on('keyup', function () {
  window.scrollTo(0, 0);
  for (let i = 0; i < 11; i++) {
    list[i].search($(this).val());
  }

});

answered Apr 9, 2018 at 12:39

Cuong Vu

3,72316 silver badges16 bronze badges

1 Comment

Hatem Husam Over a year ago

Thank you, I tried your solution but I don't know why it is not working, when I replace it with the original code I wrote above it is working again!

Collectives™ on Stack Overflow

Dynamic name for JS variable

2 Answers 2

Comments

1 Comment

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Linked

Related