2017-02-23 52 views
5

Mam obiekt JavaScript, który wygląda następująco. JavaScript: Zaktualizuj wartość obiektu, pobierając nazwy zmiennych z ciągu znaków

var myObj = [ 
    { 
    "HOLIDAY": { 
     "Sun": "Date", 
     "Mon": "Date", 
     "Tue": "Date", 
     "Wed": "Date", 
     "Thr": "Date", 
     "Fri": "Date", 
     "Sat": "Date" 
    } 
    } 
] 

i mam jakiś kod HTML, który wygląda jak ten

<input data-event="change" 
      data-variable="myObj" 
      data-bind="[0]['HOLIDAY']['Sun']" 
      type="text"> 

HTML Mam przechowywanej o zmiennej JavaScript zmodyfikować jeśli robię żadnych zmian tej dziedzinie. Napisałem kod JavaScript, który wygląda tak.

$(document).on('change', '[data-event= change]', function(){ 
    //get-variable-name where to bind data 
    //Get object location inside the variable 
    var sVarName = $(this).data('variable'); 
    var sObjLoca = $(this).data('bind'); 
    eval(sVarName+sObjLoca +' = ' $(this).val()); 
}); 

Czy istnieje lepsze podejście do tego problemu, obecnie używam eval() których nie chcesz używać, jak wiele elementów będzie miał „change” zdarzenie i show „eval” może mieć wpływ na wydajność mojego kodu.

+1

pierwszy masz 2 atrybuty danych o nazwie takiej samej – madalinivascu

+0

Chang? czy to się zmieni? '[data-bind = onchange]' ... czy powinno to być '[data-bind = onChange]'? tyle zła –

+1

Najpierw '.on ('chang',' powinno być '.on ('zmień','. Po drugie, * czy istnieje lepsze podejście *, jeśli pytanie dotyczy ulepszeń/optymalizacji, opublikuj go na CodeReviews – Rajesh

Odpowiedz

3

// Input 
 
var myObj = [{ 
 
    "HOLIDAY": { 
 
    "Sun": "Date", 
 
    "Mon": "Date", 
 
    "Tue": "Date", 
 
    "Wed": "Date", 
 
    "Thr": "Date", 
 
    "Fri": "Date", 
 
    "Sat": "Date" 
 
    } 
 
}] 
 

 
// Function 
 
function updateObject(object, newValue, path) { 
 
    var stack = path.replace(/\]\[/g, '.').replace(/['"\[\]]/g, '').split('.'); 
 

 
    while (stack.length > 1) { 
 
    object = object[stack.shift()]; 
 
    } 
 
    object[stack.shift()] = newValue; 
 
    return object; 
 
} 
 

 
// Output 
 
console.log(updateObject(myObj, 'test1', "[0]['HOLIDAY']['Sat']")); 
 
console.log(updateObject(myObj, 'test2', "[0]['HOLIDAY']['Tue']")); 
 

 
// Can also set like below 
 
console.log(updateObject(myObj, 'otherway', "0.HOLIDAY.Wed"));