「jQuery」extendメソッドでオブジェクトの同じキー項目を上書きしないサンプル
環境
Google Chrome 105.0.5195.127
Windows 10 Home 64bit
jquery 3.6.0
構文
jQuery.extend( [deep ], target, object1 [, objectN ] )
引数のオブジェクトをマージします。オブジェクトは2つ以上でも可能です。
引数
target プロパティをマージする基底となるオブジェクトを指定します
[object1] マージするためのプロパティを持つオブジェクトを指定します。
[objectN] マージするためのプロパティを持つオブジェクトを指定します。
使用例
<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
<script>
$(function(){
$("#btnshow").click(function(){
const userA = {
userid: 1001,
name: '山田 太郎'
};
const userB = {
userid: 2002,
deprtname: '開発部'
};
$result = $.extend({},userA,userB);
console.log("オブジェクトをマージする結果");
console.log($result);
console.log("userAオブジェクトの情報");
console.log(userA);
console.log("userBオブジェクトの情報");
console.log(userB);
});
});
</script>
</head>
<body>
<input type="button" id="btnshow" value="表示" />
</body>
</html>
空のオブジェクト、1つめのオブジェクト、2つめのオブジェクトをマージして新しい変数に代入しています。引数の2つめ以降のオブジェクトは上書きされません。
実行結果
オブジェクトをマージする結果
{userid: 2002, name: '山田 太郎', deprtname: '開発部'}
userAオブジェクトの情報
{userid: 1001, name: '山田 太郎'}
userBオブジェクトの情報
{userid: 2002, deprtname: '開発部'}