logo

Kā noņemt atslēgas vērtību pāri no JavaScript objekta?

JavaScript objekts ir spēcīga datu struktūra, kas apvieno atslēgas un vērtības . Dažreiz mums ir jāizdzēš noteikta atslēgas vērtība no objekta. To var izdarīt, izmantojot tālāk norādītās metodes.

Remove-a-key-value-from-javascript-obj

Kā noņemt atslēgas vērtību no JavaScript objekta?

Ir vairākas metodes, ko var izmantot, lai noņemtu atslēgu no JavaScript objekta:



Satura rādītājs

1. Izmantojot samazināšanas () un filtra () metodes

The samazināt () un filtrs () JavaScript metodes var izmantot kopā, lai noņemtu atslēgu no JavaScript objekta.

Redukcijas () un filtra () metodes sintakse:

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

Piemērs:

Tālāk sniegtajā koda piemērā tiek ieviestas filtra un samazināšanas metodes, lai noņemtu atslēgu no objekta.

Javascript
let details = {  name: 'Alex',  age: 30,  country: 'Canada' }; console.log('Original Object: ', details); details = Object.keys(details).filter(objKey =>objKey !== 'vecums').reduce((newObj, key) => { newObj[key] = details[key]; return newObj; }, {} ); konsole.log(detaļas);>>  
Izvade
Original Object: { name: 'Alex', age: 30, country: 'Canada' } { name: 'Alex', country: 'Canada' }>

Paskaidrojums :

iemet metienus java
  • Oriģinālsdetails>objektā ir rekvizīti vārdam, vecumam un valstij.
  • TheObject.keys(details)>metode atgriež masīvu, kurā ir atslēgasdetails>objektu.
  • The.filter()>metode filtrē vecuma rekvizītu no atslēgu masīva.
  • The.reduce()>metode izveido jaunu objektu (newObj>), atkārtojot filtrētās atslēgas un piešķirot tās jaunajam objektam.
  • Visbeidzot, jaunais objekts bez vecuma rekvizīta tiek piešķirts atpakaļdetails>mainīgais, un tas tiek reģistrēts konsolē.

2. Izmantojot dzēšanas operatoru

The dzēst operatoru JavaScript var izmantot, lai no objekta noņemtu rekvizītu (atslēgas vērtību pāri).

Dzēšanas operatora sintakse:

Piemērs:

Tālāk norādītais kods no objekta noņem atslēgu “vecums”, atstājot objektā tikai atslēgas “nosaukums” un “valsts”.

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

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

Paskaidrojums :

  • Oriģinālsdetails>objektā ir rekvizīti vārdam, vecumam un valstij.
  • Thedelete>operators tiek izmantots, lai noņemtu vecuma rekvizītu nodetails>objektu.
  • Pēc vecuma rekvizīta dzēšanas tiek modificētsdetails>objekts ir reģistrēts konsolē.

3. Destrukturēšana ar atpūtas operatoru

Destrukturēšana objekts, izmantojot operatoru atpūta, izveido jaunu objektu bez noteiktas īpašības, saglabājot atlikušos rekvizītus no sākotnējā objekta.

Sintakse iznīcināšanai ar atpūtas operatoru:

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

Piemērs:

Tālāk norādītajā kodā tiek izmantota destrukturēšanas sintakse, lai noņemtu atslēgas no objekta 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);>

Izvade
orignal object { name: 'Alex', age: 30, country: 'Canada' } { name: 'Alex', country: 'Canada' }>

Paskaidrojums :

  • Oriģinālsdetails>objektā ir rekvizīti vārdam, vecumam un valstij.
  • Iznīcināšanas uzdevums{ age, ...rest } = details;>izvelk vecuma īpašību nodetails>objektu un piešķir toage>mainīgs. Pārējie īpašumi tiek apkopoti jaunā objektā ar nosaukumurest>.
  • Tā rezultātā,rest>objekts satur visas oriģināla īpašībasdetails>objekts, izņemot vecuma īpašumu.
  • Therest>objekts pēc tam tiek reģistrēts konsolē, parādot objektu bez vecuma rekvizīta.

4. Izmantojot Object.assign()

Izmantojot Object.assign() ļauj izveidot jaunu objektu bez norādīta rekvizīta, kopējot visus rekvizītus, izņemot to, kuru vēlaties noņemt.

Objekta object.assign() sintakse:

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

Piemērs:

lejupielādēt youtube vlc multivides atskaņotāju

Tālāk norādītais kods ievieš metodi Object.assign(), lai noņemtu objekta rekvizītu.

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

Izvade
orignal object { name: 'Alex', age: 30, country: 'Canada' } { name: 'Alex', country: 'Canada' }>

Paskaidrojums :

  • TheObject.assign({}, details)>metode rada seklu kopijudetails>objektu. Tas novērš oriģināla modifikācijudetails>objektu.
  • Pēc tam tiek izmantota objekta iznīcināšana, lai no kopētā objekta iegūtu vecuma rekvizītu un piešķirtu to objektamage>mainīgs. Pārējie īpašumi tiek apkopoti jaunā objektā ar nosaukumurest>.
  • Tā rezultātā,rest>objekts satur visas oriģināla īpašībasdetails>objekts, izņemot vecuma īpašumu.
  • Therest>objekts pēc tam tiek reģistrēts konsolē, parādot objektu bez vecuma rekvizīta.

5. Izmantojot Object.fromEntries() un Object.entries()

The Object.entries() tiks izmantots, lai pārvērstu objektu par atslēgu-vērtību pāru masīvu. Tad mēs izmantojam Masīvs.filtrs() lai izslēgtu atslēgas-vērtības pāri ar norādīto atslēgu. Visbeidzot, mēs izmantojam Object.fromEntries(), lai pārveidotu filtrēto masīvu atpakaļ objektā.

Piemērs:

Tālāk norādītais kods ievieš iepriekš minētās metodes, lai noņemtu atslēgu no objekta JavaScript.

Javascript
const details = {  name: 'Alex',  age: 30,  country: 'Canada' }; const { age, ...rest } = Object.fromEntries(  Object.entries(details).filter(([key]) =>atslēga !== 'vecums')); konsole.log(atpūta);>>  
Izvade
{ name: 'Alex', country: 'Canada' }>

Paskaidrojums:

  • Object.entries(details)>pārvēršdetails>objektu atslēgu-vērtību pāru masīvā.
  • .filter(([key]) =>taustiņš !== 'vecums')>filtrē atslēgas vērtību pārus, ja atslēga nav vienāda ar “vecums”, efektīvi noņemot vecuma rekvizītu.
  • Object.fromEntries()>pārvērš filtrēto atslēgu un vērtību pāru masīvu atpakaļ objektā.
  • Visbeidzot, objekta iznīcināšana tiek izmantota, lai no rezultāta iegūtu vecuma īpašību, kas tiek piešķirtaage>mainīgais, bet pārējie rekvizīti tiek apkopoti jaunā objektā, ko saucrest>.
  • Therest>objekts pēc tam tiek reģistrēts konsolē, parādot objektu bez vecuma rekvizīta.

6. Izmantojot Underscore.js bibliotēkas metodi _.omit, lai noņemtu atslēgu no objekta

The pasvītrojums.js ir JavaScript bibliotēka, ko var iekļaut HTML dokumentā, izmantojot tā CDN saiti, un pēc tam jums ir atļauts izmantot tās iebūvētās funkcijas.

Underscore.js bibliotēkas metodes _.omit sintakse:

Piemērs:

Tālāk sniegtais kods izskaidros, kā lietot _.izlaist() funkcija, lai noņemtu atslēgu no JavaScript objekta.

java pupiņas
HTML
     Noņemiet atslēgu no JavaScript objekta virsraksta> 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'>skripts><script>let details = {vārds: 'Alekss', vecums: 30, valsts: 'Kanāda'};  console.log('Objekts pirms noņemšanas: ', detaļas);  detaļas = _.omit(detaļas, 'vecums');  console.log('Objekts pēc noņemšanas: ', detaļas);  skripts> body> html>>></tag> <p dir='ltr'>  <b>  <strong>Izvade:</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="izvade"></p> <p dir='ltr'>  <b>  <strong>Paskaidrojums</strong>  </b>  <span>:</span></p> <ul><li value='1'><span>Underscore.js bibliotēka ir iekļauta HTML failā, izmantojot skripta tagu.</span></li><li value='2'><span>Skripta taga iekšpusē ir objekts ar nosaukumu</span><code class='hljs'>details></pre> </code><span>ir definēts ar vārda, vecuma un valsts rekvizītiem.</span></li><li value='3'><span>The</span><tag data-text-2='_.omit()></code><span>funkcija no Underscore.js tiek izmantota, lai noņemtu vecuma taustiņu no</span><code class='hljs'>details></code><span>objektu.</span></li><li value='4'><span>The</span><code class='hljs'>console.log()></code><span>priekšraksti tiek izmantoti objekta drukāšanai pirms un pēc vecuma atslēgas noņemšanas.</span></li></ul><h2 id='usecase-of-remove-a-key-from-javascript-object'><span>UseCase of Noņemt atslēgu no JavaScript objekta</span></h2><h3><span>1.</span> <span>JavaScript objektu atslēgas() metode</span> </h3><p dir='ltr'><span>The</span>  <b><code class='hljs'> Object.keys()></code></b>   <b>  <strong>metodi</strong>  </b>  <span>JavaScript tiek izmantots, lai izgūtu objekta uzskaitāmo rekvizītu nosaukumu masīvu. Tas atgriež masīvu, kurā ir objekta atslēgas.</span></p> <h3><span>2.</span> <span>Kā noņemt objektu no objektu masīva, izmantojot JavaScript?</span> </h3><p dir='ltr'><span>Šīs problēmas risināšanai ir divas pieejas, kas ir apskatītas tālāk:</span></p> <ul><li value='1'> <span>Izmantojot metodi array.forEach().</span> </li><li value='2'> <span>Izmantojot metodi array.map().</span> </li></ul><h3><span>3.</span> <span>Kā pievienot un noņemt rekvizītus no JavaScript objektiem?</span> </h3><ul><li value='1'><span>Jebkura īpašuma pievienošanai var izmantot vai nu</span>  <i>  <em>objekta_nosaukums.īpašuma_nosaukums = vērtība</em>  </i>   <b>  <strong> </strong>  </b>  <span>(vai)</span>  <i>  <em>objekta_nosaukums[īpašuma_nosaukums] = vērtība</em>  </i>  <span>.</span></li><li value='2'><span>Lai izdzēstu jebkuru īpašumu, to var viegli izmantot</span>  <i>  <em>dzēst objekta_nosaukums.īpašuma_nosaukums (</em>  </i>  <span>vai)</span>  <i>  <em>dzēst objekta_nosaukums[īpašuma_nosaukums]</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="">Kategorija</h2>
                        <div class="content">
                            <ul class="list-unstyled">
                                <li> <a href="/jfreechart-tutorial/">Jfreechart Apmācība</a> </li><li> <a href="/current-gk/">Pašreizējais Gk</a> </li><li> <a href="/top-10-list-world/">Top 10 Saraksts — Pasaule</a> </li><li> <a href="/computer-networks-maq/">Datoru Tīkli-Maq</a> </li><li> <a href="/html-tags/">Html Tagi</a> </li><li> <a href="/pc-tips/">Pc Padomi</a> </li><li> <a href="/automata-tutorial/">Automātiskā Apmācība</a> </li><li> <a href="/python-pil/">Python-Pill</a> </li><li> <a href="/python-list/">Python-List</a> </li><li> <a href="/data-visualization/">Datu Vizualizācija</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">Kā veselu skaitli pārvērst decimāldaļā?</h2>
                        <div class="content">
                            <div class="item">
                                 <blockquote class="quote">                                  
                                    <span> <i class="fa fa-quote-left"></i> Datorzinātņu portāls dīķiem. Tajā ir labi uzrakstīti, pārdomāti un labi izskaidroti raksti par datorzinātnēm un programmēšanu, viktorīnas un prakses/konkurētspējīgas programmēšanas/uzņēmuma intervijas jautājumi.</span>
                                </blockquote>                
                                                                                             
                            </div><!--//item-->
                            
                            <p> <a class="more-link" href="/how-convert-whole-number-into-decimal"> <i class="fa fa-external-link"></i> Lasīt Vairāk</a> </p> 
                            
                        </div><!--//content-->
                    </div><!--//section-inner-->
                </aside><!--//section-->
                
               
                            
                 <aside class="languages aside section">
                    <div class="section-inner">
                        <h2 class="heading">Interesanti Raksti</h2>
                        <div class="content">
                            <ul class="list-unstyled">
                                <li class="item">
                                    <span class="title"> <strong> <a href="/difference-between-mealy-machine">Atšķirība starp Mealy mašīnu un Mūra mašīnu</a> </strong> </span>
                                    
                                </li><!--//item--><li class="item">
                                    <span class="title"> <strong> <a href="/uniform-distribution-formula">Vienotā izplatīšanas formula</a> </strong> </span>
                                    
                                </li><!--//item--><li class="item">
                                    <span class="title"> <strong> <a href="/what-is-trade-school-131296">Kas ir tirdzniecības skola? Kā var pieteikties?</a> </strong> </span>
                                    
                                </li><!--//item--><li class="item">
                                    <span class="title"> <strong> <a href="/write-5-foot-4-inches-cm">Ierakstiet 5 pēdas 4 collas cm</a> </strong> </span>
                                    
                                </li><!--//item--><li class="item">
                                    <span class="title"> <strong> <a href="/java-sqrt-method-with-examples">Java sqrt() metode ar piemēriem</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">Populārākas Posts</h2>
                        <div class="content">
                            <ul class="list"> <li><a href="/java-try-catch-block">mēģināt noķert java</a>
</li><li><a href="/how-iterate-map-java">atkārtojiet, izmantojot karti java</a>
</li><li><a href="/c-functions">funkcijas c</a>
</li><li><a href="/maven-repository">maven krātuve</a>
</li><li><a href="/difference-between-object">klase vs objekts java</a>
</li><li><a href="/typescript-date-object">mašīnrakstā datums un laiks</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 Visas Tiesības Aizsargātas |  <a href="//lt.techcodeview.com/">techcodeview.com</a> | <a href="/disclaimer" rel="nofollow noopener noreferrer" target="_blank">Atruna</a>  |  <a href="/about-us" rel="nofollow noopener noreferrer" target="_blank">Par Mums</a>  |  <a href="/privacy-policy" rel="nofollow noopener noreferrer" target="_blank">Privātuma Politika</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>
	
</body>
</html>