JavaScript RegExp: kiểm tra và thực hiện

Question

Tôi muốn nhận URL của tất cả các hình ảnh trong văn bản nhiều dòng (bất kể nó chứa gì).

Đây là mã của tôi:

var pattern = /(http:\/\/\S+\.(?:jpg|gif|png|jpeg|JPG|GIF|PNG|JPEG))/mg; 
var testResult = pattern.test(str)); 
var result = pattern.exec(str); 

Nếu str bằng "http://example.dom.com/-6/x_5eb0916a.jpg", testResult bằng đúng nhưng kết quả là null. Tại sao? Bạn có giúp tôi giải quyết vấn đề này không?

Answer 1

Đó là vì cờ g. Nếu bạn đảo ngược hai cuộc gọi, bạn sẽ nhận được các kết quả khác nhau vì cờ toàn cầu đặt pattern.lastIndex và bắt đầu đối sánh từ chỉ mục đó vào lần tiếp theo bạn gọi .test/.exec. Khi đảo ngược các cuộc gọi, bạn sẽ nhận được kết quả không phải là null cho .exec và false cho .test.

Với .lastIndex và cờ toàn cầu, trong trường hợp của bạn nó phù hợp với URL cho .test, và sẽ bắt đầu tìm kiếm thêm URL sau URL đầu tiên khi bạn thực hiện .exec. Không có thêm URL, vì vậy bạn sẽ nhận được null. Lưu ý rằng lastIndex sau đó được đặt lại thành 0, vì vậy, hãy gọi lại .exec sẽ hoạt động.

Nhưng dù sao, bạn dường như tìm kiếm str.match(pattern) thay vào đó, mà chỉ đơn giản liệt kê tất cả các trận đấu:

var str = " test http://example.dom.com/-6/x_5eb0916a.jpg" 
      + " \nfoo http://example2.com/test.png"; 

var pattern = /(http:\/\/\S+\.(?:jpg|gif|png|jpeg|JPG|GIF|PNG|JPEG))/gm; 

str.match(pattern); 
// ["http://example.dom.com/-6/x_5eb0916a.jpg", "http://example2.com/test.png"] 

Answer 2

Bạn thử này,

"http://example.dom.com/-6/x_5eb0916a.jpg".match(pattern) 

Answer 3

Giải pháp cho vấn đề này là chỉ cần đặt lastIndex của regex đến số không.

var pattern = /(http:\/\/\S+\.(?:jpg|gif|png|jpeg|JPG|GIF|PNG|JPEG))/mg; 
var testResult = pattern.test(str)); 
pattern.lastIndex=0; 
var result = pattern.exec(str); 
pattern.lastIndex=0;