{"id":22289,"date":"2020-07-26T07:02:05","date_gmt":"2020-07-26T05:02:05","guid":{"rendered":"https:\/\/savinol.sg-host.com\/webdesign\/espressioni-regolari-facili-in-javascript-con-super-expressive\/"},"modified":"2020-07-26T07:02:05","modified_gmt":"2020-07-26T05:02:05","slug":"espressioni-regolari-facili-in-javascript-con-super-expressive","status":"publish","type":"post","link":"https:\/\/www.nycwebdesign.eu\/webdesign\/espressioni-regolari-facili-in-javascript-con-super-expressive\/","title":{"rendered":"Espressioni regolari facili in JavaScript con Super Expressive"},"content":{"rendered":"<p> <br \/>\n<\/p>\n<div>\n<p>Quando si ha a che fare con la manipolazione di stringhe, ad esempio per estrarre specifiche informazioni partendo dalla conoscenza di una particolare struttura della stringa stessa, non si pu\u00f2 fare a meno dell\u2019uso delle <strong>espressioni regolari<\/strong>. Non a caso, la stragrande maggioranza dei linguaggi di programmazione spesso le supporta nativamente. E <a href=\"https:\/\/www.html.it\/guide\/guida-javascript-di-base\/\">JavaScript<\/a> non fa eccezione (ne abbiamo parlato in <a href=\"https:\/\/www.html.it\/pag\/47359\/regexp-e-le-espressioni-regolari\/\">questa lezione<\/a>).<\/p>\n<p>Tuttavia, quando ci si approccia all\u2019uso di questo potentissimo strumento, il primo impatto \u00e8 spesso piuttosto pesante, quasi criptico, per via del particolare vocabolario che \u00e8 necessario conoscere per comporre le espressioni regolari. Non \u00e8 raro che anche sviluppatori con una certa esperienza alle spalle talvolta facciano fatica a \u201cdecifrare\u201d un\u2019espressione regolare scritta qualche mese prima! E questo problema \u00e8 ancora pi\u00f9 evidente se si pensa a chi ha la necessit\u00e0 di dover revisionare codice scritto da altri.<\/p>\n<p>Con questa criticit\u00e0 in mente, il programmatore Francis Strokes ha pensato di sviluppatore una libreria JavaScript, denominata <strong>Super Expressive<\/strong>, per semplificare la creazione di espressioni regolari partendo da un insieme di metodi che rendono l\u2019intero processo molto pi\u00f9 comprensibile, e quindi manutenibile.<\/p>\n<p>Super Expressive non ha nessuna dipendenza, e pu\u00f2 risultare utile in molti contesti.<\/p>\n<h2>Installare ed utilizzare Super Expressive<\/h2>\n<p>Il codice sorgente di Super Expressive \u00e8 liberamente <a href=\"https:\/\/github.com\/francisrstokes\/super-expressive\" target=\"_blank\" rel=\"nofollow noopener noreferrer\">accessibile su GitHub<\/a>. Possiamo installarlo sfruttando <em>npm<\/em>:<\/p>\n<pre><code class=\"language-markup\">\nnpm i super-expressive\n<\/code><\/pre>\n<p>Una volta installato, pu\u00f2 essere integrato all\u2019interno del nostro progetto come di consueto:<\/p>\n<pre><code class=\"language-javascript\">\nconst SuperExpressive = require('super-expressive');\n<\/code><\/pre>\n<p>Alternativamente, possiamo integrarlo come modulo <a href=\"https:\/\/www.html.it\/pag\/55171\/ecmascript-6-e-il-supporto-dei-browser\/\">ES6<\/a>:<\/p>\n<pre><code class=\"language-javascript\">\nimport SuperExpressive from 'super-expressive';\n<\/code><\/pre>\n<h2>Creare espressioni regolari con Super Expressive<\/h2>\n<p>Per utilizzare Super Expressive all\u2019interno dei nostri script, dovremo innanzitutto creare un\u2019istanza dell\u2019oggetto <code>SuperExpressive<\/code>. Dopodich\u00e9, sar\u00e0 sufficiente usare una serie di metodi, ognuno dei quali consentir\u00e0 di specificare un particolare pattern.<\/p>\n<p>Vediamo subito un esempio, tratto dalla documentazione (disponibile sul gi\u00e0 citato repository di GitHub):<\/p>\n<pre><code class=\"language-javascript\">\nconst SuperExpressive = require('super-expressive');\nconst myRegex = SuperExpressive()\n  .startOfInput\n  .optional.string('0x')\n  .capture\n    .exactly(4).anyOf\n      .range('A', 'F')\n      .range('a', 'f')\n      .range('0', '9')\n    .end()\n  .end()\n  .endOfInput\n  .toRegex();\n<\/code><\/pre>\n<p>\u00c8 abbastanza intuitivo comprendere cosa far\u00e0 questa catena di metodi. Il primo, <code>startOfInput<\/code>, permette di specificare che l\u2019espressione regolare deve considerare le sole sottostringhe che si trovano all\u2019inizio della stringa oggetto di analisi. A seguire, <code>optional.string('0x')<\/code> permette di specificare che, opzionalmente, deve essere considerata anche la stringa \u20180x\u2019. Il metodo <code>capture<\/code>, in combinazione <code>exactly<\/code>, consente di esprimere la necessit\u00e0 di riconoscere esattamente 4 caratteri, compresi nei range di lettere e numeri specificati dall\u2019omonimo metodo.<\/p>\n<p>Infine, <code>toRegex()<\/code> converte il tutto in una espressione regolare vera o propria, che nel caso specifico \u00e8 la seguente:<\/p>\n<pre><code class=\"language-javascript\">\n\/^(?:0x)?([A-Fa-f0-9]{4})$\/\n<\/code><\/pre>\n<h2>Conclusioni<\/h2>\n<p>Quello appena visto \u00e8 solo un esempio, ma pu\u00f2 facilmente essere generalizzato facendo riferimento alla summenzionata documentazione, unitamente a qualche test.<\/p>\n<p>Super Expressive rappresenta una interessante opportunit\u00e0, soprattutto per migliorare la <strong>leggibilit\u00e0 e manutenibilit\u00e0 del codice<\/strong>, e che pu\u00f2 trovare applicazioni molto fruttuose in team che applicano costantemente il processo della <strong>code review<\/strong>, richiedendo a pi\u00f9 membri del team di rivedere il codice di altri.<\/p>\n<p><em>Fonte<\/em>: <a href=\"https:\/\/github.com\/francisrstokes\/super-expressive\" class=\"text-link text-link--special\" target=\"_blank\" rel=\"nofollow noopener noreferrer\"><span class=\"underline\">GitHub<\/span><i class=\"ico-external\"\/><\/a><\/p>\n<\/div>\n<p><br \/>\n<br \/><a href=\"http:\/\/feedproxy.google.com\/~r\/htmlitedit\/~3\/AK9ZbV0NGxg\/\">Source link <\/a><\/p>\n","protected":false},"excerpt":{"rendered":"<p>Quando si ha a che fare con la manipolazione di stringhe, ad esempio per estrarre specifiche informazioni partendo dalla conoscenza di una particolare struttura della stringa stessa, non si pu\u00f2 fare a meno dell\u2019uso delle espressioni regolari. Non a caso, la stragrande maggioranza dei linguaggi di programmazione spesso le supporta nativamente. E JavaScript non fa&#8230;<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_s2mail":""},"categories":[37],"tags":[],"acf":[],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v19.13 - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>Espressioni regolari facili in JavaScript con Super Expressive - AGENZIA WEB Italia<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/www.nycwebdesign.eu\/webdesign\/espressioni-regolari-facili-in-javascript-con-super-expressive\/\" \/>\n<meta property=\"og:locale\" content=\"it_IT\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Espressioni regolari facili in JavaScript con Super Expressive - AGENZIA WEB Italia\" \/>\n<meta property=\"og:description\" content=\"Quando si ha a che fare con la manipolazione di stringhe, ad esempio per estrarre specifiche informazioni partendo dalla conoscenza di una particolare struttura della stringa stessa, non si pu\u00f2 fare a meno dell\u2019uso delle espressioni regolari. Non a caso, la stragrande maggioranza dei linguaggi di programmazione spesso le supporta nativamente. E JavaScript non fa...\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.nycwebdesign.eu\/webdesign\/espressioni-regolari-facili-in-javascript-con-super-expressive\/\" \/>\n<meta property=\"og:site_name\" content=\"AGENZIA WEB Italia\" \/>\n<meta property=\"article:published_time\" content=\"2020-07-26T05:02:05+00:00\" \/>\n<meta name=\"author\" content=\"admin\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Scritto da\" \/>\n\t<meta name=\"twitter:data1\" content=\"admin\" \/>\n\t<meta name=\"twitter:label2\" content=\"Tempo di lettura stimato\" \/>\n\t<meta name=\"twitter:data2\" content=\"2 minuti\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\/\/www.nycwebdesign.eu\/webdesign\/espressioni-regolari-facili-in-javascript-con-super-expressive\/#article\",\"isPartOf\":{\"@id\":\"https:\/\/www.nycwebdesign.eu\/webdesign\/espressioni-regolari-facili-in-javascript-con-super-expressive\/\"},\"author\":{\"name\":\"admin\",\"@id\":\"https:\/\/www.nycwebdesign.eu\/webdesign\/#\/schema\/person\/c0748e23499fac2fd73b79d1379fdf42\"},\"headline\":\"Espressioni regolari facili in JavaScript con Super Expressive\",\"datePublished\":\"2020-07-26T05:02:05+00:00\",\"dateModified\":\"2020-07-26T05:02:05+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\/\/www.nycwebdesign.eu\/webdesign\/espressioni-regolari-facili-in-javascript-con-super-expressive\/\"},\"wordCount\":454,\"publisher\":{\"@id\":\"https:\/\/www.nycwebdesign.eu\/webdesign\/#organization\"},\"articleSection\":[\"News\"],\"inLanguage\":\"it-IT\"},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/www.nycwebdesign.eu\/webdesign\/espressioni-regolari-facili-in-javascript-con-super-expressive\/\",\"url\":\"https:\/\/www.nycwebdesign.eu\/webdesign\/espressioni-regolari-facili-in-javascript-con-super-expressive\/\",\"name\":\"Espressioni regolari facili in JavaScript con Super Expressive - AGENZIA WEB Italia\",\"isPartOf\":{\"@id\":\"https:\/\/www.nycwebdesign.eu\/webdesign\/#website\"},\"datePublished\":\"2020-07-26T05:02:05+00:00\",\"dateModified\":\"2020-07-26T05:02:05+00:00\",\"breadcrumb\":{\"@id\":\"https:\/\/www.nycwebdesign.eu\/webdesign\/espressioni-regolari-facili-in-javascript-con-super-expressive\/#breadcrumb\"},\"inLanguage\":\"it-IT\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/www.nycwebdesign.eu\/webdesign\/espressioni-regolari-facili-in-javascript-con-super-expressive\/\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/www.nycwebdesign.eu\/webdesign\/espressioni-regolari-facili-in-javascript-con-super-expressive\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/www.nycwebdesign.eu\/webdesign\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Espressioni regolari facili in JavaScript con Super Expressive\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/www.nycwebdesign.eu\/webdesign\/#website\",\"url\":\"https:\/\/www.nycwebdesign.eu\/webdesign\/\",\"name\":\"AGENZIA WEB Italia\",\"description\":\"Web design Web agency Italia\",\"publisher\":{\"@id\":\"https:\/\/www.nycwebdesign.eu\/webdesign\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/www.nycwebdesign.eu\/webdesign\/?s={search_term_string}\"},\"query-input\":\"required name=search_term_string\"}],\"inLanguage\":\"it-IT\"},{\"@type\":\"Organization\",\"@id\":\"https:\/\/www.nycwebdesign.eu\/webdesign\/#organization\",\"name\":\"Multimedia Web\",\"url\":\"https:\/\/www.nycwebdesign.eu\/webdesign\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"it-IT\",\"@id\":\"https:\/\/www.nycwebdesign.eu\/webdesign\/#\/schema\/logo\/image\/\",\"url\":\"https:\/\/www.nycwebdesign.eu\/webdesign\/wp-content\/uploads\/2016\/05\/multimediaweb1.png\",\"contentUrl\":\"https:\/\/www.nycwebdesign.eu\/webdesign\/wp-content\/uploads\/2016\/05\/multimediaweb1.png\",\"width\":200,\"height\":57,\"caption\":\"Multimedia Web\"},\"image\":{\"@id\":\"https:\/\/www.nycwebdesign.eu\/webdesign\/#\/schema\/logo\/image\/\"}},{\"@type\":\"Person\",\"@id\":\"https:\/\/www.nycwebdesign.eu\/webdesign\/#\/schema\/person\/c0748e23499fac2fd73b79d1379fdf42\",\"name\":\"admin\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"it-IT\",\"@id\":\"https:\/\/www.nycwebdesign.eu\/webdesign\/#\/schema\/person\/image\/\",\"url\":\"https:\/\/secure.gravatar.com\/avatar\/991cd68bbfd6f946517378a63fc3a1f7?s=96&d=mm&r=g\",\"contentUrl\":\"https:\/\/secure.gravatar.com\/avatar\/991cd68bbfd6f946517378a63fc3a1f7?s=96&d=mm&r=g\",\"caption\":\"admin\"}}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Espressioni regolari facili in JavaScript con Super Expressive - AGENZIA WEB Italia","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/www.nycwebdesign.eu\/webdesign\/espressioni-regolari-facili-in-javascript-con-super-expressive\/","og_locale":"it_IT","og_type":"article","og_title":"Espressioni regolari facili in JavaScript con Super Expressive - AGENZIA WEB Italia","og_description":"Quando si ha a che fare con la manipolazione di stringhe, ad esempio per estrarre specifiche informazioni partendo dalla conoscenza di una particolare struttura della stringa stessa, non si pu\u00f2 fare a meno dell\u2019uso delle espressioni regolari. Non a caso, la stragrande maggioranza dei linguaggi di programmazione spesso le supporta nativamente. E JavaScript non fa...","og_url":"https:\/\/www.nycwebdesign.eu\/webdesign\/espressioni-regolari-facili-in-javascript-con-super-expressive\/","og_site_name":"AGENZIA WEB Italia","article_published_time":"2020-07-26T05:02:05+00:00","author":"admin","twitter_card":"summary_large_image","twitter_misc":{"Scritto da":"admin","Tempo di lettura stimato":"2 minuti"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/www.nycwebdesign.eu\/webdesign\/espressioni-regolari-facili-in-javascript-con-super-expressive\/#article","isPartOf":{"@id":"https:\/\/www.nycwebdesign.eu\/webdesign\/espressioni-regolari-facili-in-javascript-con-super-expressive\/"},"author":{"name":"admin","@id":"https:\/\/www.nycwebdesign.eu\/webdesign\/#\/schema\/person\/c0748e23499fac2fd73b79d1379fdf42"},"headline":"Espressioni regolari facili in JavaScript con Super Expressive","datePublished":"2020-07-26T05:02:05+00:00","dateModified":"2020-07-26T05:02:05+00:00","mainEntityOfPage":{"@id":"https:\/\/www.nycwebdesign.eu\/webdesign\/espressioni-regolari-facili-in-javascript-con-super-expressive\/"},"wordCount":454,"publisher":{"@id":"https:\/\/www.nycwebdesign.eu\/webdesign\/#organization"},"articleSection":["News"],"inLanguage":"it-IT"},{"@type":"WebPage","@id":"https:\/\/www.nycwebdesign.eu\/webdesign\/espressioni-regolari-facili-in-javascript-con-super-expressive\/","url":"https:\/\/www.nycwebdesign.eu\/webdesign\/espressioni-regolari-facili-in-javascript-con-super-expressive\/","name":"Espressioni regolari facili in JavaScript con Super Expressive - AGENZIA WEB Italia","isPartOf":{"@id":"https:\/\/www.nycwebdesign.eu\/webdesign\/#website"},"datePublished":"2020-07-26T05:02:05+00:00","dateModified":"2020-07-26T05:02:05+00:00","breadcrumb":{"@id":"https:\/\/www.nycwebdesign.eu\/webdesign\/espressioni-regolari-facili-in-javascript-con-super-expressive\/#breadcrumb"},"inLanguage":"it-IT","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.nycwebdesign.eu\/webdesign\/espressioni-regolari-facili-in-javascript-con-super-expressive\/"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/www.nycwebdesign.eu\/webdesign\/espressioni-regolari-facili-in-javascript-con-super-expressive\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/www.nycwebdesign.eu\/webdesign\/"},{"@type":"ListItem","position":2,"name":"Espressioni regolari facili in JavaScript con Super Expressive"}]},{"@type":"WebSite","@id":"https:\/\/www.nycwebdesign.eu\/webdesign\/#website","url":"https:\/\/www.nycwebdesign.eu\/webdesign\/","name":"AGENZIA WEB Italia","description":"Web design Web agency Italia","publisher":{"@id":"https:\/\/www.nycwebdesign.eu\/webdesign\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/www.nycwebdesign.eu\/webdesign\/?s={search_term_string}"},"query-input":"required name=search_term_string"}],"inLanguage":"it-IT"},{"@type":"Organization","@id":"https:\/\/www.nycwebdesign.eu\/webdesign\/#organization","name":"Multimedia Web","url":"https:\/\/www.nycwebdesign.eu\/webdesign\/","logo":{"@type":"ImageObject","inLanguage":"it-IT","@id":"https:\/\/www.nycwebdesign.eu\/webdesign\/#\/schema\/logo\/image\/","url":"https:\/\/www.nycwebdesign.eu\/webdesign\/wp-content\/uploads\/2016\/05\/multimediaweb1.png","contentUrl":"https:\/\/www.nycwebdesign.eu\/webdesign\/wp-content\/uploads\/2016\/05\/multimediaweb1.png","width":200,"height":57,"caption":"Multimedia Web"},"image":{"@id":"https:\/\/www.nycwebdesign.eu\/webdesign\/#\/schema\/logo\/image\/"}},{"@type":"Person","@id":"https:\/\/www.nycwebdesign.eu\/webdesign\/#\/schema\/person\/c0748e23499fac2fd73b79d1379fdf42","name":"admin","image":{"@type":"ImageObject","inLanguage":"it-IT","@id":"https:\/\/www.nycwebdesign.eu\/webdesign\/#\/schema\/person\/image\/","url":"https:\/\/secure.gravatar.com\/avatar\/991cd68bbfd6f946517378a63fc3a1f7?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/991cd68bbfd6f946517378a63fc3a1f7?s=96&d=mm&r=g","caption":"admin"}}]}},"_links":{"self":[{"href":"https:\/\/www.nycwebdesign.eu\/webdesign\/wp-json\/wp\/v2\/posts\/22289"}],"collection":[{"href":"https:\/\/www.nycwebdesign.eu\/webdesign\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.nycwebdesign.eu\/webdesign\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.nycwebdesign.eu\/webdesign\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.nycwebdesign.eu\/webdesign\/wp-json\/wp\/v2\/comments?post=22289"}],"version-history":[{"count":0,"href":"https:\/\/www.nycwebdesign.eu\/webdesign\/wp-json\/wp\/v2\/posts\/22289\/revisions"}],"wp:attachment":[{"href":"https:\/\/www.nycwebdesign.eu\/webdesign\/wp-json\/wp\/v2\/media?parent=22289"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.nycwebdesign.eu\/webdesign\/wp-json\/wp\/v2\/categories?post=22289"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.nycwebdesign.eu\/webdesign\/wp-json\/wp\/v2\/tags?post=22289"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}