質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

ただいまの
回答率

87.92%

Javascriptのオブジェクトの追加や削除について

解決済

回答 5

投稿 編集

  • 評価
  • クリップ 0
  • VIEW 535

score 16

function sample(){
 var obj = {
  test1 : 255,
  test2 : 'テスト2',
  test3 : ['arr3_1','arr3_2'],
  test4 : {
   test4_1 : 'テスト4_1',
   test4_2 : 'テスト4_2',
  },
 }

 obj['test5'] = 'テスト5'
 obj['test5'['test5_1']] = 'テスト5_1'
}

このときテスト5_1のプロパティがundefinedになる理由はなぜでしょうか?
すでにtest5の値が存在するからかと思いましたが、プロパティをtest6にしても同様にundefinedでした。
ご教示のほど、よろしくお願いいたします。

追記

失礼しました。
オブジェクトのキーにさらにキーを設定し階層的に値を持たせたいです。
test4のような形にしたいのですが、すでにtest5の値が存在するときにどのように対処すればよいのかわかりませんでした。

またobj['test5']['test5_1'] = 'テスト5'
上記だとtest5_1が定義されていないプロパティ?でエラーになることを確認しました。
これはtest5の値がすでに代入されているためかと考えましたが、新しいプロパティobj['test6']['test6_1'] = 'テスト6'としても同様にエラーとなります。

そこで下記のように一度test5でオブジェクト初期化をすることで一応エラー回避することが出来ました。

 obj['test5'] = new Object();
 obj['test5']['test5_1'] = 'テスト5_1';
 obj['test5']['test5_2'] = 'テスト5_2';

しかし、本来やりたかったのは下記のような処理なのです。

 obj['test5'] = 'テスト5'
 obj['test5']['test5_1'] = 'テスト5_1'
 obj['test5']['test5_2'] = 'テスト5_2'
console.log(obj.test5)
//test5=テスト5{test5_1=テスト5_1,test5_2=テスト5_2}

テスト5の値をもたせつつテスト5のプロパティに値を追加するのは難しいのでしょうか?

  • 気になる質問をクリップする

    クリップした質問は、後からいつでもマイページで確認できます。

    またクリップした質問に回答があった際、通知やメールを受け取ることができます。

    クリップを取り消します

  • 良い質問の評価を上げる

    以下のような質問は評価を上げましょう

    • 質問内容が明確
    • 自分も答えを知りたい
    • 質問者以外のユーザにも役立つ

    評価が高い質問は、TOPページの「注目」タブのフィードに表示されやすくなります。

    質問の評価を上げたことを取り消します

  • 評価を下げられる数の上限に達しました

    評価を下げることができません

    • 1日5回まで評価を下げられます
    • 1日に1ユーザに対して2回まで評価を下げられます

    質問の評価を下げる

    teratailでは下記のような質問を「具体的に困っていることがない質問」、「サイトポリシーに違反する質問」と定義し、推奨していません。

    • プログラミングに関係のない質問
    • やってほしいことだけを記載した丸投げの質問
    • 問題・課題が含まれていない質問
    • 意図的に内容が抹消された質問
    • 過去に投稿した質問と同じ内容の質問
    • 広告と受け取られるような投稿

    評価が下がると、TOPページの「アクティブ」「注目」タブのフィードに表示されにくくなります。

    質問の評価を下げたことを取り消します

    この機能は開放されていません

    評価を下げる条件を満たしてません

    評価を下げる理由を選択してください

    詳細な説明はこちら

    上記に当てはまらず、質問内容が明確になっていない質問には「情報の追加・修正依頼」機能からコメントをしてください。

    質問の評価を下げる機能の利用条件

    この機能を利用するためには、以下の事項を行う必要があります。

質問への追記・修正、ベストアンサー選択の依頼

  • m.ts10806

    2019/08/26 12:44

    結局どうしたくてこのコードを組んだのでしょうか

    キャンセル

  • fiile

    2019/08/26 19:32

    失礼しました。
    追記いたしました。
    理想としてはあとからオブジェクトにどんどん追加できるようなコードを書きたかったです。

    キャンセル

回答 5

+4

obj['test5'['test5_1']]は、まず先に内側から解釈されます。

'test5'['test5_1']のように文字列へ角括弧で参照をかけることもできますが、文字列の長さまでの整数を除けば、結果はundefinedです。

つまり、全体としては、obj.undefined = 'テスト5_1'と同じになります。

投稿

  • 回答の評価を上げる

    以下のような回答は評価を上げましょう

    • 正しい回答
    • わかりやすい回答
    • ためになる回答

    評価が高い回答ほどページの上位に表示されます。

  • 回答の評価を下げる

    下記のような回答は推奨されていません。

    • 間違っている回答
    • 質問の回答になっていない投稿
    • スパムや攻撃的な表現を用いた投稿

    評価を下げる際はその理由を明確に伝え、適切な回答に修正してもらいましょう。

  • 2019/08/27 18:45

    ありがとうございます!なぜundefinedなのか理解できてませんでした!
    おかげではかどります!

    キャンセル

checkベストアンサー

+2

やりたかったのはこういうことでしょうか?
質問追記拝読。提示したコードはそのような動作をしますが、やはりおすすめはしません。

 obj['test5'] = new String('テスト5');
 obj['test5']['test5_1'] = 'テスト5_1';

 alert( obj['test5'] );
/*
テスト5
*/

 alert( obj['test5']['test5_1'] );
/*
テスト5_1
*/

'テスト5'を上書きしてしまいますが、↓これなら無難かと思います。
質問追記にあわせて削除しました。

 obj['test5'] = 'テスト5';
 obj['test5'] = { 'test5_1': 'テスト5_1' };

 alert( obj['test5'] );
/*
[object Object]
*/

alert( obj['test5']['test5_1'] );
/*
テスト5_1
*/

投稿

編集

  • 回答の評価を上げる

    以下のような回答は評価を上げましょう

    • 正しい回答
    • わかりやすい回答
    • ためになる回答

    評価が高い回答ほどページの上位に表示されます。

  • 回答の評価を下げる

    下記のような回答は推奨されていません。

    • 間違っている回答
    • 質問の回答になっていない投稿
    • スパムや攻撃的な表現を用いた投稿

    評価を下げる際はその理由を明確に伝え、適切な回答に修正してもらいましょう。

  • 2019/08/27 18:42

    ありがとうございます。
    上記にてご教示いただいたコードで実現できそうです。
    大変助かりました!

    キャンセル

+2

obj['test5'['test5_1']] 

ちょっと意味がわからない
test5をキーにさらにオブジェクトを作りたいのでしょうか?

obj['test5'] = 'テスト5'

ですでに文字列が投入されているので、競合します

投稿

  • 回答の評価を上げる

    以下のような回答は評価を上げましょう

    • 正しい回答
    • わかりやすい回答
    • ためになる回答

    評価が高い回答ほどページの上位に表示されます。

  • 回答の評価を下げる

    下記のような回答は推奨されていません。

    • 間違っている回答
    • 質問の回答になっていない投稿
    • スパムや攻撃的な表現を用いた投稿

    評価を下げる際はその理由を明確に伝え、適切な回答に修正してもらいましょう。

  • 2019/08/27 18:44

    エラーの原因がわからなかったので、とても助かりました!
    ありがとうございます!

    キャンセル

+2

多分やりたいのは以下かなぁ。test4と同じ構造にしたい?

 obj['test5'] = {'test5_1':'テスト5_1'}

元コードを分解してみると・・・

 // 元コード
 obj['test5'['test5_1']] = 'テスト5_1'

 // 分解
 const TMP = 'test5'['test5_1']
 obj[TMP] = 'テスト5_1'

となります。TMPのところは、「'test5'という文字列のオブジェクト(リテラル)のテスト5_1プロパティ」になるんですが、そんなものはないっつーことでundefinedになっちゃいます。
そうするとobj[undefined] = 'テスト5_1'ってなります。Chromeだとこの時のundefinedが文字列に変換されますね。

だから元のあなたの'test5_1'はobj["undefined"]のなかに行っちゃってます。

答えになってるかな・・・

投稿

  • 回答の評価を上げる

    以下のような回答は評価を上げましょう

    • 正しい回答
    • わかりやすい回答
    • ためになる回答

    評価が高い回答ほどページの上位に表示されます。

  • 回答の評価を下げる

    下記のような回答は推奨されていません。

    • 間違っている回答
    • 質問の回答になっていない投稿
    • スパムや攻撃的な表現を用いた投稿

    評価を下げる際はその理由を明確に伝え、適切な回答に修正してもらいましょう。

  • 2019/08/27 14:35

    あ、たぶんファイルとフォルダの関係みたいにしたいんすね。

    ただ、ご提示の例みたいのは結論から言うと難しいかなぁ。(ご提示の例だと"test5"が「ファイル兼フォルダ」みたいになっちゃってる)

    型が文字列の場合をファイル、型がObjectの場合をフォルダと考えれば、考え方を変えられるかも?
    obj['test5'] = 'テスト5' // <- ファイル
    obj['test5'] = {} // <- フォルダ
    obj['test5']['test5_1'] = 'テスト5_1' // フォルダにファイルを入れてる

    この考えで、うまくやりたいことを最適化できませんか?
    絶対に「test5=テスト5{test5_1=テスト5_1,test5_2=テスト5_2}」じゃなきゃダメ、ってことじゃないですよね!

    キャンセル

  • 2019/08/27 18:43

    ありがとうございます!!
    ファイルとフォルダの関係を意識することでオブジェクトの理解が深まりました!

    キャンセル

+1

テスト5の値をもたせつつテスト5のプロパティに値を追加するのは難しいのでしょうか?

obj['test5'] = new MyClass();

新しいクラスを作ってMyClassの中でProxyを使えばできると思いますが、初級者が扱う技術ではありません。

投稿

  • 回答の評価を上げる

    以下のような回答は評価を上げましょう

    • 正しい回答
    • わかりやすい回答
    • ためになる回答

    評価が高い回答ほどページの上位に表示されます。

  • 回答の評価を下げる

    下記のような回答は推奨されていません。

    • 間違っている回答
    • 質問の回答になっていない投稿
    • スパムや攻撃的な表現を用いた投稿

    評価を下げる際はその理由を明確に伝え、適切な回答に修正してもらいましょう。

  • 2019/08/27 18:42

    ありがとうございます!
    ただ僕の使ってる環境にクラス構文が備わってないので難しいです…(´;ω;`)

    キャンセル

15分調べてもわからないことは、teratailで質問しよう!

  • ただいまの回答率 87.92%
  • 質問をまとめることで、思考を整理して素早く解決
  • テンプレート機能で、簡単に質問をまとめられる

関連した質問

同じタグがついた質問を見る