배열을 반복하여 Object 인스턴스를 채울 수 있습니까?

필자는 저널 앱을 만들고 있으며 html 양식에 입력 할 때마다 개체 인스턴스를 만들어야합니다.배열을 반복하여 Object 인스턴스를 채울 수 있습니까?

결과에서 입력을 가져 와서 새 Object 인스턴스의 값으로 변환하는 루프를 만들고 싶습니다. 내 시도는 지금까지는 정의되지 않은 값을 가진 인스턴스를 제공합니다. 이것도 가능합니까? 내가 => 예를 CONSOLE.LOG 때 루프에서

results = [] 

function example(a, b){ 
    this.a = a; 
    this.b = b; 
} 

function getElements(){ 
var a = document.getElementById("a").value; 
var b = document.getElementById("b").value; 
results.push(a,b) 
}

내 시도가 예를

function createNewDay(){ 
    for (i = 0;i<results.length;i++){ 
    var x = new day([i]) 
    } 
}

의 새 인스턴스를 만들려면 {A : 정의되지 않은, B : 정의되지 않은} 그래서

출처

2016-09-29 Alonishka

입니다. 당신은 아마도 그것을 잘못하고있을 것입니다. 그러나 당신의 질문에 코드가 주어 졌다고 말할 수는 없습니다 ... 당신이 그걸로 무엇을 이루려고하는지 명확하지 않습니다. 각 반복마다 'day'의 새 인스턴스를 만들었지 만 아무 것도하지 않았고 그 샘플은 console.log 결과와 아무런 관련이없는 것처럼 보입니다. –

나는 완전히 당신을 따르지 않고 있지만 'results.push (새로운 예제 (a, b))'와'new day (results [i])'를하는 것을 의미합니까? –

기본적으로 나는 "submit"버튼이 html 폼에서 클릭 될 때마다 새로운 저널 항목을 생성하려고합니다. 이 업무 일지 항목은 새 Object 인스턴스입니다. 나는 이것이 프로그래밍에 익숙하지 않기 때문에 아마도 이것이 최선의 방법은 아니지만, 내 추론은 결과에 값을 적용한 다음 결과를 반복하고 각 객체를 새 Object 인스턴스의 개별 속성으로 만드는 것입니다. 그래서 results = [1,2]라면 Object 인스턴스가 다음과 같이 보이길 원합니다. => object {a : 1, b : 2} – Alonishka

<!DOCTYPE html> 
<html> 
<head> 
    <meta charset="utf-8"> 
    <meta name="viewport" content="width=device-width"> 
    <title>JS Bin</title> 
</head> 
<body> 
    <input id="a" type="text"> 
    <input id="b" type="text"> 
    <button type="submit" id="submit">Submit</button> 
    <button type="button" id="view">View results in console</button> 
</body> 
<script type="text/javascript"> 
var results = []; 

function Example(a, b) {a 
    this.a = a; 
    this.b = b; 
} 

function getElements() { 
var a = document.getElementById('a').value; 
var b = document.getElementById('b').value; 
results.push(new Example(a, b)); 
} 

function loopResults() { 
    for (var i = 0; i < results.length; i++) { 
    console.log(results[i]); 
    } 
} 

document.getElementById('submit').addEventListener('click', getElements, false); 
document.getElementById('view').addEventListener('click', loopResults, false); 
</script> 
</html>

데모 : http://jsbin.com/jehupayomu/1/

출처

2016-09-29 19:49:00

고마워요! 이것은 매우 간단합니다, 나는 그것을 생각하지 않은 채 스스로 차고 있습니다. – Alonishka

.. . 당신은 그것을 위해 jQuery를 사용할 수 있습니다

var formDataObject = $("refer_to_form_by_id_or_name").serializeObject();

여기에 언급처럼 : Serialize form data to JSON

출처

2016-09-29 19:37:52

이 질문에는'jQuery' 태그가 포함되지 않으므로 순수한 JavaScript 솔루션이 필요합니다. – vlaz

. 아마도 저자는 여기에 도움이 될만한 라이브러리가 있다는 것을 모르고있을 것입니다. 바닐라 솔루션이 필요하다는 것은 정확하게 밝혀지지 않았습니다. 작성자가 명확하게 밝히면 답변을 삭제할 수 있습니다. –

이에 대한 FormData을 사용할 수 있습니다 - 그것은보다 일반적인 솔루션을 만드는 : 그것은 물론

var form = document.querySelector('form'); 
 

 
form.onsubmit = function() { 
 
    var formdata = new FormData(this); 
 
    var results = {}; 
 
    for ([key, value] of formdata) { 
 
     results[key] = value; 
 
    } 
 
    console.log(results); 
 
    return false; // cancel submission 
 
};

<form method="post" action=""> 
 
    a: <input name="a" value=""><br> 
 
    b: <input name="b" value=""><br> 
 
    <input type="submit"> 
 
</form>

출처

2016-09-29 20:31:49 trincot

배열을 반복하여 Object 인스턴스를 채울 수 있습니까?

답변

관련 문제