배열의 키 값을 다른 배열의 값을 기준으로 배열로 설정합니다.

Question

나는 달성하고자하는 작업 개념의 codepen (http://codepen.io/anon/pen/PGkQmq)을 첨부했습니다. 이 작업 코드는 defaultNameArray의 각 위치를 기반으로 JSON 객체에서 이름 키의 null 값에 이름을 지정합니다.

내 문제는 코드에서 defaultNameArray와 동일한 길이의 코드에서 defaultObj 배열을 생성하려고 시도하는 코드입니다.

var defaultNameArray = ["Bob", "Alice", "Joe"]; 

var defaultObj = [ 
    { 
    "name": null, 
    "age": "32", 
    "height": "175", 
    "etc": "someData", 
    }, 
]; 

for (var i = 0; i < defaultNameArray.length -1; i++) { 
    defaultObj.push(defaultObj[0]); 
} 

for (var i = 0; i < defaultObj.length; i++) { 
    defaultObj[i].name = defaultNameArray[i]; 
    console.log("defaultObj[i].name: " + defaultObj[i].name); 
    console.log("defaultNameArray[i]" + defaultNameArray[i]); 
}; 

var str = JSON.stringify(defaultObj); 
console.log('defaultObj: ' + str); 

이 코드는 그때 다른 배열 (이름)의 위치에 대하여, 키에 값을 할당 통해 반복 할 수 있어야하는 일반적인 배열을 생성한다. 최종 결과는 names 배열의 마지막 위치 인 "Joe"인 모든 이름입니다. 생성 된 JSON 배열을 반복하는 것이 왜 첨부 된 codepen과 같은 코드에서 정의 된 것을 사용하는 것과 다르게 동작하며, 무엇이 누락 되었습니까?

Answer 1

사건에 대한 충분한 -이를 위해 당신은 얕은 복사를 수행 Object.assign을 사용할 수 있습니다 defaultObj.push(defaultObj[0]);
이것은 배열에 대한 참조와 함께 동일한 객체를 푸시합니다. 따라서 하나의 속성을 변경하면 모두 변경됩니다. 그래서 결국에는 마지막 요소의 값만 가져옵니다.

는 defaultObj.push(Object.assign({}, defaultObj[0]));

Object assign documentation

Answer 2

동일한 객체 defaultObj[0]을 배열에 반복해서 밀어 넣습니다. 그 객체를 돌연변이 시키면 어떤 배열 색인을 보든 그 변화가 보입니다. 그것은 같은 단일 개체입니다. defaultObj[0].name을 변경하면 defaultObj[1].name이 변경됩니다.

따라서 사본 (복제) 개체가 필요합니다.

변경 :

defaultObj.push(defaultObj[0]); 

에 :

defaultObj.push(Object.assign({}, defaultObj[0])); 

var defaultNameArray = ["Bob", "Alice", "Joe"]; 
 

 
var defaultObj = [ 
 
    { 
 
    "name": null, 
 
    "age": "32", 
 
    "height": "175", 
 
    "etc": "someData", 
 
    }, 
 
]; 
 

 
for (var i = 0; i < defaultNameArray.length -1; i++) { 
 
    defaultObj.push(Object.assign({}, defaultObj[0])); 
 
} 
 

 
for (var i = 0; i < defaultObj.length; i++) { 
 
    defaultObj[i].name = defaultNameArray[i]; 
 
    console.log("defaultObj[i].name: " + defaultObj[i].name); 
 
    console.log("defaultNameArray[i]" + defaultNameArray[i]); 
 
}; 
 

 
var str = JSON.stringify(defaultObj); 
 
console.log('defaultObj: ' + str);