Javascript- 使用字符串函数.replace 替换文本

Question

我试图通过调用一个缩短 url 然后替换文本的函数来替换字符串中的 url。缩短逻辑工作得很好，我最终得到了正确的替换 url，但是我无法使替换功能正常工作。这是我的代码。

var newtext = shortenUrl(curText);

var shortenUrl = function (text) {
    var exp = /(ftp|http|https):\/\/(?!bit\.ly)(\w+:{0,1}\w*@)?(\S+)(:[0-9]+)?(\/|\/([\w#!:.?+=&%@!\-\/]))?/ig;

    text.replace(exp, 
                 function ($1) {
                      $.getJSON("http://api.bitly.com/v3/shorten?login=xxxxxx&apiKey=xxxx&longUrl=" + escape($1) + "&format=json", 
                                function (result) {
                                    return result.data.url;
                                });
                 });
    return text;
};

result.data.url 包含一个符合 bit.ly API 规范的适当缩短的 url；然而，newtext 出于某种原因始终为 null。

Answer 1

1. text.Replace 不会改变文本的内容 => 你需要说 text = text.Replace(...) 因为 javascript 中的字符串是不可变的(https://stackoverflow.com/q/51193/4572 了解更多信息)

2. getJSON 是异步执行的，这意味着您提供给替换的函数的执行将启动 JSON 调用，但不会等待 JSON 调用完成，您需要使用 $.ajax 和 async 选项关闭(请参阅下面的代码以及此链接:Is it possible to set async:false to $.getJSON call)

3. 因为 JSON 调用仅执行回调(即函数(结果))，它实际上并不返回值，因此您需要创建所谓的“闭包”以获取状态(result.data) .url) 从你的函数(结果)调用到父作用域(在本例中是函数($1)创建的作用域)。闭包会变得非常困惑，尤其是在 javascript 中，有时会产生不明显的结果。谢天谢地，这是一个简单的闭包。如需更多信息，您可以查看此 https://stackoverflow.com/q/7363168/4572 ，或谷歌。

下面是适合我的代码:

var shortenUrl = function (text) {
    var exp = /(ftp|http|https):\/\/(?!bit\.ly)(\w+:{0,1}\w*@)?(\S+)(:[0-9]+)?(\/|\/([\w#!:.?+=&%@!\-\/]))?/ig;

    text = text.replace(exp, function ($1) {
       var newUrl = "";
       $.ajax({
           url: "http://api.bitly.com/v3/shorten?login=xxxxx&apiKey=xxxxxx&longUrl=" + escape($1) + "&format=json",
           dataType: 'json',
           async: false,
            success: function(result) {
                newUrl = result.data.url
            }
        });
        return newUrl;
    });
    return text;
};