JavaScript extend 함수 사용법

Web/Javascript

JavaScript extend 함수 사용법

selfstarter 2020. 8. 11. 10:59

jquery.extend 함수 안에 object는 그냥 합칠 object이다.

그러므로 object를 무한히 여러개 합칠 수 있다.

jQuery.extend(target[, object1][, objectN])

아래 예제에서 newObject는 3개의 object를 합치고 있다.

순서대로 newObject에 key가 저장되며, obj1과 obj2의 a key가 겹치기 때문에

처음들어간 obj1의 값 위로 obj2가 덮어씌워졌다.

그래서 obj2의 값만 저장되었다.

만약 object가 아닌 값을 합칠려고 한다면 글자인 경우 하나하나가 key0부터 저장되는것을 확인할 수 있다.

이건 원하는 결과가 아니므로 꼭 object 형을 넣도록 한다.

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<script src="http://code.jquery.com/jquery-3.1.1.js"></script>
<script>
$(function(){
  console.log('로드완료');
  var obj1 = {a:"hello", b:"world"};
  var obj2 = {a:"hi", c:"there"};
  var newObj = $.extend({d:"42312"}, obj1, obj2);
  console.log(newObj);

  var newObj2 = $.extend(true, obj1, obj2);
  console.log(newObj2);
  
  var newObj3 = $.extend({d:"42312"}, obj2, "gkgkgk", "55", 3);
  console.log(newObj3);
});
</script>
</head>
<body>
<div id="chart"></div>
</body>
</html>