> For the complete documentation index, see [llms.txt](https://triplexlab.gitbook.io/vanilla-js/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://triplexlab.gitbook.io/vanilla-js/practice/practice-array-3.md).

# 배열 만들기3

## 사용자 Data를 JSON형식으로 DB에 전달하기

### 그냥 JSON으로 만들어서 전달하기&#x20;

```javascript
```

### reduce사용해서 전달하기

사용자가 입력한 값들을 받아서 JSON형식으로 (객체 형식)으로 만들어 DB에 전달하는 방법입니다.

```markup
<form action="/">
    <label for="fname">First name:</label>
    <input type="text" id="fname" name="fname" value=""><br><br>
    <label for="lname">Last name:</label>
    <input type="text" id="lname" name="lname" value=""><br><br>
    <input type="image" src="img_submit.gif" alt="Submit" class="submit" width="48" height="48">
</form>

```

```javascript
<script>
$(function(){
    var valdateForm = function(e) {
        e.preventDefault();
        var fname = $('#fname').val();
        var lname = $('#lname').val();
        var alphabets = new Array(fname, lname);

        var counts = alphabets.reduce(function(acc, cur, idx){
            acc['value-'+idx] = cur;  // 내가 원하는 키의 명을 만들어서, 현재 값을 val 자리에 넣는것이다.
            return acc;
        }, {});  //{} 비어있는 객체의 초기값이다.
        console.log(counts)
    };
    
    $('.submit').on('click', valdateForm); 
});
</script>
```
