logo

Cum să eliminați o pereche cheie-valoare din obiectul JavaScript?

Obiectul JavaScript este o structură de date puternică care se combină chei și valorile . Uneori, trebuie să ștergem o anumită valoare-cheie dintr-un obiect. Se poate realiza folosind abordările prezentate mai jos.

eliminați-o-cheie-valoare-din-javascript-obj

Cum să eliminați o cheie-valoare din obiectul JavaScript?

Există mai multe metode care pot fi utilizate pentru a elimina o cheie dintr-un obiect JavaScript:



Cuprins

shreya ghoshal primul soț

1. Folosind metodele reduce() și filter().

The reduce() si filtru() metodele JavaScript pot fi utilizate împreună pentru a elimina o cheie dintr-un obiect JavaScript.

Sintaxa metodei reduce() și filter():

Object.keys(object_name).filter(()=>{}).reduce(()=>{});>

Exemplu:

Exemplul de cod de mai jos implementează metodele de filtru și reducere împreună pentru a elimina cheia dintr-un obiect.

Javascript
let details = {  name: 'Alex',  age: 30,  country: 'Canada' }; console.log('Original Object: ', details); details = Object.keys(details).filter(objKey =>objKey !== 'vârsta').reduce((newObj, key) => { newObj[key] = detalii[key]; return newObj; }, {} ); console.log(detalii);>>>  
Ieșire
Original Object: { name: 'Alex', age: 30, country: 'Canada' } { name: 'Alex', country: 'Canada' }>

Explicaţie :

  • Originaluldetails>obiectul conține proprietăți pentru nume, vârstă și țară.
  • TheObject.keys(details)>metoda returnează o matrice care conține cheile fișieruluidetails>obiect.
  • The.filter()>metoda filtrează proprietatea age din matricea de chei.
  • The.reduce()>metoda creează un nou obiect (newObj>) prin iterarea tastelor filtrate și atribuirea acestora noului obiect.
  • În cele din urmă, noul obiect fără proprietatea age este atribuit înapoi ladetails>variabilă și este conectată la consolă.

2. Folosind operatorul de ștergere

The operator de ștergere în JavaScript poate fi folosit pentru a elimina o proprietate (pereche cheie-valoare) dintr-un obiect.

Sintaxa operatorului de ștergere:

Exemplu:

Codul de mai jos elimină cheia „vârstă” din obiect, lăsând doar cheile „nume” și „țară” în obiect.

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);>

Ieșire
Original Object: { name: 'Alex', age: 30, country: 'Canada' } Object after deleting age key: { name: 'Alex', country: 'Canada' }>

Explicaţie :

mysql introduceți în
  • Originaluldetails>obiectul conține proprietăți pentru nume, vârstă și țară.
  • Thedelete>operator este folosit pentru a elimina proprietatea age dindetails>obiect.
  • După ștergerea proprietății de vârstă, modificatădetails>obiectul este conectat la consolă.

3. Destructurare cu Operatorul Rest

Destructurarea un obiect folosind operatorul rest creează un nou obiect fără o proprietate specificată, păstrând proprietățile rămase din obiectul original.

Sintaxă pentru distrugerea cu operator rest:

const { propertyToRemove, ...rest } = objectName;>

Exemplu:

Codul de mai jos folosește sintaxa de destructurare pentru a elimina cheile dintr-un obiect în 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);>

Ieșire
orignal object { name: 'Alex', age: 30, country: 'Canada' } { name: 'Alex', country: 'Canada' }>

Explicaţie :

cat de mare este ecranul monitorului meu
  • Originaluldetails>obiectul conține proprietăți pentru nume, vârstă și țară.
  • Misiunea de destructurare{ age, ...rest } = details;>extrage proprietatea de vârstă dindetails>obiect și îl atribuie luiage>variabil. Restul proprietăților sunt colectate într-un nou obiect numitrest>.
  • Drept urmare,rest>obiectul conține toate proprietățile originaluluidetails>obiect cu excepția proprietății de vârstă.
  • Therest>obiectul este apoi conectat la consolă, arătând obiectul fără proprietatea de vârstă.

4. Folosind Object.assign()

Folosind Object.assign() vă permite să creați un obiect nou fără o proprietate specificată prin copierea tuturor proprietăților, cu excepția celei pe care doriți să o eliminați.

Sintaxa obiectului.assign():

const { age, ...rest } = Object.assign({}, details);>

Exemplu:

Codul de mai jos implementează metoda Object.assign() pentru a elimina proprietatea dintr-un obiect.

Javascript
const details = {  name: 'Alex',  age: 30,  country: 'Canada' }; console.log('orignal object', details) const { age, ...rest } = Object.assign({}, details); console.log(rest);>

Ieșire
orignal object { name: 'Alex', age: 30, country: 'Canada' } { name: 'Alex', country: 'Canada' }>

Explicaţie :

matrice de structură în limbajul c
  • TheObject.assign({}, details)>metoda creează o copie superficială adetails>obiect. Acest lucru previne modificarea originaluluidetails>obiect.
  • Apoi, destructurarea obiectelor este utilizată pentru a extrage proprietatea de vârstă din obiectul copiat și a o atribui laage>variabil. Restul proprietăților sunt colectate într-un nou obiect numitrest>.
  • Drept urmare,rest>obiectul conține toate proprietățile originaluluidetails>obiect cu excepția proprietății de vârstă.
  • Therest>obiectul este apoi conectat la consolă, arătând obiectul fără proprietatea de vârstă.

5. Utilizarea Object.fromEntries() și Object.entries()

The Object.entries() va fi folosit pentru a converti obiectul într-o matrice de perechi cheie-valoare. Apoi, folosim Array.filter() pentru a exclude perechea cheie-valoare cu cheia specificată. În cele din urmă, folosim Object.fromEntries() pentru a converti matricea filtrată înapoi într-un obiect.

Exemplu:

Codul de mai jos implementează metodele de mai sus pentru a elimina cheia dintr-un obiect în JavaScript.

Javascript
const details = {  name: 'Alex',  age: 30,  country: 'Canada' }; const { age, ...rest } = Object.fromEntries(  Object.entries(details).filter(([key]) =>cheie !== 'vârsta')); console.log(odihnă);>>>  
Ieșire
{ name: 'Alex', country: 'Canada' }>

Explicaţie:

  • Object.entries(details)>converteștedetails>obiect într-o matrice de perechi cheie-valoare.
  • .filter(([key]) =>cheie !== 'vârsta')>filtrează perechile cheie-valoare în care cheia nu este egală cu „vârsta”, eliminând efectiv proprietatea vârstă.
  • Object.fromEntries()>convertește matricea filtrată de perechi cheie-valoare înapoi într-un obiect.
  • În cele din urmă, destructurarea obiectelor este utilizată pentru a extrage proprietatea de vârstă din rezultat, care este atribuită luiage>variabilă, în timp ce restul proprietăților sunt colectate într-un nou obiect numitrest>.
  • Therest>obiectul este apoi conectat la consolă, arătând obiectul fără proprietatea de vârstă.

6. Folosind metoda _.omit din biblioteca Underscore.js pentru a elimina o cheie din obiect

The underscore.js este o bibliotecă JavaScript care poate fi inclusă într-un document HTML prin link-ul său CDN și apoi vi se permite să utilizați funcțiile sale încorporate.

Sintaxa metodei _.omit a bibliotecii Underscore.js:

Exemplu:

Codul de mai jos va explica utilizarea _.omite() funcție pentru a elimina o cheie din obiectul JavaScript.

HTML
     Eliminați cheia din titlul obiectului 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'>scenariu><script>let details = { nume: 'Alex', vârsta: 30, țara: 'Canada'};  console.log('Obiect înainte de eliminare: ', detalii);  detalii = _.omit(detalii, 'vârsta');  console.log('Obiect după eliminare: ', detalii);  script> body> html>>></pre> </code> <p dir='ltr'>  <b>  <strong>Ieșire:</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="ieșire"></p><blockquote style="text-transform: capitalize;font-size: 20px; padding: 10px;"><a href="/how-play-imessage-games-an-android-phone">jocuri cu mesaje pentru Android</a>
</blockquote> <p dir='ltr'>  <b>  <strong>Explicaţie</strong>  </b>  <span>:</span></p> <ul><li value='1'><span>Biblioteca Underscore.js este inclusă în fișierul HTML folosind o etichetă de script.</span></li><li value='2'><span>În interiorul etichetei de script, un obiect numit</span><code class='hljs'>details></code><span>este definit cu proprietăți pentru nume, vârstă și țară.</span></li><li value='3'><span>The</span><code class='hljs'>_.omit()></code><span>funcția din Underscore.js este folosită pentru a elimina cheia „vârstă” din</span><code class='hljs'>details></code><span>obiect.</span></li><li value='4'><span>The</span><code class='hljs'>console.log()></code><span>instrucțiunile sunt folosite pentru a tipări obiectul înainte și după eliminarea cheii „vârstă”.</span></li></ul><h2 id='usecase-of-remove-a-key-from-javascript-object'><span>UseCase of Elimina o cheie din obiectul JavaScript</span></h2><h3><span>1.</span> <span>Metoda JavaScript Object keys().</span> </h3><p dir='ltr'><span>The</span>  <b><code class='hljs'> Object.keys()></code></b>   <b>  <strong>metodă</strong>  </b>  <span>în JavaScript este folosit pentru a prelua o matrice de nume de proprietăți enumerabile ale unui obiect. Returnează o matrice care conține cheile obiectului.</span></p> <h3><span>2.</span> <span>Cum să eliminați un obiect din matricea de obiecte folosind JavaScript?</span> </h3><p dir='ltr'><span>Există două abordări pentru a rezolva această problemă, care sunt discutate mai jos:</span></p> <ul><li value='1'> <span>Folosind metoda array.forEach().</span> </li><li value='2'> <span>Folosind metoda array.map().</span> </li></ul><h3><span>3.</span> <span>Cum să adăugați și să eliminați proprietăți de la obiecte în JavaScript?</span> </h3><ul><li value='1'><span>Pentru a adăuga orice proprietate, se poate folosi fie</span>  <i>  <em>object_name.property_name = valoare</em>  </i>   <b>  <strong> </strong>  </b>  <span>(sau)</span>  <i>  <em>nume_obiect[nume_proprietate] = valoare</em>  </i>  <span>.</span></li><li value='2'><span>Pentru a șterge orice proprietate, s-ar putea folosi cu ușurință</span>  <i>  <em>delete object_name.property_name (</em>  </i>  <span>sau)</span>  <i>  <em>șterge nume_obiect[nume_proprietate]</em>  </i>  <span>.</span></li></ul><p dir='ltr'>  <br></p>  <br>  <br></article><div class="rekl_placeholder"><script type="text/javascript">atOptions = {'key' : 'f2b09f3e7178b263531e10998e9a32fa','format' : 'iframe','height' : 250,'width' : 300,'params' : {}};</script><script type="text/javascript" src="//spiritscaution.com/f2b09f3e7178b263531e10998e9a32fa/invoke.js"></script></div> </article>
                         
                        </div><!--//content-->
                    </div><!--//section-inner-->                 
                </section><!--//section-->
    
            </div><!--//primary-->
            <div class="secondary col-md-4 col-sm-12 col-xs-12">
                  <aside class="info aside section">
                    <div class="section-inner">
                        <h2 class="">Categorie</h2>
                        <div class="content">
                            <ul class="list-unstyled">
                                <li> <a href="/mst/">Mst</a> </li><li> <a href="/web-scraping/">Web-Scraping</a> </li><li> <a href="/ascii/">Ascii</a> </li><li> <a href="/node-js-misc/">Node.js-Misc</a> </li><li> <a href="/java-multithreading/">Java Multithreading</a> </li><li> <a href="/java-string-programs/">Java-String-Programe</a> </li><li> <a href="/restful/">Odihnitor</a> </li><li> <a href="/chemical-bonding/">Legături Chimice</a> </li><li> <a href="/adobe/">Chirpici</a> </li><li> <a href="/biology-difference-between/">Biologie-Diferenta-Intre</a> </li>
                                
                            </ul>
                        </div><!--//content-->  
                    </div><!--//section-inner-->                 
                </aside><!--//aside-->
                
                 <aside class="testimonials aside section">
                	 <div class="section-inner">
                        <div class="content">
                            <div class="item">
  								<div class="rekl_placeholder" id="sidebar_placeholder_1"> <script type="text/javascript">atOptions = {'key' : 'f53f1abf3c3a788f849c12a956865db1','format' : 'iframe','height' : 300,'width' : 160,'params' : {}};</script><script type="text/javascript" src="//spiritscaution.com/f53f1abf3c3a788f849c12a956865db1/invoke.js"></script> <br></div>                                                   
                            </div>
                        </div>
                    </div>
                   <div class="section-inner">
                        <h2 class="heading">Ce sunt diviziile NCAA? Divizia 1 vs 2 vs 3</h2>
                        <div class="content">
                            <div class="item">
                                 <blockquote class="quote">                                  
                                    <span> <i class="fa fa-quote-left"></i> Care este diferența dintre diviziunile I, II și III NCAA? Câte școli sunt în fiecare și de ce există divizii NCAA? Aflați aici.</span>
                                </blockquote>                
                                                                                             
                            </div><!--//item-->
                            
                            <p> <a class="more-link" href="/what-are-ncaa-divisions-131390"> <i class="fa fa-external-link"></i> Citeşte Mai Mult</a> </p> 
                            
                        </div><!--//content-->
                    </div><!--//section-inner-->
                </aside><!--//section-->
                
               
                            
                 <aside class="languages aside section">
                    <div class="section-inner">
                        <h2 class="heading">Articole Interesante</h2>
                        <div class="content">
                            <ul class="list-unstyled">
                                <li class="item">
                                    <span class="title"> <strong> <a href="/c-math">C Matematică</a> </strong> </span>
                                    
                                </li><!--//item--><li class="item">
                                    <span class="title"> <strong> <a href="/every-ib-math-past-paper-available-1311084">Fiecare lucrare de matematică IB disponibilă: gratuită și oficială</a> </strong> </span>
                                    
                                </li><!--//item--><li class="item">
                                    <span class="title"> <strong> <a href="/stack-vs-queue">Stivă vs. coadă</a> </strong> </span>
                                    
                                </li><!--//item--><li class="item">
                                    <span class="title"> <strong> <a href="/javascript-array-concat-method">Metoda JavaScript Array concat().</a> </strong> </span>
                                    
                                </li><!--//item--><li class="item">
                                    <span class="title"> <strong> <a href="/excel-basics/">Excel-Noțiuni De Bază</a> </strong> </span>
                                    
                                </li><!--//item-->
                               
                            </ul>
                        </div><!--//content-->
                    </div><!--//section-inner-->
                </aside><!--//section-->
                
              
                 <aside class="list music aside section">
                    <div class="section-inner">
                        <h2 class="heading">Posturi Populare</h2>
                        <div class="content">
                            <ul class="list"> <li><a href="/data-structures-java">structuri de date java</a>
</li><li><a href="/multiplexer">multiplexor</a>
</li><li><a href="/k-nearest-neighbor-algorithm">k cel mai apropiat vecin</a>
</li><li><a href="/osi-model">osi model de referință în rețele</a>
</li><li><a href="/how-reverse-string-java">java inversând un șir</a>
</li> 
                                
                                
                            </ul>
                        </div><!--//content-->
                    </div><!--//section-inner-->
                </aside><!--//section-->
              
            </div><!--//secondary-->    
        </div><!--//row-->
    </div><!--//masonry-->
    
	    <footer class="footer">
        <div class="container text-center">
                <span>
Copyright ©2025 Toate Drepturile Rezervate |  <a href="//es.techcodeview.com/">techcodeview.com</a> | <a href="/disclaimer" rel="nofollow noopener noreferrer" target="_blank">Declinare A Răspunderii</a>  |  <a href="/about-us" rel="nofollow noopener noreferrer" target="_blank">Despre Noi</a>  |  <a href="/privacy-policy" rel="nofollow noopener noreferrer" target="_blank">Politica De Confidențialitate</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: #213141;
            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: #555;
        }
    `,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>