Javascript «неопределенными» при использовании переменной функции на множестве объектов

Question

У меня есть следующий (пример) массив объектов:

var theArray = [ 
    {theId:'1', num: 34}, 
    {theId:'2', num: 23}, 
    {theId:'5', num: 26} 
]; 

и эта функция, которая прекрасно работает в цикле через них:

function printValues() { 
    var i = 0; 
    for(i; i<theArray.length; i++) { 
     var obj = theArray[i]; 
     document.getElementById('result1').innerHTML += obj.theId + ' = ' + obj.num + '<br>'; 
    } 
} 

Однако, если я хочу абстрагироваться эту функцию для использования в подобных массивов с помощью функции переменных для доступа к объектам в них, как это:

function printValuesVar(arr,elemId,arrId,arrNum) { 
    var i = 0; 
    for(i; i<arr.length; i++) { 
     var obj = arr[i]; 
     document.getElementById(elemId).innerHTML += obj.arrId + ' = ' + obj.arrNum + '<br>'; 
    } 
} 

«не определена» результат при вызове, как показано ниже (как я вроде ожидать, так как «Arrid» не имя объекта):

printValuesVar(theArray,'result2','theId','num'); 

Как можно использовать значение, передаваемое переменную функцию к получить доступ к значениям объектов в массиве по имени?

---

переписаны следующие советы против antipatterns:

function printValuesVar(arr,elemId,arrId,arrNum) { 
    var i = 0; 
    var content = ''; 
    for(i; i<arr.length; i+=1) { 
     var obj = arr[i]; 
     content += obj[arrId] + ' = ' + obj[arrNum] + '<br>'; 
    } 
    document.getElementById(elemId).innerHTML = content; 
} 

Answer 1

Поскольку вы loking для ключа "Arrid", а не ключ хранится в переменной Arrid

document.getElementById(elemId).innerHTML += obj[arrId] + ' = ' + obj[arrNum] + '<br>'; 

Answer 2

Попробуйте это:

function printValuesVar(arr, elemId, arrId, arrNum) { 
    var content = ''; 

    arr.forEach(function (arrElem) { 
     content += arrElem[ arrId ] + ' = ' + arrElem[ arrNum ] + '<br>'; 
    }); 

    document.getElementById(elemId).innerHTML = content; 
} 

Или немного больше преимуществ CED:

function printValuesVar(arr, elemId, arrId, arrNum) { 
    document.getElementById(elemId).innerHTML = arr.map(function (arrElem) { 
     return arrElem[ arrId ] + ' = ' + arrElem[ arrNum ]; 
    }).join('<br>'); 
} 

ES5-shim for shitty browsers