"concat" does not join JavaScript arrays together?

Question

I'm running the following code on Webkit:

var scriptElements = document.scripts;
var scriptUrls = [];
// URL matching
var regexp = /((?:[a-z][w-]+:(?:/{1,3}|[a-z0-9%])|wwwd{0,3}[.]|[a-z0-9.-]+[.][a-z]{2,4}/)(?:[^s()<>]+|(([^s()<>]+|(([^s()<>]+)))*))+(?:(([^s()<>]+|(([^s()<>]+)))*)|[^s`!()[]{};:'".,<>???“”‘’]))/i;
for (var i = 0; i < scriptElements.length; i++) {
    element = scriptElements[i];
    var urls = element.innerHTML.match(regexp);
    console.log('local', urls);
    scriptUrls.concat(urls);
    console.log('global', scriptUrls);
}

I see non-empty arrays printed after 'local' but the 'global' always stays as an empty array. What's going on?

Answer 1

.concat creates a new Array. You need to overwrite the old one.

scriptUrls = scriptUrls.concat(urls);

---

Or if you want to keep the original scriptUrls Array, you can .push() the values in.

scriptUrls.push.apply(scriptUrls, urls);

This uses .apply() to convert urls into individual arguments passed to .push(). This way the content of urls is added to scriptUrls as individual items.

---

Also, note that .concat() flattens the Array. If you wanted an Array of Arrays, then you'd use scriptUrls.push(urls).