Hledání a nahrazování pomocí JavaScriptu

[Filip Jirsák]

Ze zadání vyplývá, že "plaintextové reference" na uživatele a témata chce nahradit HTML okazy.

Kód: [Vybrat]

@john and @johnathan went to see @sarah in their #hometown to look at her new #home.

@john      -->  <a href="/user/john">@john</a>
#hometown  -->  <a href="/topic/hometown">#hometown</a>
...Je jasné, že chce nahrazovat jen "kompletní tokeny".

Ne, to ze zadání nevyplývá. Dokonce je zadání zavádějící.

Z navrženého řešení vyplynulo, že tokeny mohou obsahovat pouze malé a velké znaky anglické abecedy a číslice, a že se mají nahrazvat jen „celá slova“ neb ojak píšete vy „kompletní tokeny“. To v zadání nikde není a podstatně to zjednodušuje řešení. V zadání je naopak uvedeno: „Dalej potrebujem zarucit ze ked sa mi prekryvaju tokeny(john -> johnathan) tak sa vyrazy najdu a nahradia spravne.“ Což je ale zavádějící, protože při tom upraveném zadání (nahrazují se jen celá slova) tahle situace nikdy nemůže nastat.

Zkrátka tazatel nejprve napsal dotaz, a teprve pak začal přemýšlet nad tím, co vlastně chce.

Jinak řešení toho upraveného zadání je triviální. Šlo by to napsat i jako oneliner, ale lepší je napsat si na to funkci.

Kód: [Vybrat]

const input = "@john and @johnathan went to see @sarah in their #hometown to look at her new #home."
const handles = ["john", "johnathan", "sarah"].map(item => item.toLowerCase())
const topics = ["home", "hometown"].map(item => item.toLowerCase())

const replaceTokens = (input, symbol, tokens, replace) => {
  const re = new RegExp(`${symbol}([a-zA-Z0-9]+)\b`, 'g')
  return input.replaceAll(re, (patch, g1) => tokens.includes(g1.toLowerCase()) ? replace(g1) : g1)
}

let output = replaceTokens(input, '@', handles, (handle) => `<a href="/user/${handle}">@${handle}</a>`)
output = replaceTokens(output, '#', topics, (topic) => `<a href="/topic/${topic}">#${topic}</a>`)
console.log(output)


[Reklama]

[Death Walker]

Tak ide to aj bez zbytocnych cyklov alebo callbacku pre kazdy vyskyt. To je v podstate skryte GOTO label. Regexpy vedia aj OR.

Kód: [Vybrat]

const
handles = ["john", "johnathan", "sarah"],
topics = ["home", "hometown"],
tmpString = "@john and @Johnathan went to see @sarah in their #hometown to look at her new #home.";

function rplacer(text){
  return tmpString.replace(
    new RegExp('@('+handles.join('|')+')\\b','gmi'),`<a href="/user/$1"@>$1</a>`
  ).replace(
  new RegExp('#('+topics.join('|')+')\\b','gmi'),`<a href="/topics/$1">#$1</a>`
  );
}

console.log(rplacer(tmpString))


[Death Walker]

pripadne mozeme aj objektovo...

Kód: [Vybrat]

var Rplacer = function(opts) {
  var priv = {}, pub = {};
 
  priv.opts = opts.map(function(obj){
    obj.re = new RegExp(obj.prefix+'('+obj.tokens.join('|')+')\\b','gmi')
    return obj;
  });

  pub.replace = function(input){
    priv.opts.forEach(function(x){
      input = input.replace(x.re,x.replace);
    });
    return input;
  }
   
  return pub;
};

var r = Rplacer([
  {
    prefix: '@',
    tokens:['john','johnathan','sarah'],
    replace:`<a href="/user/$1">@$1</a>`
  },{
    prefix: '#',
    tokens:["home", "hometown"],
    replace:`<a href="/topics/$1">#$1</a>`   
  }
]);

console.log(r.replace('@john and @johnathan went to see @Sarah in their #hometown to look at her new #home.'));


[dirka12345]

Ne, to ze zadání nevyplývá. Dokonce je zadání zavádějící.

Bez urazky, pokud nebyl prvni prispevek editovan (autorem), pak by ses mel zamyslet, nad tim co tu pises.

[_Tomáš_]

Tak ide to aj bez zbytocnych cyklov alebo callbacku pre kazdy vyskyt. To je v podstate skryte GOTO label. Regexpy vedia aj OR.

Kód: [Vybrat]

const
handles = ["john", "johnathan", "sarah"],
topics = ["home", "hometown"],
tmpString = "@john and @Johnathan went to see @sarah in their #hometown to look at her new #home.";

function rplacer(text){
  return tmpString.replace(
    new RegExp('@('+handles.join('|')+')\\b','gmi'),`<a href="/user/$1"@>$1</a>`
  ).replace(
  new RegExp('#('+topics.join('|')+')\\b','gmi'),`<a href="/topics/$1">#$1</a>`
  );
}

console.log(rplacer(tmpString))


Takhle můžeš jen doufat, že nikoho nenapadne zadat handles = ["john.doe"], ono to jde ještě dál, hodnoty v handles a topics se dají přímo využít pro XSS. Takovýhle způsob psaní kódu je dost nebezpečný.

[Reklama]

[Death Walker]

Tak ide to aj bez zbytocnych cyklov alebo callbacku pre kazdy vyskyt. To je v podstate skryte GOTO label. Regexpy vedia aj OR.

Kód: [Vybrat]

const
handles = ["john", "johnathan", "sarah"],
topics = ["home", "hometown"],
tmpString = "@john and @Johnathan went to see @sarah in their #hometown to look at her new #home.";

function rplacer(text){
  return tmpString.replace(
    new RegExp('@('+handles.join('|')+')\\b','gmi'),`<a href="/user/$1"@>$1</a>`
  ).replace(
  new RegExp('#('+topics.join('|')+')\\b','gmi'),`<a href="/topics/$1">#$1</a>`
  );
}

console.log(rplacer(tmpString))


Takhle můžeš jen doufat, že nikoho nenapadne zadat handles = ["john.doe"], ono to jde ještě dál, hodnoty v handles a topics se dají přímo využít pro XSS. Takovýhle způsob psaní kódu je dost nebezpečný.

To by musel mat moznost zmenit ten script. Ak bude mat moznost zmenit ten script tak nebude vymyslat blbiny ako zneuzit handles a topic, ze ano....

[Filip Jirsák]

Bez urazky, pokud nebyl prvni prispevek editovan (autorem), pak by ses mel zamyslet, nad tim co tu pises.

Takhle můžeš jen doufat, že nikoho nenapadne zadat handles = ["john.doe"], ono to jde ještě dál, hodnoty v handles a topics se dají přímo využít pro XSS. Takovýhle způsob psaní kódu je dost nebezpečný.

_Tomáši_, děkuji za odpověď dirka12345, že úvodní zadání je opravdu špatně napsané. Tazatel totiž později svým kódem naznačil, že oba dva druhy tokenů mohou obsahovat pouze malá a velká písmena anglické abecedy a arabské číslice. Tečka tedy mezi povolené znaky nepatří, ani menšítko, ampersand nebo uvozovky, takže pro XSS to využít nejde, i kdyby měl uživatel možnost ty hodnoty upravovat.

[Filip Jirsák]

Tak ide to aj bez zbytocnych cyklov alebo callbacku pre kazdy vyskyt. To je v podstate skryte GOTO label. Regexpy vedia aj OR.

Ano, kód se dá vždycky znepřehlednit. Ten callback je tam schválně, protože pak si můžete s nahrazováním dělat, co chcete, můžete každý token nahrazovat něčím jiným. Skryté GOTO vůbec ničemu nevadí – problém s klasickým GOTO je to, že znepřehledňuje kód. Co je efektivnější, jestli ten složený regexp nebo vyhledávání tokenů v poli, by se muselo změřit – ale vzhledem k tomu, že je to celé v JavaScriptu, mi to připadá jako velmi předčasná optimalizace. O možnosti použít OR v regulárních výrazech samozřejmě vím. Ale jednak v tom mlhavém zadání není řečeno, jak s emá pracovat s něčím, co vypadá jako token ale neví v seznamu tokenů – moje řešení umožňuje takové případy ignorovat (jak je to napsané), ale zároveň umožňuje na to nějak zareagovat, třeba ten token alespoň zalogovat. A druhá věc je to, na co upozornil _Tomáš_ – že cpát něco, co pravděpodobně může uživatel ovlivnit, bez escapování do regulárního výrazu, je dost nebezpečné. Ano, teď jsou jako tokeny povolea jen písmena a číslice, ale pokud by se někdo později rozhodl to změnit, nemusí mu dojít, že má upravit i tohle vytváření regulárních výrazů.

[Death Walker]

Tak samorejme, kazdu funkcionalitu je mozne napisat mnoho roznymi sposobmi. Ja ale nerad miesam roznu funkcionalitu do konkretnej casti programu. Ta funkcia zodpoveda za specificke nahradenie textu. Funkcionalita na validaciu tych tokenov je samozrejme za urcitych okolnosti ziaduca, ale nesuvysi priamo z fukcionalitou nahradzovania. Rovnako ako escapovanie riadiacich znakov v tom tokene. Nebudeme predsa pisat spagetak.

Co sa tyka efektivnosti, tak ten regexp byva prakticky v kazdom interpretri zkompilovany z ineho jazyka (zvedsa C). Ak si musi z toho kompilovaneho kodu zbytocne odskakovat do interpretru, tak efektivita klesa.

[Filip Jirsák]

Rovnako ako escapovanie riadiacich znakov v tom tokene.

Gratuluju, to je vůbec ten nejlepší způsob, jak vyrobit *injection chybu v aplikaci. Prostě si na všechn místech, kde by se to dalo ošetřit, říct „hm, to už je určitě ošetřené někde jinde“.

Nebudeme predsa pisat spagetak.

To s tím nijak nesouvisí.

Co sa tyka efektivnosti, tak ten regexp byva prakticky v kazdom interpretri zkompilovany z ineho jazyka (zvedsa C). Ak si musi z toho kompilovaneho kodu zbytocne odskakovat do interpretru, tak efektivita klesa.

To je klasická předčasná optimalizace. Navíc jenom hádáte, jak by asi tak mohl interpret JavaScriptu fungovat. Přitom dnes budete těžko hledat nějaký interpret, který by optimalizoval víc, než interprety JavaScriptu v prohlížeči (zejména V8). Možná by se to dalo srovnávat tak s JVM, pokud ji budeme považovat za interpret.

[dirka12345]

_Tomáši_, děkuji za odpověď dirka12345, že úvodní zadání je opravdu špatně napsané.

Pardon? Je toto puvodni zadani https://forum.root.cz/index.php?topic=25683.msg364308#msg364308 ? Co s tim ma spolecnyho naky reseni. Jeden z nas si sedi na kabelu. Jasne tam rika co cim chce nahradit. Nicmene hadat se nebudu, cau.

[Filip Jirsák]

_Tomáši_, děkuji za odpověď dirka12345, že úvodní zadání je opravdu špatně napsané.

Pardon? Je toto puvodni zadani https://forum.root.cz/index.php?topic=25683.msg364308#msg364308 ? Co s tim ma spolecnyho naky reseni. Jeden z nas si sedi na kabelu. Jasne tam rika co cim chce nahradit. Nicmene hadat se nebudu, cau.

Kdybyste si přečetl celou diskusi, dozvěděl byste se, že toto bylo původní zadání, které bylo kritizováno za nepřesnost – a v průběhu diskuse z tazatele postupně vylezlo, že chce vlastně něco úplně jiného. A v diskusi jsou správná řešení různých zadání, tak, jak z tazatele postupně lezlo, co vlastně chce.

[Death Walker]

Gratuluju, to je vůbec ten nejlepší způsob, jak vyrobit *injection chybu v aplikaci. Prostě si na všechn místech, kde by se to dalo ošetřit, říct „hm, to už je určitě ošetřené někde jinde“.

To ze to neviete, neznamena ze to nejde.

Kód: [Vybrat]

var Rplacer = function(opts) {
  var priv = {}, pub = {};
 
// vykona sa raz, sem patri pripadna kontrola vstupu
  priv.opts = opts.map(function(obj){
    obj.re = new RegExp(obj.prefix+'('+obj.tokens.join('|')+')\\b','gmi')
    return obj;
  });

// samotne nahradzovanie, volat sa moze do aleluja
  pub.replace = function(input){
    priv.opts.forEach(function(x){
      input = input.replace(x.re,x.replace);
    });
    return input;
  }
   
  return pub;
};

var r = Rplacer([
  {
    prefix: '@',
    tokens:['john','johnathan','sarah'],
    replace:`<a href="/user/$1">@$1</a>`
  },{
    prefix: '#',
    tokens:["home", "hometown"],
    replace:`<a href="/topics/$1">#$1</a>`   
  }
]);

console.log(r.replace('@john and @johnathan went to see @Sarah in their #hometown to look at her new #home.'));


To s tím nijak nesouvisí.

Suvisi.

To je klasická předčasná optimalizace. Navíc jenom hádáte, jak by asi tak mohl interpret JavaScriptu fungovat. Přitom dnes budete těžko hledat nějaký interpret, který by optimalizoval víc, než interprety JavaScriptu v prohlížeči (zejména V8). Možná by se to dalo srovnávat tak s JVM, pokud ji budeme považovat za interpret.

Predcasnej optimalizacie sa dopustate vy. Ak by ste mal aspom tusenie ako funguje V8 (ale aj spidermonkey) tak by ste vedel ze v prvom rade sa medzikod interpretuje, a az ked je k dispozicii dostatok informacii o kode tak pride na rad jit. Ale aj tamsu 2 moznosti, bud rychlejsi bez optimalizacii alebo pomalsi optimalizovany. To je ale logicke, ak je cena za jit + beh vacsia ako cena za interpret tak nema zmysel kompilovat. Kdezto vykonny kod toho regexp je VZDY skompilovany a interpret/jit ho len zavola s pattern ako parametrom.

[Filip Jirsák]

To ze to neviete, neznamena ze to nejde.

Já jsem ale nepsal, že to nejde. Já jsem kritizoval to, že jste to odbyl „to se vyřeší někde jinde“. Má to být v kódu hned u kódu, který to používá. Třeba aspoň tak, jak jste to napsal v příkladu vy.

To s tím nijak nesouvisí.

Suvisi.

To, že to neumíte napsat dobře, neznamená, že to dobře napsat nejde. A nakonec jste sám napsal příklad, který je špagetový jenom trochu, přitom je to tam ošetřené. Dalo by se to samozřejmě napsat tak, aby tam špaget bylo ještě méně. Dalo by se to napsat i objektově (a bez špaget).

Predcasnej optimalizacie sa dopustate vy.

V čem?

Ak by ste mal aspom tusenie ako funguje V8 (ale aj spidermonkey)

Nosíte dříví do lesa. Mám pro vás takovou pomůcku, až se zase budete pokoušet někoho poučovat. Když napíšete, jak něco funguje, zkuste to následně porovnat s textem toho, koho poučujete. Když zjistíte, že to, co napsal, není v žádném rozporu s vaším poučováním, nemáte žádný důvod myslet si, že dotyčný neví to, o čem ho poučujete. Takže to poučování zase můžete smazat.

Případně, pokud je tenhle postup na vás moc složitý, mám pro vás i jednodušší variantu: Pokud napíšete text, ve kterém někoho poučujete, zase ten text smažte.

Kdezto vykonny kod toho regexp je VZDY skompilovany

No a co? Vy používáte regexp, já používám regexp, takže ten váš výkonný zkompilovaný kód (o kterém se mimochodem jenom domníváte, že je zkompilovaný) používáme oba dva. Pokud si myslíte, že váš kód je lepší, zkuste hledat místa, ve kterých se ten kód liší, ne ta, která jsou stejná.

Mimochodem, změřit dobu běhu kódu není zas tak těžké. Čísla z měření by mne přesvěčila, vaše dojmy mne nepřesvědčí.

[Death Walker]

Já jsem ale nepsal, že to nejde. Já jsem kritizoval to, že jste to odbyl „to se vyřeší někde jinde“. Má to být v kódu hned u kódu, který to používá. Třeba aspoň tak, jak jste to napsal v příkladu vy.

Tak ako som to napisal ja, to nemusi byt nutne spolu, moze to byt v predkovi z inej kniznice. Tak nejak predpokladam ze programujete v jave. Tak by ste to vediet mal.

To, že to neumíte napsat dobře, neznamená, že to dobře napsat nejde. A nakonec jste sám napsal příklad, který je špagetový jenom trochu, přitom je to tam ošetřené. Dalo by se to samozřejmě napsat tak, aby tam špaget bylo ještě méně. Dalo by se to napsat i objektově (a bez špaget).

Magicke funkcie ktore zahrnaju viacero funkcnosti v jednom, je skolsky priklad spagetaku.

V čem?

V tom ze sa automaticky spusti jit kompilator.

Nosíte dříví do lesa. Mám pro vás takovou pomůcku, až se zase budete pokoušet někoho poučovat. Když napíšete, jak něco funguje, zkuste to následně porovnat s textem toho, koho poučujete. Když zjistíte, že to, co napsal, není v žádném rozporu s vaším poučováním, nemáte žádný důvod myslet si, že dotyčný neví to, o čem ho poučujete. Takže to poučování zase můžete smazat.

Případně, pokud je tenhle postup na vás moc složitý, mám pro vás i jednodušší variantu: Pokud napíšete text, ve kterém někoho poučujete, zase ten text smažte.

Vas text:

To je klasická předčasná optimalizace. Navíc jenom hádáte, jak by asi tak mohl interpret JavaScriptu fungovat. Přitom dnes budete těžko hledat nějaký interpret, který by optimalizoval víc, než interprety JavaScriptu v prohlížeči (zejména V8). Možná by se to dalo srovnávat tak s JVM, pokud ji budeme považovat za interpret.

Moj text:

Predcasnej optimalizacie sa dopustate vy. Ak by ste mal aspom tusenie ako funguje V8 (ale aj spidermonkey) tak by ste vedel ze v prvom rade sa medzikod interpretuje, a az ked je k dispozicii dostatok informacii o kode tak pride na rad jit. Ale aj tamsu 2 moznosti, bud rychlejsi bez optimalizacii alebo pomalsi optimalizovany. To je ale logicke, ak je cena za jit + beh vacsia ako cena za interpret tak nema zmysel kompilovat. Kdezto vykonny kod toho regexp je VZDY skompilovany a interpret/jit ho len zavola s pattern ako parametrom.

Ja nepoucujem ale pisem svoj nazor, na zaklade svojich skusenosti. Ak nemate dispozicie viest dialog, ale vydupavat si to ze ako jediny mate pravdu, tak pravidelna navsteva diskuzneho fora musi byt pre vas velkym utrpenim. Sucitim s vami.

No a co? Vy používáte regexp, já používám regexp, takže ten váš výkonný zkompilovaný kód (o kterém se mimochodem jenom domníváte, že je zkompilovaný) používáme oba dva. Pokud si myslíte, že váš kód je lepší, zkuste hledat místa, ve kterých se ten kód liší, ne ta, která jsou stejná.

Mimochodem, změřit dobu běhu kódu není zas tak těžké. Čísla z měření by mne přesvěčila, vaše dojmy mne nepřesvědčí.

Ak ja curam po vetre a vy proti vetru, tak to neznamena ze to robite lepsie nez ja. I ked ja curam, vy curate. K poznaniu ze curanie proti vetru nie je dobry napad, nemusim nutne skusit vas sposob.