변수 이름을 함수 이름으로 사용

Question

주어진 목록에있는 모든 DOM 요소의 classList에 대한 작업을 수행하려면 아래 코드가 있습니다.

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; 
    } 
} 

나는 이런 식으로 뭔가로 변경하려면이 가능한 경우

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

, 어떻게 이루어집니다?

Answer 1

대괄호로 개체의 필드에 액세스 할 수 있습니다.

element.classList.add은 element.classList["add"]과 같습니다. 따라서 element.classList[operation](className)을 수행하면 operation 변수의 이름과 같은 이름의 classList이라는 함수가 호출됩니다.