*

javascript(jQuery):複数の連想配列を結合する方法

公開日: : 未分類


複数の連想配列をマージすることができるjQueryのメソッド、extendについてです。

 

extend()の使い方

$.extend(target [, obj1] [, obj2])

target : マージ対象の連想配列

obj1等 : マージする連想配列

※ マージする連想配列はいくつでも指定が可能です。

 

使用例

連想配列aに連想配列bをマージ

var a = {
 id : 1,
 name : '田中'
};

var b = {
 name : '佐藤',
 job : 'エンジニア'
};

$.extend(a, b);
console.log(a);
//結果
//{
// id : 1,
// name : '佐藤',
// job : 'エンジニア'
//};

同一キーがある場合は値を上書き、異なるキーは追加されます。

 

連想配列aに連想配列bとcをマージ

var a = {
 id : 1,
 name : '田中'
};

var b = {
 name : '佐藤',
 job : 'エンジニア'
};

var c = {
 name : '鈴木',
 address : '東京'
};

$.extend(a, b, c);
console.log(a);
//結果
//{
// id : 1,
// name : '鈴木',
// job : 'エンジニア'
// address : '東京'
//};

 

連想配列aの値を書き換えたくない場合

var a = {
 id : 1,
 name : '田中'
};

var b = {
 name : '佐藤',
 job : 'エンジニア'
};

var result = $.extend({}, a, b);
console.log(result);
//結果
//{
// id : 1,
// name : '佐藤',
// job : 'エンジニア'
//};

第一引数を空の連想配列とし、結果を変数に格納すればaを書き換えずにマージ結果が得られます。

 

連想配列内に連想配列を含む場合

var a = {
 position : {
  top : 30,
  left : 300,
  width : 200;
 },
 color : black
};

var b = {
 position : {
  height : 400
 }
};

$.extend(a, b);
console.log(a);
//結果
//{
// position : {
//  height : 400
// },
// color : black;
//};

aにbをマージしてみましたが、aのpositionの値はbのpositionの値で書き換えられてしまいます。子階層の連想配列の値もうまくマージしたい場合は下記のように記述する必要があります。

var a = {
 position : {
  top : 30,
  left : 300,
  width : 200
 },
 color : black
};

var b = {
 position : {
  height : 400
 }
};

$.extend(true, a, b);
console.log(a);
//結果
//{
// position : {
//  top : 30,
//  left : 300,
//  width : 200,
//  height : 400
// },
// color : black;
//};

第一引数にtrueを指定することで、子階層の連想配列までマージが行われます。

 

ad_right_top

関連記事

no image

2015:新年のご挨拶

明けましておめでとうございます。 昨年はたくさんの方々に当ブログをご利用頂きましてまことにあり

記事を読む

blog_logo_small

wkhtmltopdf:URLからキャプチャを作成する。

wkhtmltopdf URLからサイトのキャプチャを作成するツールの紹介です。 サイトのリ

記事を読む

blog_logo_small

MySQL:外部ホストからのDBアクセス方法

MySQLではデフォルトで外部ホストからのアクセスを許可していないので、外部ホストからアクセスする為

記事を読む

google以外広告

Message

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

次のHTML タグと属性が使えます: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>

ad_right_top

linux-pen
【cron】秒間隔で定期実行する為の設定方法

コマンドを定期実行させたい場合に利用するcronですが、普通に利用する

blog_logo_small
【Apache】 ReverseProxy(リバースプロキシ)を設定してサブディレクトで別サーバーの内容を表示

今回はApacheのリバースプロキシ設定について紹介したいと思います。

blog_logo_small
【Apache】 Aliasを設定してサブディレクトでDocumentRoot以外を参照する

今回はApacheのAlias設定について紹介したいと思います。この方

no image
2015:新年のご挨拶

明けましておめでとうございます。 昨年はたくさんの方々に当ブログ

blog_logo_small
MySQL:外部ホストからのDBアクセス方法

MySQLではデフォルトで外部ホストからのアクセスを許可していないので

→もっと見る

  • アクセスカウンター
PAGE TOP ↑