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

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

新規登録して質問してみよう
ただいま回答率
85.50%
JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

Q&A

解決済

2回答

5766閲覧

[javascript]配列の中の連想配列に追加

mogiruri

総合スコア37

JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

0グッド

0クリップ

投稿2018/09/28 06:20

とあるゲームを作成中で、配列の中に "point"と"name"というキーを持ったユーザーごとの連想配列を追加して、ランキングとして表示しようとしています。

ローカルストレイジから得点と名前を取得し、それを元に連想配列を作ります。

そしてそれを "users" という配列にゲームごとに追加し、最後にpointを元にソート、表示、という流れを作りたいのですが、2回目行こうの代入により全て同じ名前、得点になってしまいます。

イメージ説明

改善するべきとこはどこでしょうか?

よろしくお願いいたします。

js

1var users = []; 2var pArray = new Array(); 3 4 var rk = document.getElementById("rankPlace"); 5 var strgName = window.localStorage.getItem("player"); 6 var getP = document.getElementById("rankPlace"); 7 getP.innerHTML = ""; 8 9  //連想配列を作り、それを配列に追加 10 pArray["point"] = a_count; 11 pArray["name"] = strgName; 12 users.push(pArray); 13 14 15 //ソート 16 users.sort(function(a,b){ 17 return (a.point < b.point) ? -1 : 1; 18 }); 19 20 21 for (var i = 0; i <= pArray.length - 1; i++) { 22 var newRank = "<p class='ranking'>" + (i + 1) + ". Points : " + users[i].point + " : " + users[i].name + "</p>"; 23 rk.insertAdjacentHTML( 24 "beforeend", 25 newRank 26 ); 27

おそらく問題は代入してる部分?だと思うのですが、私の理解としては

ゲーム1人目
pArray(連想配列) <- 新しいユーザの情報を突っ込む

users <- pArray(ユーザ1の情報)を格納、即ち

users = [
{user[0]の情報}
];

ゲーム2人目
pArray(連想配列) <- 次のユーザの情報を突っ込む(pArrayに上書き)

users <- pArray(ユーザ2の情報)を格納(新しい連想配列を追加)、即ち

users = [
{user[0]の情報},
{user[1]の情報}
];

なんですが、違うのでしょうか?

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

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

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

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

papinianus

2018/09/28 06:41

改善するとしたら毎回pArrayをnewするか、単にusers.push([a_count, strgName]);とするか
guest

回答2

0

ベストアンサー

提示されたコードですが、元のコードから関連箇所を抜粋して掲載されてるような気がします。
どうでしょうか?

その体で考えると、おそらく連想配列を使いまわしているのが原因です。
新しいユーザーの情報を突っ込む際、毎回連想配列を作り直すようにすると上手くいくと思います。

作り直さない場合、配列に追加される連想配列は全ておなじものです。
なので、追加済みの連想配列の情報まで書き換わり、すべて同じになってしまうわけです。

改修案の具体的には次のような感じです。

js

1// ここたぶんグローバル変数かメンバ変数ですよね 2var users = []; 3//var pArray = new Array(); // 廃止 4 5// ここからはたぶん関数ですよね 6function xxx(){ 7 8 // ...割愛 9 10  //連想配列を作り、それを配列に追加 11 var pArray = new Array(); // 連想配列を新しく作成する 12 pArray["point"] = a_count; 13 pArray["name"] = strgName; 14 users.push(pArray); 15 16 // ...割愛 17 18}

投稿2018/09/28 06:39

編集2018/09/28 06:46
退会済みユーザー

退会済みユーザー

総合スコア0

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

mogiruri

2018/09/28 07:12

その通りです抜粋してしまいました、全掲載した方が良かったですよね。コードが長くなりそうだったので切ってしまいました。 なるほど、納得しました。グローバル故に毎回作成されてなかったのですね、、、長くなるとどうも見失いがちなので全体像を見るように心がけます、ありがとうございます。ありがとうございます。
退会済みユーザー

退会済みユーザー

2018/09/28 07:16

どういたしましてです。 コードが長くなる場合は割愛しちゃっていいと思います。が、関数のシグニチャの部分はあったほうがいいですよ~。
guest

0

ゲーム1人目
pArray(連想配列) <- 新しいユーザの情報を突っ込む

users <- pArray(ユーザ1の情報)を格納、即ち

~~users = [

{user[0]の情報}
];~~

users = [pArray];

ゲーム2人目
pArray(連想配列) <- 次のユーザの情報を突っ込む(pArrayに上書き)

users <- pArray(ユーザ2の情報)を格納(新しい連想配列を追加)、即ち

~~users = [

{user[0]の情報},
{user[1]の情報}
];~~

users = [

pArray,
pArray
]

usersの正しい捉え方はこういう感じですかね。
そして、ご自身で認識されておられるとおり、pArrayは上書かれています。
結果として、出力すれば最後のユーザが、ユーザの人数分表示されていることになります

投稿2018/09/28 06:38

papinianus

総合スコア12705

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

mogiruri

2018/09/28 07:13

ひとつ考え方が足りなかったようですね、ご指摘ありがとうございます。
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

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

ただいまの回答率
85.50%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問