使用字符串創建變量

Question

我正在嘗試使用字符串創建變量。

我正在編寫一個腳本，它將從一個字符串數組中加載圖像，我想將這些圖像存儲在變量中，並使用所用字符串的名稱。

這是到目前為止的代碼：

var images = ["CrazyWolf.jpg", "CrazyWolf.jpg", "CrazyWolf.jpg", "CrazyWolf.jpg"];
var name = "";

function preload(path)
{
        img = new Image();
        img.src = path;
        img.onload = imageLoaded;
        return img;
};

function makeImages()
{
    for(var i = images.length; i > 0; i--)
    {
        source = images.shift();
        preload(source);
        var name = source.replace(".jpg", "Image");
        console.log(name);

        //make vars with as name, var name
        //Console.log(name); returns: CrazyWolfImage

        if(i==0) console.log("Loop ended");
    }
}

如何使用此名稱創建變量？

任何幫助都會受到極大的折磨！

謝謝！

Answer 1

你要求的很容易。 您可以將圖像存儲為window對象中的屬性，並且可以將其作為全局變量進行訪問：

function makeImages() {
  while (images.length) {
    source = images.shift();
    var name = source.replace(".jpg", "Image");
    window[name] = preload(source);
  }
}

但是，動態創建變量並不是很有用，它可能會產生不可預見的副作用。 使用變量的代碼要么盲目地使用一些變量，這取決於它們的創建，要么動態地訪問它們，這使得將它們作為變量放在首位毫無意義。 全局命名空間已經充滿了標識符，因此存在使用已存在的名稱的風險。

而不是使用全局命名空間，創建一個按名稱存儲圖像的對象。 這樣，它們就與全局命名空間及其現有標識符隔離。 您甚至不必操縱名稱來生成有效的標識符，像CrazyWolf.jpg這樣的名稱可以很好地訪問屬性：

var img = {};

function makeImages() {
  while (images.length) {
    source = images.shift();
    img[source] = preload(source);
  }
}

現在，您可以從對象動態訪問圖像。 例：

document.getElementById('#ShowImage').src = img['CrazyWolf.jpg'].src;

您還可以循環訪問對象中的圖像，如果它們是全局命名空間中現有的所有變量，則這是不可能的：

for (image in img) {
  image.style.width = '200px';
}

注意：循環訪問對象中的屬性時，不能依賴於它們的處理順序。 如果要保留特定訂單，則可以使用數組而不是對象。

Answer 2

你可以這樣說： -

eval("var number = 5");
console.log(number);

這將打印5作為答案。

我認為這會有所幫助。

Answer 3

您不能使用構造名稱創建非全局變量而不使用eval() （這可能是一個非常糟糕的主意），但您可以創建對象屬性：

var imgs = {};
for(var i = images.length; i > 0; i--)
{
    source = images.shift();
    preload(source);
    var name = source.replace(".jpg", "Image");
    console.log(name);
    imgs[name] = whatever;
}

應避免使用eval()因為如果不是出於經常討論的美學原因，它就不可能進行內部代碼優化。

全局變量是全局上下文（ window ）的屬性，所以如果你想要全局變量（為什么？），你可以使用它而不是本地對象。