お世話になっております。今回は題名の通り、ローカル変数にグローバル変数の配列を代入したいと考えています。
Javascript
var i=0;
var number2018 = ['abc', 'cdf'];
var number2017 = ['fdsfsfa', 'hogehoge'];
var number2016 = ['mioonono', 'irewrln'];
for(var year = 2014; year<2030; year++){
var before_number = "number"+year;
var it_number = before_number.length;
console.log(it_number);
var selecter_number = "#"+year+"selecter";
while(i<it_number){
$(selecter_number).prepend('<iframe src="https://www.youtube.com/embed/'+before_number[i]+'?controls=2" frameborder="0" allow="autoplay; encrypted-media" allowfullscreen class="youtube"></iframe>');
i++;
}
}
HTML
<div id="2018selecter" class="youtube_frame_base" style="display: flex;"></div>
<div id="2017selecter" class="youtube_frame_base" style="display: flex;"></div>
<div id="2016selecter" class="youtube_frame_base" style="display: flex;"></div>
今回は今までHTML場でコピーアンドペーストしまくってyoutubeの一覧を作っていたものをもっと簡易的にしたいと考え、javascriptでfor文、while文を使用した記述方法に変更したいと考えました。
やりたいこととして、まずグローバル変数で各年度の動画の識別となる部分を配列で代入しておく。
for文内で各div要素内にコピーアンドペーストを自動的に記述を行なっていきたいという感じです。
問題はローカル変数であるbefore_numberです。この代入している値とグローバル変数の名前が一緒なのでこれで代入できてる?なんて考えていたのですが、代入ができていません。コンソールで確認したところ、変数内はしっかりと文字列が代入されているだけでした。
ここで質問なのですが、このローカル変数にグローバル変数にて定義した配列を代入することはどのように解決すればよいのでしょうか。
例 number2018=['abc','cdf']の値をローカル変数のbefore_numberの値が'number2018'になった時に、before_numberにグローバル変数のnumber2018の['abc','cdf']を代入したい。
よろしくお願いいたします。
修正後
var i=0;
const number = {
'2018': ['abc', 'cdf'],
'2017': ['fdsfsfa', 'hogehoge'],
'2016': ['mioonono', 'irewrln'],
}
for(var year = 2016; year<2030; year++){
var result = String( year );
var before_number = number[result];
if(before_number==undefined){
break;
}
var selecter_number = "#"+year+"selecter";
for(var i=0; i<30; i++){
var atai = before_number[i];
if(atai==undefined){
break;
}
$(selecter_number).prepend('<iframe src="https://www.youtube.com/embed/'+atai+'?controls=2" frameborder="0" allow="autoplay; encrypted-media" allowfullscreen class="youtube"></iframe>');
}
}
さらに修正後
for(var year = 2016; year<2030; year++){
var result = String( year );
var before_number = number[result];
if(before_number==undefined){
break;
}
var selecter_number = "#"+year+"selecter";
before_number.forEach(function( index ) {
$(selecter_number).prepend('<iframe src="https://www.youtube.com/embed/'+index+'" frameborder="0" allow="autoplay; encrypted-media" allowfullscreen class="youtube"></iframe>');
});
}
-
気になる質問をクリップする
クリップした質問は、後からいつでもマイページで確認できます。
またクリップした質問に回答があった際、通知やメールを受け取ることができます。
クリップを取り消します
-
良い質問の評価を上げる
以下のような質問は評価を上げましょう
- 質問内容が明確
- 自分も答えを知りたい
- 質問者以外のユーザにも役立つ
評価が高い質問は、TOPページの「注目」タブのフィードに表示されやすくなります。
質問の評価を上げたことを取り消します
-
評価を下げられる数の上限に達しました
評価を下げることができません
- 1日5回まで評価を下げられます
- 1日に1ユーザに対して2回まで評価を下げられます
質問の評価を下げる
teratailでは下記のような質問を「具体的に困っていることがない質問」、「サイトポリシーに違反する質問」と定義し、推奨していません。
- プログラミングに関係のない質問
- やってほしいことだけを記載した丸投げの質問
- 問題・課題が含まれていない質問
- 意図的に内容が抹消された質問
- 過去に投稿した質問と同じ内容の質問
- 広告と受け取られるような投稿
評価が下がると、TOPページの「アクティブ」「注目」タブのフィードに表示されにくくなります。
質問の評価を下げたことを取り消します
この機能は開放されていません
評価を下げる条件を満たしてません
質問の評価を下げる機能の利用条件
この機能を利用するためには、以下の事項を行う必要があります。
- 質問回答など一定の行動
-
メールアドレスの認証
メールアドレスの認証
-
質問評価に関するヘルプページの閲覧
質問評価に関するヘルプページの閲覧
checkベストアンサー
+1
変数名に値を使うのではなく、連想配列として定義しましょう。
const number = {
'2018': ['abc', 'cdf'],
'2017': ['fdsfsfa', 'hogehoge'],
'2016': ['mioonono', 'irewrln'],
}
投稿
-
回答の評価を上げる
以下のような回答は評価を上げましょう
- 正しい回答
- わかりやすい回答
- ためになる回答
評価が高い回答ほどページの上位に表示されます。
-
回答の評価を下げる
下記のような回答は推奨されていません。
- 間違っている回答
- 質問の回答になっていない投稿
- スパムや攻撃的な表現を用いた投稿
評価を下げる際はその理由を明確に伝え、適切な回答に修正してもらいましょう。
15分調べてもわからないことは、teratailで質問しよう!
- ただいまの回答率 88.35%
- 質問をまとめることで、思考を整理して素早く解決
- テンプレート機能で、簡単に質問をまとめられる
2019/04/23 20:36
すみません、もう少し詳細に解説いただけると幸いです。なんとなくわかったつもりでいまいるので。
それをその後どのように活用していけばよいのでしょうか?
2019/04/23 20:53
どうしてもわからなかったときには何がわからないのかをコメントしてください。
はじめから回答をもらってたら自分で修正できなくなりますよ。
2019/04/23 22:44
大変自分も今回は勉強になりました。
自分なりに完成した答えを改めて質問内容に記載させていただきました。
このコードみてここが悪いなどありましたらご指摘いただけると幸いです。
今後も日々精進したいと思います。
2019/04/23 23:38
さらに言えば、before_number が配列なので、forEach を使うとループするための i も不要なのでもっとシンプルになると思います。
2019/04/24 09:01
forEach文を用いてこれからやってみようと思います!
2019/04/24 09:04
2019/04/24 10:07
本当に面白いですね!