Come rimuovere una coppia chiave-valore dall'oggetto JavaScript?
L'oggetto JavaScript è una potente struttura dati che combina chiavi E valori . A volte, dobbiamo eliminare un valore-chiave specifico da un oggetto. Può essere fatto utilizzando gli approcci indicati di seguito.
Come rimuovere un valore-chiave dall'oggetto JavaScript?
Esistono diversi metodi che possono essere utilizzati per rimuovere una chiave da un oggetto JavaScript:
Tabella dei contenuti
- Utilizzando i metodi reduce() e filter()
- Utilizzando l'operatore delete
- Destrutturare con l'Operatore del Riposo
- Utilizzando Object.assign()
- Utilizzo di Object.fromEntries() e Object.entries()
- Utilizzando il metodo _.omit della libreria Underscore.js
- Caso d'uso di Rimuovere una chiave dall'oggetto JavaScript
1. Utilizzando i metodi reduce() e filter()
IL ridurre() e il filtro() i metodi di JavaScript possono essere utilizzati insieme per rimuovere una chiave da un oggetto JavaScript.
Sintassi del metodo reduce() e filter():
Object.keys(object_name).filter(()=>{}).reduce(()=>{}); Esempio:
L'esempio di codice seguente implementa insieme i metodi filter e reduce per rimuovere la chiave da un oggetto.
Javascript let details = { name: 'Alex', age: 30, country: 'Canada' }; console.log('Original Object: ', details); details = Object.keys(details).filter(objKey =>objKey !== 'età').reduce((nuovoObj, chiave) => { nuovoObj[chiave] = dettagli[chiave]; return nuovoObj; }, {} ); console.log(dettagli); Produzione
Original Object: { name: 'Alex', age: 30, country: 'Canada' } { name: 'Alex', country: 'Canada' } Spiegazione :
- L'originale
details>l'oggetto contiene proprietà per nome, età e paese. - IL
Object.keys(details)>restituisce un array contenente le chiavi deldetails>oggetto. - IL
.filter()>Il metodo filtra la proprietà age dall'array di chiavi. - IL
.reduce()>Il metodo crea un nuovo oggetto (newObj>) eseguendo un'iterazione sulle chiavi filtrate e assegnandole al nuovo oggetto. - Infine, il nuovo oggetto senza la proprietà age viene assegnato nuovamente al file
details>variabile e viene registrato sulla console.
2. Utilizzo dell'operatore delete
IL operatore cancella in JavaScript può essere utilizzato per rimuovere una proprietà (coppia chiave-valore) da un oggetto.
Sintassi dell'operatore delete:
delete objectName.propertyName;
Esempio:
Il codice seguente rimuove la chiave 'età' dall'oggetto, lasciando solo le chiavi 'nome' e 'paese' nell'oggetto.
Javascript const details = { name: 'Alex', age: 30, country: 'Canada' }; console.log('Original Object:', details); delete details.age; console.log('Object after deleting age key:', details); Produzione
Original Object: { name: 'Alex', age: 30, country: 'Canada' } Object after deleting age key: { name: 'Alex', country: 'Canada' } Spiegazione :
- L'originale
details>l'oggetto contiene proprietà per nome, età e paese. - IL
delete>viene utilizzato per rimuovere la proprietà age dal filedetails>oggetto. - Dopo aver eliminato la proprietà age, il file modificato
details>l'oggetto viene registrato sulla console.
3. Destrutturazione con l'Operatore del Riposo
Destrutturante un oggetto che utilizza l'operatore rest crea un nuovo oggetto senza una proprietà specificata, mantenendo le proprietà rimanenti dell'oggetto originale.
Sintassi per distruggere con l'operatore rest:
const { propertyToRemove, ...rest } = objectName; Esempio:
Il codice seguente utilizza la sintassi di destrutturazione per rimuovere le chiavi da un oggetto in JavaScript.
Javascript const details = { name: 'Alex', age: 30, country: 'Canada' }; console.log('orignal object', details) // after using destructuring and rest operator const { age, ...rest } = details; console.log(rest); Produzione
orignal object { name: 'Alex', age: 30, country: 'Canada' } { name: 'Alex', country: 'Canada' } Spiegazione :
- L'originale
details>l'oggetto contiene proprietà per nome, età e paese. - L'incarico destrutturante
{ age, ...rest } = details;>estrae la proprietà age dadetails>oggetto e lo assegna aage>variabile. Il resto delle proprietà vengono raccolte in un nuovo oggetto chiamatorest>. - Di conseguenza, il
rest>L'oggetto contiene tutte le proprietà dell'originaledetails>oggetto ad eccezione della proprietà age. - IL
rest>l'oggetto viene quindi registrato nella console, mostrando l'oggetto senza la proprietà age.
4. Utilizzo di Object.assign()
Utilizzando Oggetto.assign() ti consente di creare un nuovo oggetto senza una proprietà specificata copiando tutte le proprietà tranne quella che desideri rimuovere.
Sintassi di object.assign():
const { age, ...rest } = Object.assign({}, details); Esempio:
Il codice seguente implementa il metodo Object.assign() per rimuovere la proprietà da un oggetto.
Javascript const details = { name: 'Alex', age: 30, country: 'Canada' }; console.log('orignal object', details) const { age, ...rest } = Object.assign({}, details); console.log(rest); Produzione
orignal object { name: 'Alex', age: 30, country: 'Canada' } { name: 'Alex', country: 'Canada' } Spiegazione :
- IL
Object.assign({}, details)>Il metodo crea una copia superficiale del filedetails>oggetto. Ciò impedisce la modifica dell'originaledetails>oggetto. - Quindi, la destrutturazione dell'oggetto viene utilizzata per estrarre la proprietà age dall'oggetto copiato e assegnarla al file
age>variabile. Il resto delle proprietà vengono raccolte in un nuovo oggetto chiamatorest>. - Di conseguenza, il
rest>L'oggetto contiene tutte le proprietà dell'originaledetails>oggetto ad eccezione della proprietà age. - IL
rest>l'oggetto viene quindi registrato nella console, mostrando l'oggetto senza la proprietà age.
5. Utilizzo di Object.fromEntries() e Object.entries()
IL Object.entries() verrà utilizzato per convertire l'oggetto in un array di coppie chiave-valore. Quindi usiamo Array.filtro() per escludere la coppia chiave-valore con la chiave specificata. Infine, utilizziamo Object.fromEntries() per riconvertire l'array filtrato in un oggetto.
Esempio:
Il codice seguente implementa i metodi sopra indicati per rimuovere la chiave da un oggetto in JavaScript.
Javascript const details = { name: 'Alex', age: 30, country: 'Canada' }; const { age, ...rest } = Object.fromEntries( Object.entries(details).filter(([key]) =>chiave !== 'età')); console.log(resto); Produzione
{ name: 'Alex', country: 'Canada' } Spiegazione:
-
Object.entries(details)>converte ildetails>oggetto in un array di coppie chiave-valore. -
.filter(([key]) =>chiave !== 'età')>filtra le coppie chiave-valore in cui la chiave non è uguale a 'età', rimuovendo di fatto la proprietà età. -
Object.fromEntries()>riconverte l'array filtrato di coppie chiave-valore in un oggetto. - Infine, la destrutturazione dell'oggetto viene utilizzata per estrarre la proprietà age dal risultato, che viene assegnata a
age>variabile, mentre il resto delle proprietà vengono raccolte in un nuovo oggetto chiamatorest>. - IL
rest>l'oggetto viene quindi registrato nella console, mostrando l'oggetto senza la proprietà age.
6. Utilizzo del metodo _.omit della libreria Underscore.js per rimuovere una chiave dall'oggetto
IL trattino basso.js è una libreria JavaScript che può essere inclusa in un documento HTML tramite il suo collegamento CDN e quindi puoi utilizzare le sue funzioni integrate.
Sintassi del metodo _.omit della libreria Underscore.js:
objName = _.omit(objName, 'ketToRemove');
Esempio:
Il codice seguente spiegherà l'uso di _.omettere() funzione per rimuovere una chiave dall'oggetto JavaScript.
HTML Rimuovi la chiave dal titolo dell'oggetto JavaScript> head> <body> <script src= 'https://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.13.6/underscore-min.js' integrity= 'sha512-2V49R8ndaagCOnwmj8QnbT1Gz/rie17UouD9Re5WxbzRVUGoftCu5IuqqtAM9+UC3fwfHCSJR1hkzNQh/2wdtg==' crossorigin='anonymous' referrerpolicy='no-referrer'>copione> <script>let dettagli = { nome: 'Alex', età: 30, paese: 'Canada' }; console.log('Oggetto prima della rimozione: ', dettagli); dettagli = _.omit(dettagli, 'età'); console.log('Oggetto dopo la rimozione: ', dettagli); script> corpo> html> </pre> </code> <p dir='ltr'> <b> <strong>Produzione: </strong> </b> </p> <p dir='ltr'> <img src='//techcodeview.com/img/javascript-object/32/how-remove-key-value-pair-from-javascript-object-2.webp' alt='produzione'> </p> <p dir='ltr'> <b> <strong>Spiegazione </strong> </b> <span>: </span> </p> <ul> <li value='1'> <span>La libreria Underscore.js è inclusa nel file HTML utilizzando un tag script. </span> </li> <li value='2'> <span>All'interno del tag script, un oggetto denominato </span> <code>details> </code> <span>è definito con proprietà per nome, età e paese. </span> </li> <li value='3'> <span>IL </span> <code>_.omit()> </code> <span>La funzione di Underscore.js viene utilizzata per rimuovere la chiave 'età' dal file </span> <code>details> </code> <span>oggetto. </span> </li> <li value='4'> <span>IL </span> <code>console.log()> </code> <span>le istruzioni vengono utilizzate per stampare l'oggetto prima e dopo la rimozione della chiave 'age'. </span> </li> </ul> <h2 id='usecase-of-remove-a-key-from-javascript-object'> <span>Caso d'uso di Rimuovere una chiave dall'oggetto JavaScript </span> </h2> <h3> <span>1. </span> <span>Metodo JavaScript Object keys() </span> </h3> <p dir='ltr'> <span>IL </span> <b> <code> Object.keys()> </code> </b> <b> <strong>metodo </strong> </b> <span>in JavaScript viene utilizzato per recuperare un array di nomi di proprietà enumerabili di un oggetto. Restituisce un array contenente le chiavi dell'oggetto. </span> </p> <h3> <span>2. </span> <span>Come rimuovere l'oggetto dalla serie di oggetti utilizzando JavaScript? </span> </h3> <p dir='ltr'> <span>Esistono due approcci per risolvere questo problema che vengono discussi di seguito: </span> </p> <ul> <li value='1'> <span>Utilizzando il metodo array.forEach() </span> </li> <li value='2'> <span>Utilizzando il metodo array.map() </span> </li> </ul> <h3> <span>3. </span> <span>Come aggiungere e rimuovere proprietà dagli oggetti in JavaScript? </span> </h3> <ul> <li value='1'> <span>Per aggiungere qualsiasi proprietà, è possibile utilizzare </span> <i> <em>nome_oggetto.nome_proprietà = valore </em> </i> <b> <strong> </strong> </b> <span>(O) </span> <i> <em>nome_oggetto[nome_proprietà] = valore </em> </i> <span>. </span> </li> <li value='2'> <span>Per eliminare qualsiasi proprietà, è possibile utilizzare facilmente </span> <i> <em>elimina nome_oggetto.nome_proprietà ( </em> </i> <span>O) </span> <i> <em>elimina nome_oggetto[nome_proprietà] </em> </i> <span>. </span> </li> </ul> <p dir='ltr'> <br> </p> <br> <br>
</div>
<!-- Article Footer with Prominent Share Buttons -->
<div class="px-6 md:px-8 py-8 bg-slate-50 dark:bg-slate-900/50 border-t border-slate-200 dark:border-slate-700/50">
<div class="flex flex-col sm:flex-row items-center justify-between gap-6">
<h4 class="text-base font-bold text-slate-700 dark:text-slate-300 uppercase tracking-wide flex items-center gap-2">
<i class="fa fa-share-alt text-tech-500"> </i>
Condividere </h4>
<div class="flex flex-wrap justify-center gap-3">
<!-- Twitter -->
<a href="https://twitter.com/intent/tweet?text=Come rimuovere una coppia chiave-valore dall'oggetto JavaScript?&url=https://www.techcodeview.com/it/how-remove-key-value-pair-from-javascript-object"
target="_blank" rel="noopener noreferrer"
class="flex items-center gap-2 px-6 py-3 rounded-xl bg-[#1DA1F2]/10 text-[#1DA1F2] hover:bg-[#1DA1F2] hover:text-white transition-all duration-300 font-bold text-sm">
<i class="fa fa-twitter text-lg"> </i>
<span class="hidden sm:inline">Twitter </span>
</a>
<!-- Facebook -->
<a href="https://www.facebook.com/sharer/sharer.php?u=https://www.techcodeview.com/it/how-remove-key-value-pair-from-javascript-object"
target="_blank" rel="noopener noreferrer"
class="flex items-center gap-2 px-6 py-3 rounded-xl bg-[#4267B2]/10 text-[#4267B2] hover:bg-[#4267B2] hover:text-white transition-all duration-300 font-bold text-sm">
<i class="fa fa-facebook text-lg"> </i>
<span class="hidden sm:inline">Facebook </span>
</a>
<!-- LinkedIn -->
<a href="https://www.linkedin.com/shareArticle?mini=true&url=https://www.techcodeview.com/it/how-remove-key-value-pair-from-javascript-object&title=Come rimuovere una coppia chiave-valore dall'oggetto JavaScript?"
target="_blank" rel="noopener noreferrer"
class="flex items-center gap-2 px-6 py-3 rounded-xl bg-[#0077b5]/10 text-[#0077b5] hover:bg-[#0077b5] hover:text-white transition-all duration-300 font-bold text-sm">
<i class="fa fa-linkedin text-lg"> </i>
<span class="hidden sm:inline">LinkedIn </span>
</a>
</div>
</div>
</div>
</article>
<!-- Comments Placeholder / Random Articles -->
<div class="mt-8 bg-white dark:bg-slate-800 border border-slate-200 dark:border-slate-700 rounded-xl p-6 md:p-8 shadow-sm">
<h3 class="text-xl font-bold text-slate-900 dark:text-white mb-6 uppercase tracking-wide border-b border-slate-200 dark:border-slate-700 pb-2">
Potrebbe Piacerti </h3>
<div class="grid grid-cols-1 md:grid-cols-2 gap-6">
<div class="group">
<a href="/it/informatica-etl" class="block aspect-video rounded-lg overflow-hidden bg-slate-200 dark:bg-slate-700 mb-3">
<img loading="lazy" src="https://techcodeview.com/img/informatica-tutorial/03/informatica-etl.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="InformaticaETL" class="w-full h-full object-cover group-hover:scale-105 transition-transform duration-500">
</a>
<h4 class="font-bold text-slate-900 dark:text-white leading-tight group-hover:text-tech-500 transition-colors">
<a href="/it/informatica-etl">InformaticaETL </a>
</h4>
</div> <div class="group">
<a href="/it/dataframe-to_excel-method-pandas" class="block aspect-video rounded-lg overflow-hidden bg-slate-200 dark:bg-slate-700 mb-3">
<img loading="lazy" src="https://techcodeview.com/img/python-pandas-dataframe/67/dataframe-to_excel-method-pandas.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="Metodo DataFrame.to_excel() in Panda" class="w-full h-full object-cover group-hover:scale-105 transition-transform duration-500">
</a>
<h4 class="font-bold text-slate-900 dark:text-white leading-tight group-hover:text-tech-500 transition-colors">
<a href="/it/dataframe-to_excel-method-pandas">Metodo DataFrame.to_excel() in Panda </a>
</h4>
</div>
</div>
</div>
</div>
<!-- SECONDARY COLUMN (SIDEBAR) -->
<!-- Aside Column -->
<div class="lg:col-span-4 space-y-8">
<!-- Best Articles Widget -->
<div class="rounded-xl bg-white dark:bg-slate-800 border border-slate-200 dark:border-slate-700 p-6 shadow-sm">
<div class="mb-4 border-b border-slate-100 dark:border-slate-700 pb-2">
<h2 class="text-lg font-bold text-slate-900 dark:text-white uppercase tracking-wide flex items-center">
<span class="mr-2 h-2 w-2 rounded-full bg-tech-500"> </span>
Articoli Più </h2>
</div>
<!-- Owl Carousel Preserved Container -->
<div id="owl-carousel-3" class="owl-carousel owl-theme center-owl-nav">
<!-- ARTICLE -->
<article class="flex items-start gap-4 p-2 hover:bg-slate-50 dark:hover:bg-slate-700/50 rounded-lg transition-colors">
<div class="w-20 h-20 shrink-0 overflow-hidden rounded-md bg-slate-200 dark:bg-slate-700">
<a href="/it/adversarial-search">
<img src="https://techcodeview.com/img/artificial-intelligence/51/adversarial-search.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="Ricerca contraddittoria" class="w-full h-full object-cover">
</a>
</div>
<div class="flex-1 min-w-0">
<h4 class="text-sm font-semibold text-slate-800 dark:text-slate-200 leading-snug">
<a href="/it/adversarial-search" class="hover:text-tech-500 transition-colors line-clamp-3">Ricerca contraddittoria </a>
</h4>
</div>
</article>
<!-- /ARTICLE --> <!-- ARTICLE -->
<article class="flex items-start gap-4 p-2 hover:bg-slate-50 dark:hover:bg-slate-700/50 rounded-lg transition-colors">
<div class="w-20 h-20 shrink-0 overflow-hidden rounded-md bg-slate-200 dark:bg-slate-700">
<a href="/it/string-int-java">
<img src="https://techcodeview.com/img/java-functions/81/string-int-java.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="Stringa su int in Java" class="w-full h-full object-cover">
</a>
</div>
<div class="flex-1 min-w-0">
<h4 class="text-sm font-semibold text-slate-800 dark:text-slate-200 leading-snug">
<a href="/it/string-int-java" class="hover:text-tech-500 transition-colors line-clamp-3">Stringa su int in Java </a>
</h4>
</div>
</article>
<!-- /ARTICLE --> <!-- ARTICLE -->
<article class="flex items-start gap-4 p-2 hover:bg-slate-50 dark:hover:bg-slate-700/50 rounded-lg transition-colors">
<div class="w-20 h-20 shrink-0 overflow-hidden rounded-md bg-slate-200 dark:bg-slate-700">
<a href="/it/top-50-java-project-ideas">
<img src="https://techcodeview.com/img/it-problems-solutions/86/top-50-java-project-ideas.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="Le 50 migliori idee di progetti Java per principianti e avanzati" class="w-full h-full object-cover">
</a>
</div>
<div class="flex-1 min-w-0">
<h4 class="text-sm font-semibold text-slate-800 dark:text-slate-200 leading-snug">
<a href="/it/top-50-java-project-ideas" class="hover:text-tech-500 transition-colors line-clamp-3">Le 50 migliori idee di progetti Java per principianti e avanzati </a>
</h4>
</div>
</article>
<!-- /ARTICLE --> <!-- ARTICLE -->
<article class="flex items-start gap-4 p-2 hover:bg-slate-50 dark:hover:bg-slate-700/50 rounded-lg transition-colors">
<div class="w-20 h-20 shrink-0 overflow-hidden rounded-md bg-slate-200 dark:bg-slate-700">
<a href="/it/143-most-important-quotes-great-gatsby-131710">
<img src="https://techcodeview.com/img/blog/82/143-most-important-quotes-great-gatsby.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="Le 143 citazioni più importanti de Il grande Gatsby analizzate" class="w-full h-full object-cover">
</a>
</div>
<div class="flex-1 min-w-0">
<h4 class="text-sm font-semibold text-slate-800 dark:text-slate-200 leading-snug">
<a href="/it/143-most-important-quotes-great-gatsby-131710" class="hover:text-tech-500 transition-colors line-clamp-3">Le 143 citazioni più importanti de Il grande Gatsby analizzate </a>
</h4>
</div>
</article>
<!-- /ARTICLE --> <!-- ARTICLE -->
<article class="flex items-start gap-4 p-2 hover:bg-slate-50 dark:hover:bg-slate-700/50 rounded-lg transition-colors">
<div class="w-20 h-20 shrink-0 overflow-hidden rounded-md bg-slate-200 dark:bg-slate-700">
<a href="/it/why-does-windows-restart-without-warning">
<img src="https://techcodeview.com/img/computer/91/why-does-windows-restart-without-warning.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="Perché Windows si riavvia senza preavviso?" class="w-full h-full object-cover">
</a>
</div>
<div class="flex-1 min-w-0">
<h4 class="text-sm font-semibold text-slate-800 dark:text-slate-200 leading-snug">
<a href="/it/why-does-windows-restart-without-warning" class="hover:text-tech-500 transition-colors line-clamp-3">Perché Windows si riavvia senza preavviso? </a>
</h4>
</div>
</article>
<!-- /ARTICLE --> <!-- ARTICLE -->
<article class="flex items-start gap-4 p-2 hover:bg-slate-50 dark:hover:bg-slate-700/50 rounded-lg transition-colors">
<div class="w-20 h-20 shrink-0 overflow-hidden rounded-md bg-slate-200 dark:bg-slate-700">
<a href="/it/30-oops-interview-questions">
<img src="https://techcodeview.com/img/interview-preparation/52/30-oops-interview-questions.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="30 domande e risposte all'intervista OOP (2024)" class="w-full h-full object-cover">
</a>
</div>
<div class="flex-1 min-w-0">
<h4 class="text-sm font-semibold text-slate-800 dark:text-slate-200 leading-snug">
<a href="/it/30-oops-interview-questions" class="hover:text-tech-500 transition-colors line-clamp-3">30 domande e risposte all'intervista OOP (2024) </a>
</h4>
</div>
</article>
<!-- /ARTICLE --> <!-- ARTICLE -->
<article class="flex items-start gap-4 p-2 hover:bg-slate-50 dark:hover:bg-slate-700/50 rounded-lg transition-colors">
<div class="w-20 h-20 shrink-0 overflow-hidden rounded-md bg-slate-200 dark:bg-slate-700">
<a href="/it/binomial-random-variables">
<img src="https://techcodeview.com/img/mathematical/72/binomial-random-variables.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="Variabili casuali binomiali" class="w-full h-full object-cover">
</a>
</div>
<div class="flex-1 min-w-0">
<h4 class="text-sm font-semibold text-slate-800 dark:text-slate-200 leading-snug">
<a href="/it/binomial-random-variables" class="hover:text-tech-500 transition-colors line-clamp-3">Variabili casuali binomiali </a>
</h4>
</div>
</article>
<!-- /ARTICLE --> <!-- ARTICLE -->
<article class="flex items-start gap-4 p-2 hover:bg-slate-50 dark:hover:bg-slate-700/50 rounded-lg transition-colors">
<div class="w-20 h-20 shrink-0 overflow-hidden rounded-md bg-slate-200 dark:bg-slate-700">
<a href="/it/surface-area-cylinder-curved">
<img src="https://techcodeview.com/img/maths-formulas/26/surface-area-cylinder-curved.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="Area superficiale del cilindro | Superficie curva e totale del cilindro" class="w-full h-full object-cover">
</a>
</div>
<div class="flex-1 min-w-0">
<h4 class="text-sm font-semibold text-slate-800 dark:text-slate-200 leading-snug">
<a href="/it/surface-area-cylinder-curved" class="hover:text-tech-500 transition-colors line-clamp-3">Area superficiale del cilindro | Superficie curva e totale del cilindro </a>
</h4>
</div>
</article>
<!-- /ARTICLE --> <!-- ARTICLE -->
<article class="flex items-start gap-4 p-2 hover:bg-slate-50 dark:hover:bg-slate-700/50 rounded-lg transition-colors">
<div class="w-20 h-20 shrink-0 overflow-hidden rounded-md bg-slate-200 dark:bg-slate-700">
<a href="/it/types-statements-java">
<img src="https://techcodeview.com/img/java-tutorial/35/types-statements-java.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="Tipi di istruzioni in Java" class="w-full h-full object-cover">
</a>
</div>
<div class="flex-1 min-w-0">
<h4 class="text-sm font-semibold text-slate-800 dark:text-slate-200 leading-snug">
<a href="/it/types-statements-java" class="hover:text-tech-500 transition-colors line-clamp-3">Tipi di istruzioni in Java </a>
</h4>
</div>
</article>
<!-- /ARTICLE --> <!-- ARTICLE -->
<article class="flex items-start gap-4 p-2 hover:bg-slate-50 dark:hover:bg-slate-700/50 rounded-lg transition-colors">
<div class="w-20 h-20 shrink-0 overflow-hidden rounded-md bg-slate-200 dark:bg-slate-700">
<a href="/it/getelementsbyclassname">
<img src="https://techcodeview.com/img/javascript-tutorial/67/getelementsbyclassname.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="OttieniElementiPerNomeClasse()" class="w-full h-full object-cover">
</a>
</div>
<div class="flex-1 min-w-0">
<h4 class="text-sm font-semibold text-slate-800 dark:text-slate-200 leading-snug">
<a href="/it/getelementsbyclassname" class="hover:text-tech-500 transition-colors line-clamp-3">OttieniElementiPerNomeClasse() </a>
</h4>
</div>
</article>
<!-- /ARTICLE -->
</div>
<!-- Categories -->
<div class="mt-8 mb-4 border-b border-slate-100 dark:border-slate-700 pb-2">
<h2 class="text-lg font-bold text-slate-900 dark:text-white uppercase tracking-wide">Categoria </h2>
</div>
<div class="flex flex-wrap gap-2">
<a href="/it/blog/" class="inline-block px-3 py-1 bg-slate-100 dark:bg-slate-700 text-xs font-medium text-slate-600 dark:text-slate-300 rounded-full hover:bg-tech-500 hover:text-white transition-colors">
Blog
</a> <a href="/it/java-conversion/" class="inline-block px-3 py-1 bg-slate-100 dark:bg-slate-700 text-xs font-medium text-slate-600 dark:text-slate-300 rounded-full hover:bg-tech-500 hover:text-white transition-colors">
Conversione Java
</a> <a href="/it/maths/" class="inline-block px-3 py-1 bg-slate-100 dark:bg-slate-700 text-xs font-medium text-slate-600 dark:text-slate-300 rounded-full hover:bg-tech-500 hover:text-white transition-colors">
Matematica
</a> <a href="/it/java-collections/" class="inline-block px-3 py-1 bg-slate-100 dark:bg-slate-700 text-xs font-medium text-slate-600 dark:text-slate-300 rounded-full hover:bg-tech-500 hover:text-white transition-colors">
Collezioni Java
</a> <a href="/it/differences/" class="inline-block px-3 py-1 bg-slate-100 dark:bg-slate-700 text-xs font-medium text-slate-600 dark:text-slate-300 rounded-full hover:bg-tech-500 hover:text-white transition-colors">
Differenze
</a> <a href="/it/java-string/" class="inline-block px-3 py-1 bg-slate-100 dark:bg-slate-700 text-xs font-medium text-slate-600 dark:text-slate-300 rounded-full hover:bg-tech-500 hover:text-white transition-colors">
Stringa Java
</a>
</div>
<!-- Interesting Articles Widget -->
<div class="mt-8">
<div class="mb-4 border-b border-slate-100 dark:border-slate-700 pb-2">
<h2 class="text-lg font-bold text-slate-900 dark:text-white uppercase tracking-wide">Articoli Interessanti </h2>
</div>
<div id="owl-carousel-4" class="owl-carousel owl-theme">
<!-- ARTICLE -->
<article class="relative aspect-video rounded-lg overflow-hidden group mb-2">
<div class="absolute inset-0">
<img src="https://techcodeview.com/img/category/23/what-is-full-form-supw.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="Qual è la forma completa di SUPW" class="w-full h-full object-cover group-hover:scale-105 transition-transform duration-500">
<div class="absolute inset-0 bg-gradient-to-t from-black/80 to-transparent"> </div>
</div>
<div class="absolute bottom-0 left-0 p-4">
<div class="text-xs text-tech-400 font-bold mb-1"> <a href="/it/category/">Categoria </a> </div>
<h4 class="text-sm font-bold text-white leading-tight"> <a href="/it/what-is-full-form-supw">Qual è la forma completa di SUPW </a> </h4>
</div>
</article>
<!-- /ARTICLE --> <!-- ARTICLE -->
<article class="relative aspect-video rounded-lg overflow-hidden group mb-2">
<div class="absolute inset-0">
<img src="https://techcodeview.com/img/ds-tutorial/41/prims-algorithm.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="Algoritmo di Prim" class="w-full h-full object-cover group-hover:scale-105 transition-transform duration-500">
<div class="absolute inset-0 bg-gradient-to-t from-black/80 to-transparent"> </div>
</div>
<div class="absolute bottom-0 left-0 p-4">
<div class="text-xs text-tech-400 font-bold mb-1"> <a href="/it/ds-tutorial/">Tutorial Ds </a> </div>
<h4 class="text-sm font-bold text-white leading-tight"> <a href="/it/prims-algorithm">Algoritmo di Prim </a> </h4>
</div>
</article>
<!-- /ARTICLE --> <!-- ARTICLE -->
<article class="relative aspect-video rounded-lg overflow-hidden group mb-2">
<div class="absolute inset-0">
<img src="https://techcodeview.com/img/linux-tutorial/06/open-file-linux.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="Apri il file in Linux" class="w-full h-full object-cover group-hover:scale-105 transition-transform duration-500">
<div class="absolute inset-0 bg-gradient-to-t from-black/80 to-transparent"> </div>
</div>
<div class="absolute bottom-0 left-0 p-4">
<div class="text-xs text-tech-400 font-bold mb-1"> <a href="/it/linux-tutorial/">Tutorial Su Linux </a> </div>
<h4 class="text-sm font-bold text-white leading-tight"> <a href="/it/open-file-linux">Apri il file in Linux </a> </h4>
</div>
</article>
<!-- /ARTICLE --> <!-- ARTICLE -->
<article class="relative aspect-video rounded-lg overflow-hidden group mb-2">
<div class="absolute inset-0">
<img src="https://techcodeview.com/img/java-awt-events/78/java-awt-tutorial.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="Esercitazione Java AWT" class="w-full h-full object-cover group-hover:scale-105 transition-transform duration-500">
<div class="absolute inset-0 bg-gradient-to-t from-black/80 to-transparent"> </div>
</div>
<div class="absolute bottom-0 left-0 p-4">
<div class="text-xs text-tech-400 font-bold mb-1"> <a href="/it/java-awt-events/">Java Awt Ed Eventi </a> </div>
<h4 class="text-sm font-bold text-white leading-tight"> <a href="/it/java-awt-tutorial">Esercitazione Java AWT </a> </h4>
</div>
</article>
<!-- /ARTICLE --> <!-- ARTICLE -->
<article class="relative aspect-video rounded-lg overflow-hidden group mb-2">
<div class="absolute inset-0">
<img src="https://techcodeview.com/img/blog/06/cuny-vs-suny-whats-difference.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="CUNY vs SUNY: qual è la differenza?" class="w-full h-full object-cover group-hover:scale-105 transition-transform duration-500">
<div class="absolute inset-0 bg-gradient-to-t from-black/80 to-transparent"> </div>
</div>
<div class="absolute bottom-0 left-0 p-4">
<div class="text-xs text-tech-400 font-bold mb-1"> <a href="/it/blog/">Blog </a> </div>
<h4 class="text-sm font-bold text-white leading-tight"> <a href="/it/cuny-vs-suny-whats-difference-131198">CUNY vs SUNY: qual è la differenza? </a> </h4>
</div>
</article>
<!-- /ARTICLE --> <!-- ARTICLE -->
<article class="relative aspect-video rounded-lg overflow-hidden group mb-2">
<div class="absolute inset-0">
<img src="https://techcodeview.com/img/asp-net-tutorial/22/asp-net-web-forms.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="Moduli Web ASP.NET" class="w-full h-full object-cover group-hover:scale-105 transition-transform duration-500">
<div class="absolute inset-0 bg-gradient-to-t from-black/80 to-transparent"> </div>
</div>
<div class="absolute bottom-0 left-0 p-4">
<div class="text-xs text-tech-400 font-bold mb-1"> <a href="/it/asp-net-tutorial/">Esercitazione Su Asp.net </a> </div>
<h4 class="text-sm font-bold text-white leading-tight"> <a href="/it/asp-net-web-forms">Moduli Web ASP.NET </a> </h4>
</div>
</article>
<!-- /ARTICLE -->
</div>
</div>
</div>
</div>
<!-- /Aside Column --> </div>
</div>
</div>
<footer class="site-footer">
<div class="container">
<span class="footer-links">
Copyright ©2026 Tutti I Diritti Riservati |
<a href="//www.techcodeview.com/bg/">techcodeview.com </a> |
<a href="/disclaimer" rel="nofollow noopener noreferrer" target="_blank">Disclaimer </a> |
<a href="/about-us" rel="nofollow noopener noreferrer" target="_blank">Chi Siamo </a> |
<a href="/privacy-policy" rel="nofollow noopener noreferrer" target="_blank">Politica Sulla Riservatezza </a>
</span>
</div>
</footer>
<script type="text/javascript" src="https://techcodeview.com/template/assets/plugins/jquery-1.11.3.min.js"> </script>
<script type="text/javascript" src="https://techcodeview.com/template/assets/plugins/bootstrap/js/bootstrap.min.js"> </script>
<script type="text/javascript" src="https://techcodeview.com/template/assets/js/main.js"> </script>
<script src="//cdnjs.cloudflare.com/ajax/libs/highlight.js/11.5.1/highlight.min.js"> </script>
<script>
!function(){"use strict";let t=document.createElement("button");t.id="toTopBtn",t.innerHTML="↑";let e=`
#toTopBtn {
position: fixed; bottom: 25px; right: 25px; z-index: 9999; opacity: 0; visibility: hidden; background-color: #0ea5e9; color: white; border: none; border-radius: 8px; width: 50px; height: 50px; font-size: 24px; cursor: pointer; transition: opacity 0.3s ease-in-out, visibility 0.3s ease-in-out;
}
#toTopBtn:hover { background-color: #0284c7; }
`,i=document.createElement("style");i.type="text/css",i.innerText=e,document.head.appendChild(i),document.body.appendChild(t),window.addEventListener("scroll",()=>{let e=window.scrollY||document.documentElement.scrollTop;e>300?(t.style.opacity="1",t.style.visibility="visible"):(t.style.opacity="0",t.style.visibility="hidden")}),t.addEventListener("click",()=>{window.scrollTo({top:0,behavior:"smooth"})})}();
</script>
</body>
</html>