Question

我正在使用JavaScript进行编码，并使用名为Three.js的webgl库进行编码。

在看了一些教程并做了一些实验后，我终于做到了：https://dl.dropboxusercontent.com/u/15814455/Monogram.html。

正如您在我的代码中看到的那样，该对象随机反映了一组包含13张图像的文件夹中的6张图像。

    var numberOfImages = 13, images = [];
    for (var i = 1; i <= numberOfImages; i++) {
        images.push('sources/instagram/image' + i + ".jpg");
    }

    var urls = images.sort(function(){return .6 - Math.random()}).slice(0,6);
    var reflectionCube = THREE.ImageUtils.loadTextureCube( urls );
    reflectionCube.format = THREE.RGBFormat;

问题是每次我上传Instagram图片时，它都会保存在名为instagram的文件夹中。

现在我的问题是，如果我上传例如10个图片到该文件夹，我必须更改这行代码：var numberOfImages = 13到此var numberOfImages = 23。

所以我正在寻找一种修改代码的方法，而不是设置图像数量的限制。所以我可以在文件夹中上传图像，然后在我的3d对象中自动查看它们。

我一直在网上阅读，我发现我可以在我的代码中使用一些称为正则表达式的东西来解决这个问题。

我想知道使用正则表达式是否是一个真正的解决方案。是否值得学习正则表达式来解决这个问题？

你有什么建议吗？有另一种解决方案吗？也许它很简单，我应该写一个不同的代码行，但如果它更复杂，我应该学习一些语言，我想学习正确的语言。

Answer 1

首先，如果您要使用几乎任何语言进行长度编程，那么了解正则表达式以及如何/何时使用它们将是值得的，因此学习它们将非常有用。

如果这是您控制服务器的客户端/服务器问题，解决此问题的常用方法是服务器将扫描服务器上的文件系统，它会告诉客户端要准备多少映像。 / p>

如果您必须在客户端上完全解决这个问题，那么您无法直接从客户端扫描文件系统，但是您可以请求增加文件编号，并且可以在停止成功加载图像时看到（异步）。这对代码来说并不是特别容易，因为响应将是异步的，但可以完成。

这是一个预加载图像并找出它们成功停止预加载的方案：

function preloadImages(srcs, callback) {
    var img, imgs = [];
    var remaining = srcs.length;
    var failed = [];

    function checkDone() {
        --remaining;
        if (remaining <= 0) {
            callback(failed);
        }
    }

    for (var i = 0; i < srcs.length; i++) {
        img = new Image();
        img.onload = checkDone;
        img.onerror = img.onabort = function() {
            failed.push(this.src);
            checkDone();
        }
        img.src = srcs[i];
        imgs.push(img);
    }
}

var maxNumberOfImages = 30, images = [];
for (var i = 1; i <= maxNumberOfImages; i++) {
    images.push('sources/instagram/image' + i + ".jpg");
}

preloadImges(images, function(failed) {
    var regex = /(\d+)\.jpg$/;
    var nums = failed.map(function(item) {
        var matches = item.match(regex);
        return parseInt(matches[1], 10);
    }).sort();
    var numImages = nums[0];
    // now you know how many good images there are
    // put your code here to use that knowledge
});

注意：这确实使用正则表达式来解析URL中的图像编号。

可以在没有预设限制的情况下对此进行编码，但这样做会更有效。你可能一次要求10个图像，如果你没有收到任何错误，那么请求下一个10块直到找到第一个失败。

在javascript中使用正则表达式来管理源文件

1 个答案: