[javascript] array push 시 마지막 push 값으로 중복 입력되는 문제

2022. 7. 18. 15:56JAVASCRIPT

java 쪽에서 받은 데이터를 script 에서 배열 형태로 만들어서 사용하려는중 모든데이터가 마지막에 push된 값으로 들어가는 문제가 있었다.

 

<script>

	let arr_data = new Array();
	let item_data = new Object();
    
    <c:forEach var="resultList" items="${resultList}">
    
		item_data.lat = ${resultList.latitude};
		item_data.lng = ${resultList.longitude};
		item_data.address = '${resultList.address}';
		item_data.tel = '${resultList.tel}';
		item_data.fax = '${resultList.fax}';
		item_data.googleUrl = '${resultList.google_find}';
		item_data.naverUrl = '${resultList.naver_find}';
						
		arr_data.push(item_data);    
    </c:forEach>
    
</script>

위와 같이 하고 console을 찍어보면 계속 마지막에 입력된 앖으로 앞의 값들이 변경이 되었다.

 

여러 가지 방식으로 계속 테스트를 진행 하다가 아래와 같은방법으로 해결하였다.

<script>					
	let arr_data = new Array();
	let item_data = new Object();
										
	<c:forEach var="resultList" items="${resultList}">
						
		arr_data.push({ 
			lat : ${resultList.latitude},
			lng : ${resultList.longitude},
			address : '${resultList.address}',
			tel : '${resultList.tel}',
			fax : '${resultList.fax}',
			googleUrl : '${resultList.google_find}',
			naverUrl : '${resultList.naver_find}'
		});
						
	</c:forEach>
</script>

 

<07.18 추가>

위와 같은 방식으로 하고 객체만 초기화 해주어도 되도 되는 간단한 문제였다...

<script>
	var arr_data = [];
	var item_data = {};
						
	<c:forEach var="resultList" items="${resultList}">
							
		item_data = {};
	
		item_data.lat = ${resultList.latitude};
		item_data.lng = ${resultList.longitude};
		item_data.address = '${resultList.address}';
		item_data.tel = '${resultList.tel}';
		item_data.fax = '${resultList.fax}';
		item_data.googleUrl = '${resultList.google_find}';
		item_data.naverUrl = '${resultList.naver_find}';
		arr_data.push(item_data);
		
	</c:forEach>
</script>