[js]変数名に連番をつけたり変数を入れたり複数を一括で作ったりする宣言方法

手段は知っておくべきだけど用途は限ったほうがいいと思う。

通常、変数名はベタ打ちで書く

普通はこう書く。

var example = ***;

こんな感じでは書けない。

var 'exam'+'ple' = ***;

連結した時点でそれは名称ではないよね。

eval()を使う

宣言の記述自体を作ればいい。中に書いたのをまんま使えるのでいい感じに作ればいい。

var aaa = 'unko';
var bbb = 'chinko';

eval("var example_" + aaa + " = '"+ bbb + "';");
//var example_unko = 'chinko';

連番で複数生成したければこんなにするとか。

for(var i=1; i<=5; i++){
    eval("var example_" + i + " = "+ i + ";");
}
//var example_1 = 1;
//var example_2 = 2;
//var example_3 = 3;
//var example_4 = 4;
//var example_5 = 5;

だけどまあ、変数名どころか中身までこうやってパターンにはめるなら、多分それは変数を量産するよりももっと都合の良い組み方がある。

動的に変数名を生成する必要があるとすれば、一定の規則で作られているものを取得する必要が出たときだと思う。

デメリットとかリスクがあるので使うときは注意すること。処理が遅いとか、動的な物を組み込むのは危険だとか、ある。

eval() - JavaScript | MDN
eval() 関数は、文字列として表現された JavaScript コードを評価します。ソースはスクリプトとして解釈されます。

20221219追記:複数フォーム設置のautoKanaでいい感じになった

普通はこんな組み合わせになる。

$.fn.autoKana('.sei', '.sei_kana', {katakana : true});
$.fn.autoKana('.mei', '.mei_kana', {katakana : true});

一つのページにフォームを複数設置して、そのうちのどれかで問い合わせをするようにした場合。それぞれに名前とフリガナの記入欄があって、全てにautoKanaを付与したいとする。

HTMLでこんな感じにフォームを振り分けてたとする。

<ul id="form_list">
    <li id="form01">【フォーム1】</li>
    <li id="form02">【フォーム2】</li>
    <li id="form03">【フォーム3】</li>
</ul>

個別に書くのはめんどくさいからeachで回しちゃおうね。

$('#form_list > li').each(function(){
    var targetId = '#' + $(this).attr('id');
    eval("$.fn.autoKana('" + targetId + " .sei','" + targetId + " .sei_kana', {katakana : true});");
    eval("$.fn.autoKana('" + targetId + " .mei','" + targetId + " .mei_kana', {katakana : true});");
})

フォームを増やしても安心。

とか言いながら、これは普通に変数を入れても動くんだよね。やっぱり使い道無いね。

    $.fn.autoKana(targetId + ' .sei',targetId + ' .sei_kana', {katakana : true});
    $.fn.autoKana(targetId + ' .mei',targetId + ' .mei_kana', {katakana : true});

コメント

タイトルとURLをコピーしました