Како уклонити елемент из низа ЈаваСцрипт и израдити чисти код

Често ћете наићи на низове када пишете ЈаваСцрипт код. Како можете уклонити елемент из низа у ЈаваСцрипт-у?

У ЈаваСцрипт-у, низ је тип глобалног објекта који можете користити за складиштење података. Низ у ЈаваСцрипт-у може да садржи листу која садржи нулу или више типова података или уређену колекцију. Да бисмо приступили одређеним ставкама из низа, користимо нумерисане индексе који почињу од 0.

У овом чланку ћу описати синтаксу за креирање низова у ЈаваСцрипт-у, зашто треба уклонити елемент из низа у ЈаваСцрипт-у и различите приступе уклањању елемената из низова у ЈаваСцрипт-у мутирањем или без мутирања оригиналног низа.

Синтакса за ЈаваСцрипт низ

Низови нам омогућавају да складиштимо више вредности у једну променљиву. На пример, ако желимо да представимо седам континената у ЈаваСцрипт-у, можемо имати овај код:

const continent1 = "Asia";
const continent2 = "Africa";
const continent3 = "North America";
const continent4 = "South America";
const continent5 = "Antarctica";
const continent6 = "Europe";
const continent7 = "Australia"

Међутим, можемо сажети овај код и представити га у низу на следећи начин;

 let continents = ['Asia', 'Africa', 'North America', 'South America', 'Antarctica', 'Europe', 'Australia'];

Уместо да имамо 7 променљивих, имамо само једну променљиву и користимо угласте заграде да представимо наше објекте.

Ако желите да приступите првом континенту на нашој листи, можете покренути ову команду; цонсоле.лог(континенти[0])

Можете користити нашу бесплатну онлајн ЈаваСцрипт компајлер да тестирате свој код.

Ево шта добијате:

Ако желите да приступите последњој ставци у нашем низу, покренућете ову команду; цонсоле.лог(континенти[6]).

Имајте на уму да нумерисање у ЈаваСцрипт-у почиње од 0.

Зашто уклонити елемент из ЈаваСцрипт низа?

Можете користити ЈаваСцрипт низове са стринговима, бројевима и различитим структурама података. Међутим, постоје случајеви у којима ћете можда морати да уклоните један или више елемената из низа. Ово су неки од сценарија:

• Руковање динамичким подацима: Можете да складиштите динамичке скупове података у низовима. Можда ћете морати да уклоните елемент/елементе из низа на основу променљивих захтева.
• Одржавајте интегритет података: Можете избрисати/уклонити застареле информације из својих низова како бисте били сигурни да су ваше структуре података ажурне.
• Управљање меморијом: Величина вашег кода утиче на перформансе ваше апликације. Можете уклонити непотребне информације из својих низова и оптимизовати свој код.

Уклоните елементе без мутирања оригиналног низа

Када желите да уклоните елемент без мутирања оригиналног низа, најбоља пракса је да креирате нови низ без елемента који желите да уклоните. Такав приступ се уклапа у низ као параметар функције. Можете користити следеће приступе:

#1. Уклоните елемент помоћу слице()

Можемо уклонити први континент са наше листе помоћу методе слице().

Ово је наш оригинални код:

let continents = ['Asia', 'Africa', 'North America', 'South America', 'Antarctica', 'Europe', 'Australia'];

Направићемо нови низ на следећи начин:

let continents = ['Asia', 'Africa', 'North America', 'South America', 'Antarctica', 'Europe', 'Australia'];
// Remove the first element using slice
let newContinents = continents.slice(1);
If you now run:
console.log(newContinents);

Добићете ово као свој излаз:

[
  'Africa',
  'North America',
  'South America',
  'Antarctica',
  'Europe',
  'Australia'
]

#2. Уклоните први елемент из низа користећи филтер()

Метод филтера креира нови низ где елементи морају проћи одређени услов. Могу да направим услов који искључује први елемент из нашег низа. Ево како то могу постићи:

let continents = ['Asia', 'Africa', 'North America', 'South America', 'Antarctica', 'Europe', 'Australia'];
// Remove the first element using filter() method
let newContinents = continents.filter((continent, index) => index !== 0);
console.log(newContinents);

Ако покренем код, ово ћу добити:

[
  'Africa',
  'North America',
  'South America',
  'Antarctica',
  'Europe',
  'Australia'
]

#3. Користите слице() заједно са цонцат() да уклоните елемент са било које позиције

Наш први пример уклања први елемент са наше листе. Шта ако желимо да уклонимо, рецимо, трећи или четврти елемент из нашег низа? Морамо да комбинујемо слице() са цонцат() методама да би се ово десило. У следећем примеру ћу уклонити четврти елемент на следећи начин:

let continents = ['Asia', 'Africa', 'North America', 'South America', 'Antarctica', 'Europe', 'Australia'];

// Remove the fourth element using slice and concat
let continentsWithoutFourth = continents.slice(0, 3).concat(continents.slice(4));
console.log(continentsWithoutFourth);

Ако покренем код, добијамо ово као излаз:

[
  'Asia',
  'Africa',
  'North America',
  'Antarctica',
  'Europe',
  'Australia'
]

Метода слице() креира два нова пресека. Затим користимо методу цонцат() да комбинујемо два дела, али изостављамо четврти елемент. Овај приступ можете користити са било којим елементом у низу.

#4. Уклоните елемент користећи фор петљу заједно са пусх()

Можемо да изоставимо пети елемент са наше листе користећи фор петљу и метод пусх(). Погледајте овај код:

let continents = ['Asia', 'Africa', 'North America', 'South America', 'Antarctica', 'Europe', 'Australia'];

// Remove the fifth element using a for loop and push
let continentsWithoutFifth = [];
for (let i = 0; i < continents.length; i++) {
  if (i !== 4) {
    continentsWithoutFifth.push(continents[i]);
  }
}
console.log(continentsWithoutFifth);

Петља фор понавља сваки елемент у нашем низу континената. Користимо иф наредбу да проверимо да ли тренутни индекс није једнак четири. Ако је услов тачан, елементи се гурају у нови низ.

Ево шта добијамо када покренете код:

[

  'Asia',
  'Africa',
  'North America',
  'South America',
  'Europe',
  'Australia'
]

Уклоните елементе мутирањем оригиналног низа

Можете да мутирате или промените структуру оригиналног низа уклањањем елемента. Ово су неки од приступа:

#1. Уклоните елемент из низа помоћу поп()

Можете да користите метод поп() да уклоните последњи елемент из нашег низа континената. Наш оригинални код је

let continents = ['Asia', 'Africa', 'North America', 'South America', 'Antarctica', 'Europe', 'Australia'];

Можемо имати овај код да уклонимо последњи елемент:

let continents = ['Asia', 'Africa', 'North America', 'South America', 'Antarctica', 'Europe', 'Australia'];

// Remove the last element using pop
let lastContinent = continents.pop();

Ако покренете:

console.log("Updated Continents Array:", continents);

Ажурирана листа ће бити:

Updated Continents Array: [

  'Asia',
  'Africa',
  'North America',
  'South America',
  'Antarctica',
  'Europe'
]

Такође можете проверити уклоњени елемент користећи овај код:

let continents = ['Asia', 'Africa', 'North America', 'South America', 'Antarctica', 'Europe', 'Australia'];
// Remove the last element using pop
let lastContinent = continents.pop();
console.log("Removed Continent:", lastContinent);

#2. Уклоните елемент из низа помоћу сплице()

Метода сплице () вам омогућава да уклоните елементе из одређеног индекса у вашем низу. Могу уклонити елемент из индекса 2 користећи овај код:

let continents = ['Asia', 'Africa', 'North America', 'South America', 'Antarctica', 'Europe', 'Australia'];
// Remove the element at index 2 using splice
let removedElement = continents.splice(2, 1);
console.log("Removed Element:", removedElement);
console.log("Updated Continents Array:", continents);

Овај код мутира оригинални низ, а затим враћа нови низ. Код такође има две изјаве цонсоле.лог које проверавају ‘Уклоњене елементе’ и ‘Ажурирани низ континената’.

Када покренемо цео код, ово ће бити излаз:

Removed Element: [ 'North America' ]
Updated Continents Array: [
  'Asia',
  'Africa',
  'South America',
  'Antarctica',
  'Europe',
  'Australia'
]

#3. Уклоните први елемент из низа користећи схифт()

Метод схифт () уклања први елемент из ЈаваСцрипт низа. Овај метод модификује/уништи оригинални низ и такође враћа уклоњени елемент. Још увек можемо да користимо низ наших континената за ову демонстрацију.

Први елемент можемо уклонити на следећи начин:

let continents = ['Asia', 'Africa', 'North America', 'South America', 'Antarctica', 'Europe', 'Australia'];
// Remove the first element using shift
let removedContinent = continents.shift();
console.log("Removed Continent:", removedContinent);
console.log("Updated Continents Array:", continents);

Имамо две изјаве цонсоле.лог, где једна враћа `Уклоњени континент’ док друга враћа ‘Ажурирани континенти’.

Ако покренемо код, добићемо овај излаз:

Removed Continent: Asia
Updated Continents Array: [

  'Africa',
  'North America',
  'South America',
  'Antarctica',
  'Europe',
  'Australia'
]

Додајте елемент низу у ЈаваСцрипт-у

До сада смо разговарали о томе како уклонити елемент из низа. Међутим, постоје случајеви у којима ћете можда желети да додате нови елемент у низ. Ово су неки од приступа који се користе:

#1. Метода пусх().

Користићемо овај код за ове примере:

let colors = ['red', 'blue', 'green', 'yellow', 'purple'];

Можемо додати нову боју на крај низа помоћу методе пусх().

let colors = ['red', 'blue', 'green', 'yellow', 'purple'];

// Add a new color to the array
colors.push('orange');

Наш низ ће сада имати шест боја.

#2. Метода унсхифт().

Можете додати нови елемент на почетак низа користећи унсхифт() метод. Још увек можемо да користимо низ боја.

let colors = ['red', 'blue', 'green', 'yellow', 'purple'];
// Add a new color to the array
colors.unshift('orange');
console.log(colors);

Као што можете видети на следећем снимку екрана, наранџаста је сада прва боја у нашем низу:

Закључак

Сада разумете како уклонити елемент у ЈаваСцрипт низу и произвести ефикасан код. Избор приступа зависиће од ваших крајњих циљева, вештина и преференција.

Метода слице() је савршен избор када тражите једноставан приступ и не желите да мутирате оригинални низ. С друге стране, сматрао сам да је комбинација метода слице() и цонцат() савршен избор ако желите да уклоните било који елемент.

Погледајте наш чланак о ЈаваСцрипт варалицама за програмере.