web-dev-qa-db-ja.com

JavaScriptの動的変数名

変数があります：

var variableDynamic = 1;
// or    
var variableDynamic = 1 + i++;

それを使用して動的変数名を作成する方法はありますか、たとえば次のようなものがあります：

var variableName + variableDynamic = {};
// or
var (variableName + variableDynamic) = {};

私が上で書いたことはばかげていることは知っていますが、これはアイデアを説明するためです。出来ますか？

ユーザーが新しいファイルグループを追加するたびに要素（アップロードフォーム）を作成するためにやりたいことは、使用するプラグインがアップロードボタン（.uploadStoredFiles （）;）。

これは私がやった大まかなコードです：

    $('#addOneMoreFileOrGroup').on('click', function(){

    var latestFileUploaderId = parseInt($('.well-large .file-uploader').last().attr('id').split('-')[2]) + 1;

    $('.well-large .control-group:last').after('<div class="control-group deal-type-online">  \
        <label class="control-label">File / File Group Title:</label> \
        <div class="controls"> \
            <input class="span4 file-title" type="text"> \
            <span class="question label label-warning" data-title="File / Group Name:" data-content="Name for your file or group of related files (for example your brand logotype in different file formats)." data-original-title="">?</span> \
            <div id="file-uploader-' + latestFileUploaderId + '" class="file-uploader"></div> \
        </div> \
    </div>');

    var HERE_I_NEED_DYNAMIC_VAR = new qq.FileUploader({
        element: document.getElementById('file-uploader-' + latestFileUploaderId + ''),
        action: 'do-nothing.htm',
        autoUpload: false,
        debug: true,
        uploadButtonText: '<i class="icon icon-plus"></i> Select Files...',
        onSubmit: function() {

            $('#file-uploader-' + latestFileUploaderId + ' .qq-uploader').after('<button id="file-uploader-trigger-' + latestFileUploaderId + '" class="btn btn-primary"><i class="icon-upload icon-white"></i> Upload now</button>');

            $('#file-uploader-trigger-' + latestFileUploaderId + '').on('click', function() {

                if($(this).parent().parent().parent().parent().find('.file-title').val() !== '') {
                    HERE_I_NEED_DYNAMIC_VAR.uploadStoredFiles();
                } else {

                    $(this).parent().parent().parent().addClass('error');

                }

            });

        }
    });

});

}
javascriptvariablesdynamic
14
ignaty

JavaScriptでは、オブジェクトのプロパティはobj.propまたはobj['prop']。

グローバルスコープでは、すべての変数はwindowプロパティの子です。だからあなたができるようになります：

var variableDynamic = 'Test';
window['variableName' + variableDynamic] = 'your value';

this fiddle を確認してください。

ただし、この変数のスコープを関数に制限する場合は、親オブジェクトを定義し、windowの代わりにこれを使用する必要があります。

29
Connell

evalを使用して動的変数を作成できます。

eval("dynamic" + i + " = val[i]");

こちらもご覧ください： JavaScriptで動的変数名を使用

16
sainiuc

私はeval()が必ずしも悪であるとは思わない-それは時々誤用されるだけだ。文字列を取得し、それをJavaScriptコードに「evaluate」（ [〜＃〜] mdn [〜＃〜] ）、したがってiff変数を動的に設定する必要があるeval()はそうするための1つの方法です：

var t = 't';
var four = '4';
eval('var ' + (t + four) + ' = "some value";');
console.log(t4);

// returns "some value" to the console

おそらく、evaluated code-stringsがグローバルレベルで実装されているため、動的な変数と値のペアを実行するためのより良い方法がありますが、上記はそうです作業。問題は、それがあなたが達成したいものに最適な方法なのか（？）です。 「eval（）」の説明については、 NCZOnlineからの2013年のこのブログ投稿 を参照してください。

4
Brian Peacock

これには、eval()を使用できます。しかし、eval()は悪です。このようなことには配列を使用する必要があります。

例：

var i = 1337;
eval('var myvar' + i + ' = \'value\';');

alert(myvar1337);
4
Thomas Kekeisen

FAngelsの回答に追加するには、どこでもブラケット表記を使用できます。これは、window['var']、使用できますthis['var']。

4
Awesomeness01

関数スコープでそれをどのように行うことができるかはわかりませんが、グローバル変数は次のように作成できます。

window[variableName + variableDynamic] = {}
3
Viktor S.

JavaScriptで動的変数名を作成できるとは思いませんが、オブジェクト属性を文字列で設定できます。そのため、オブジェクトの属性として動的変数を作成すると、目標を達成できます。

1
Scott Saunders