Use variable value as function name

Question

I have the code below to perform operations on the classList of every DOM-Element in the given list.

function editClassListOfElements(elements, className, operation) {
    switch (operation) {
        case "add":
            [].forEach.call(elements, function (element) {element.classList.add(className)});
            break;
        case "remove":
            [].forEach.call(elements, function (element) {element.classList.remove(className)});
            break;
        case "toggle":
            [].forEach.call(elements, function (element) {element.classList.toggle(className)});
            break;
        default:
            break;
    }
}

and I want to change it to something like this:

function editClassListOfElements(elements, className, operation) {
    [].forEach.call(elements, function (element) {element.classList. + operation + (className)});
}

If this is possible, how is it done?

Possible duplicate of Using a variable for a key in a JavaScript object literal — Teemu
– Teemu, Commented Sep 12, 2016 at 7:39

Philipp · Accepted Answer · 2016-09-12 07:35:26Z

3

You can access fields of an object with brackets.

element.classList.add is equivalent to element.classList["add"]. So you can just do element.classList[operation](className) and it will call the function of classList named like the value of variable operation.

answered Sep 12, 2016 at 7:35

Philipp

70.1k10 gold badges121 silver badges159 bronze badges

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

Collectives™ on Stack Overflow

Use variable value as function name

1 Answer 1

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related