Jak zamienić ciągi znaków na javascript?

Question

mam tej funkcji:

function emoticons(text){ 
    var url = "http://www.domain.it/images/smilies/"; 
    var emt = { 
     ":D" : 'icon_e_biggrin.gif', 
     ":-D" : 'icon_e_biggrin.gif',  
     ":)" : 'icon_e_smile.gif', 
     ":-)" : 'icon_e_smile.gif',  
     ";)" : 'icon_e_wink.gif', 
     "';-)" : 'icon_e_wink.gif', 

     ":(" : 'icon_e_sad.gif', 
     ":-(" : 'icon_e_sad.gif', 
     ":o" : 'icon_e_surprised.gif', 
     ":?" : 'icon_e_confused.gif', 
     "8-)" : 'icon_cool.gif', 

     ":x" : 'icon_mad.gif', 
     ":P" : 'icon_razz.gif' 
    }; 

    for (smile in emt){   
     text = text.replace(smile, '<img src="' + url + emt[smile] + '" class="emoticons" />'); 
    } 

    return (text); 
} 

Jak wiecie .replace() przekonwertować pierwszego wystąpienia, jak wymienić więcej niż jeden emotikon wewnątrz tekstu? Jak zmienić tę funkcję?

Dziękuję bardzo!

Answer 1

Można tłumaczyć każdy łańcuch emotikon do globalnej wyrażenia regularnego, które zastąpi wszystkie wystąpienia w przypadku korzystania z napisu # zastąpić metoda:

function emoticons(text){ 
    var url = "http://www.domain.it/images/smilies/"; 
    var emt = { 
    /\:D/g: 'icon_e_biggrin.gif', 
    /\:\-D/g: 'icon_e_biggrin.gif', 
//... 

Musisz uważać na ucieczkę znaki specjalne w tekst emotikonów.

Answer 2

maerics' answer to dość mała zmiana w stosunku do istniejącej funkcji, która powinna wystarczyć. Jeśli tekst, który robisz, zamienniki są duże, możesz rozważyć rzutowanie rzeczy na głowie i używanie opcji regularnego zastępowania i funkcji zastępowania.

Regex alternacje wyglądać następująco: /A|B|C/, która opowiada silnik regex wyglądać lub B lub C. Funkcja dajesz String#replace odbiera tekst pasujący jako argument, więc może to nie patrzeć w górę istotne wymiana na mapie:

function emoticons(text){ 
    // The base URL of all our smilies 
    var url = "http://www.domain.it/images/smilies/"; 

    // A regex alternation that looks for all of them (be careful to use escapes 
    // where necessary) 
    var searchFor = /:D|:-D|:\)|:-\)|;\)|';-\)|:\(|:-\(|:o|:\?|8-\)|:x|:P/gi; 

    // A map mapping each smiley to its image 
    var map = { 
     ":D" : 'icon_e_biggrin.gif', // Capped version of the next 
     ":d" : 'icon_e_biggrin.gif', // Lower case version of the previous 
     ":-D" : 'icon_e_biggrin.gif', // Capped version of the next 
     ":-d" : 'icon_e_biggrin.gif', // Lower case version of the previous 
     ":)" : 'icon_e_smile.gif', 
     ":-)" : 'icon_e_smile.gif', 
     ";)" : 'icon_e_wink.gif', 
     "';-)" : 'icon_e_wink.gif', 

     ":(" : 'icon_e_sad.gif', 
     ":-(" : 'icon_e_sad.gif', 
     ":O" : 'icon_e_surprised.gif', // Capped version of the next 
     ":o" : 'icon_e_surprised.gif', // Lower case version of the previous 
     ":?" : 'icon_e_confused.gif', 
     "8-)" : 'icon_cool.gif', 

     ":X" : 'icon_mad.gif', // Capped version of the next 
     ":x" : 'icon_mad.gif', // Lower case version of the previous 
     ":P" : 'icon_razz.gif', // Capped version of the next 
     ":p" : 'icon_razz.gif' // Lower case version of the previous 
    }; 

    // Do the replacements 
    text = text.replace(searchFor, function(match) { 
     var rep; 

     // Look up this match to see if we have an image for it 
     rep = map[match]; 

     // If we do, return an `img` tag using that smiley icon; if not, there's 
     // a mis-match between our `searchFor` regex and our map of 
     // smilies, but handle it gracefully by returning the match unchanged. 
     return rep ? '<img src="' + url + rep + '" class="emoticons" />' : match; 
    }); 

    return (text); 
} 

Doing to pozwala jedynie pętlę poprzez ciąg raz i zbudować pojedynczy łańcuch zastępczy zamiast zapętlenie przez nią dla każdego buźkę i budowę wielu ciągów tymczasowe.

W przypadku mniejszych fragmentów tekstu nie ma to znaczenia, a złożoność (utrzymanie każdej buźki w dwóch różnych miejscach) może nie być tego warta, ale w przypadku dużych tekstów może być.

Answer 3

Innym rozwiązaniem jest utworzenie RegExp z modyfikatorem "g" dla każdego ciągu. I od tej funkcji można uruchomić więcej niż jeden raz nominalnej pageload, należy utworzyć emt i wyrażenia regularne tylko jeden raz:

var emoticons = (function() { 
    var url = "http://www.domain.it/images/smilies/"; 
    var emt = { 
     ":D" : 'icon_e_biggrin.gif', 
     ":-D" : 'icon_e_biggrin.gif',  
     ":)" : 'icon_e_smile.gif', 
     ":-)" : 'icon_e_smile.gif',  
     ";)" : 'icon_e_wink.gif', 
     "';-)" : 'icon_e_wink.gif', 

     ":(" : 'icon_e_sad.gif', 
     ":-(" : 'icon_e_sad.gif', 
     ":o" : 'icon_e_surprised.gif', 
     ":?" : 'icon_e_confused.gif', 
     "8-)" : 'icon_cool.gif', 

     ":x" : 'icon_mad.gif', 
     ":P" : 'icon_razz.gif' 
    }; 

    var patterns = []; 
    for (smile in emt) { 
     patterns.push([ 
      // escaping string special characters by hand 
      // case-insensitive to match :p :d etc. 
      new RegExp(smile.replace(/([\(\)\[\]\{\}\.\?\^\$\|\-])/g, "\\$1"), "gi"), 
      '<img src="' + url + emt[smile] + '" class="emoticons" />' 
     ]); 
    } 

    // this is the function that will be referenced by the variable emoticons 
    return function (text) { 
     for(var i=0; i<patterns.length; i++) { 
      text = text.replace(patterns[i][0], patterns[i][1]); 
     } 
     return text; 
    } 

})(); 

Oto demo: http://jsfiddle.net/gjfzf/2/