從字符串創建一個JavaScript對象

我正在嘗試創建一個JavaScript函數，該函數使用字符串爲結構創建一個對象，並從DOM數據中填充它。從字符串創建一個JavaScript對象

例如，以下字符串可能看起來像這樣：

some.example.here = "hello" 
some.example.there = "hi" 
other.example = "heyo"

這應該創建該對象：

{ 
    some: { 
     example: { 
      here: "hello", 
      there: "hi" 
     }, 
    other: { 
     example: "heyo 
    } 
}

的數據，作爲所述來自DOM，並在代碼段爲負載標記爲「將數據讀入對象」。數據加載正常，並且對象結構也正在設置好，但數據未放入數據字段。

下面是該函數的代碼：

function getDataFromElement(element) { 
    obj = {}; 
    $(element) 
    .find("[data-value]") 
    .each(function() { 
     // create object node 
     valueObj = {}; 
     currentValueObj = valueObj; 
     $.each($(this).attr("data-value").split("."), function(i, objpath) { 
     currentValueObj[objpath] = {}; 
     currentValueObj = currentValueObj[objpath]; 
     }); 

     // read data into object 
     if($(this).is("[data-putvalue]") && $(this).attr("data-putvalue") != "html") { 
     currentValueObj = $(this).attr($(this).attr("data-putvalue")); 
     } else { 
     currentValueObj = $(this).html(); 
     } 

     console.log(currentValueObj); 

     // combine with previous gathered data 
     obj = $.extend(true, {}, obj, valueObj); 
    }); 

    return obj; 
}

有誰知道該怎麼辦？

來源

2015-08-15 Lukas Bach

可以包括在'問題html'？，創建stacksnippets，jsfiddle http://jsfiddle.net來演示？ – guest271314

'currentValueObj = currentValueObj [objpath]'的用途是什麼;'？ – guest271314

隨着第二個循環，我試圖創建對象結構，所以循環遍歷字符串的每個元素，用currentValueObj [objpath] = {};創建一個帶有當前字符串元素名稱的新子元素;並通過'currentValueObj = currentValueObj [objpath];'進入該子元素，以便在下一個循環遍歷中創建下一個子元素。 –

這大概能滿足你（改編自我的另一個項目，適應並根據需要使用）：注元素的name取爲key和value爲value

function fields2model($elements, dataModel) 
{ 
    $elements.each(function(){ 
     var $el = $(this), 
      name = $el.attr('name'), 
      key, k, i, o, val 
     ; 

     key = name; 

     val = $el.val() || ''; 

     k = key.split('.'); o = dataModel; 
     while (k.length) 
     { 
      i = k.shift(); 
      if (k.length) 
      { 
       if (!o.hasOwnProperty(i)) o[ i ] = /^\d+$/.test(k[0]) ? [ ] : { }; 
       o = o[ i ]; 
      } 
      else 
      { 
       o[ i ] = val; 
      } 
     } 
    }); 
}

實施例使用：

<input name="some.example.here" value="hello" /> 
<input name="some.example.there" value="hi" /> 


var model = {}; 
fields2model($('input,textarea,select'), model);

的例子元件上方將給出下面model：

model = { 
some: { 
    example: { 
     here: "hello", 
     there: "hi" 
    } 
};

來源

2015-08-15 21:47:31

我在這裏嘗試了您的函數：https://plnkr.co/edit/NhsnQJs1iYWKUCff2aVU?p=preview但它不起作用 - 可能是我的錯誤。你能幫忙嗎？ – Gerfried

我懂了：https：//plnkr.co/edit/EyGmop9CmYO3WAf9odvU Javascript很奇怪 - 不是嗎？ ;-) – Gerfried

我會做這樣的：

var createObject = function(model, name, value) { 
    var nameParts = name.split("."), 
    currentObject = model; 
    for (var i in nameParts) { 
    var part = nameParts[i]; 
    if (i == nameParts.length-1) { 
     currentObject[part] = value; 
     break; 
    } 
    if (typeof currentObject[part] == "undefined") { 
     currentObject[part] = {}; 
    } 
    currentObject = currentObject[part]; 
    } 
};

，然後用它這樣的：

var model = {}; 
createObject(model, "some.example.here", "hello"); 
createObject(model, "some.example.there", "hi"); 
createObject(model, "other.example", "heyo");

來源

2015-08-15 21:47:20

這會爲每個鍵值創建不同的模型/對象 –

從字符串創建一個JavaScript對象

回答

相關問題