Jak zmienić wartość obiektu, która znajduje się w tablicy za pomocą JavaScript?

Jak zmienić wartość obiektu, która znajduje się w tablicy za pomocą JavaScript?
Podczas pracy z JavaScript, programiści mogą potrzebować dynamicznie aktualizować dane. Jest wewnątrz tablicy, obiektu lub w tablicy obiektów. Tablica to grupa lub zbiór wartości, a każda wartość może być dowolnego typu danych, w tym obiekty. Aby zmienić wartość obiektu wewnątrz tablicy, najpierw dostęp do obiektu, a następnie zmodyfikuj jego właściwości. W JavaScript istnieje wiele wstępnie zbudowanych metod zmiany wartości obiektu wewnątrz tablicy.

Ten samouczek pokaże podejścia do zmiany wartości obiektu wewnątrz tablicy w JavaScript.

Jak zmienić/zaktualizować wartość obiektu, który znajduje się w tablicy za pomocą JavaScript?

Aby zmienić wartość obiektu, który znajduje się wewnątrz tablicy, użyj następujących predefiniowanych metod JavaScript:

  • metoda findIndex ()
  • Metoda map () z operatorem rozprzestrzeniania
  • metoda znajdź ()
  • na pętlę

Metoda 1: Zmień wartość obiektu, która znajduje się wewnątrz tablicy za pomocą metody „findIndex ()”

Aby zmienić wartość obiektu wewnątrz tablicy, użyj „FindIndex ()" metoda. Ta metoda znajduje indeks elementu w tablicy, która spełnia określony warunek. Aby określić warunek, używa funkcji wywołania zwrotnego.

Składnia
Postępuj zgodnie z podaną składnią do zmiany wartości obiektu za pomocą metody FindIndex ():

ArrayObject.findIndex (obj =>
//stan
);

Przykład
Utwórz tablicę zawierającą różne obiekty:

var arrobj = [id: 5, nazwa: „Mayer”, wiek: 25,
Id: 9, nazwa: „Paul”, wiek: 26,
Id: 12, nazwa: „Steven”, wiek: 20]

Wywołać metodę FindIndex () z funkcją wywołania zwrotnego, która sprawdza identyfikator obiektów równoważny „12”I przechowuj indeks obiektu w zmiennej”getIndex”:

const getIndex = arrobj.findIndex (obj =>
powrót obj.id === 12;
);

Zmień wartość właściwości „wiek”Obiekt:

arrobj [getIndex].Wiek = 24;

Na koniec wydrukuj zaktualizowaną tablicę obiektów na konsoli:

konsola.Log („Zaktualizowany zestaw obiektu to:”);
konsola.log (arrobj);

Wyjście wskazuje, że wartość „wiek„Obiekt, którego ID wynosi 1220" Do "24”:

Metoda 2: Zmień wartość obiektu, która znajduje się wewnątrz tablicy za pomocą metody „map ()” z operatorem rozprzestrzeniania

Użyj „mapa()„Metoda z„Operator rozprzestrzeniania się”W celu zmiany wartości obiektu wewnątrz tablicy. „Map ()” jest wykorzystywany do tworzenia nowej tablicy, wywołując funkcję na każdym elemencie istniejącej tablicy. Podczas gdy operator rozprzestrzeniania umożliwia rozpowszechnianie lub kopiowanie elementów tablicy na nową tablicę lub argumenty wywołania funkcji. Metoda „map ()” nie modyfikuje/nie zmienia oryginalnej tablicy, ale wyprowadza nową tablicę ze zmodyfikowanymi elementami.

Składnia
Aby zmienić wartość obiektu za pomocą metody MAP () z operatorem rozprzestrzeniania się, użyj następującej składni:

ArrayObject.mapa (obj =>
if (warunek)
return … obj, klucz: newValue;

powrót obj;
);

Przykład
Wywołaj metodę map () z operatorem rozprzestrzeniania się, aby zmienić nazwę obiektu, którego identyfikatorem jest „9”:

const newobjectarr = arrobj.mapa (obj =>
if (obj.id === 9)
return … obj, nazwa: „Alice”;

powrót obj;
);

Wydrukuj zmodyfikowaną tablicę obiektu na konsoli:

konsola.log (NewObjectarr);

Własność "nazwa„Obiektu, którego identyfikatorem jest„9”Zmieniono z„Paweł" Do "Alice”:

Metoda 3: Zmień wartość obiektu, która znajduje się wewnątrz tablicy za pomocą metody „Find ()”

Aby zmienić wartość obiektu wewnątrz tablicy, użyj „znajdować()" metoda. Jest wykorzystywany do znalezienia elementu w tablicy, który spełnia dany warunek. Wyświetla wartość elementu, jeśli spełnia warunek. W przeciwnym razie daje „nieokreślony, ”Wskazując, że nie można znaleźć takiego elementu.

Składnia
Użyj podanej składni dla metody Find (), aby znaleźć element w tablicy:

ArrayObject.znaleźć (obj =>
//stan
);

Przykład
Wywołać metodę Find (), aby znaleźć obiekt, którego identyfikatorem jest „5”I przechowuj obiekt w zmiennej”FindIndex”:

const FindIndex = arrobj.znaleźć (obj =>
powrót obj.id === 5;
);

Sprawdź, czy zmienna „FindIndex” nie jest równa „nieokreślony”Oznacza, jeśli obiekt zostanie znaleziony, zmień wartość właściwości„nazwa”Obiekt:

if (FindIndex !== Undefined)
FindIndex.nazwa = „John”;

Na koniec wydrukuj obiekt na konsoli:

konsola.log (FindIndex);

Wyjście wyświetla tylko określony obiekt, zmieniając jego wartość:

Metoda 4: Zmień wartość obiektu, która znajduje się wewnątrz tablicy za pomocą pętli „for-of-of”

Możesz także użyć „dla„Pętla do zmiany wartości obiektu wewnątrz tablicy. Służy do iteracji nad tablicą obiektów i sprawdzenia warunku, aby zmienić wartość obiektu. Po uzyskaniu dostępu i zmiany wartości obiektu zakończ pętlę za pomocą „przerwa”Słowo kluczowe.

Składnia
Postępuj zgodnie z podaną składnią do pętli „for-of-of”:

dla (const obj z ArrayObject)
if (warunek)
//oświadczenie
przerwa;

Przykład
Użyj pętli i sprawdź obiekt, którego identyfikatorem jest „5”I zmień„wiek" Do "27”:

dla (const obj z arrobj)
if (obj.id === 5)
obj.Wiek = 27;
przerwa;

Wydrukuj zaktualizowany obiekt wewnątrz tablicy na konsoli:

konsola.log (arrobj);

Wyjście

Zebraliśmy wszystkie podstawowe informacje istotne dla zmieniającej się wartości obiektu, który znajduje się w tablicy w JavaScript.

Wniosek

Aby zmienić wartość obiektu, który znajduje się w tablicy, użyj predefiniowanych metod JavaScript, w tym „FindIndex (), "mapa()„Metoda z„Operator rozprzestrzeniania się”,„znajdować()„Metoda lub„dla" pętla. Te metody z powodzeniem zmieniły wartości obiektu w tablicy. Ten samouczek pokazał różne podejścia do zmiany wartości obiektu, który znajduje się w tablicy w JavaScript.