Jak zmienić wartość obiektu znajdującego się wewnątrz tablicy za pomocą JavaScript?

Jak Zmienic Wartosc Obiektu Znajdujacego Sie Wewnatrz Tablicy Za Pomoca Javascript



Podczas pracy z JavaScriptem programiści mogą potrzebować dynamicznej aktualizacji danych. Znajduje się wewnątrz tablicy, obiektu lub tablicy obiektów. Tablica to grupa lub zbiór wartości, a każda wartość może być dowolnego typu danych, w tym obiektów. Aby zmienić wartość obiektu wewnątrz tablicy, najpierw uzyskaj dostęp do obiektu, a następnie zmodyfikuj jego właściwości. W JavaScript istnieje wiele gotowych metod zmiany wartości obiektu wewnątrz tablicy.

W tym samouczku zademonstrujemy metody zmiany wartości obiektu wewnątrz tablicy w JavaScript.

Jak zmienić/zaktualizować wartość obiektu znajdującego się wewnątrz tablicy za pomocą JavaScript?

Aby zmienić wartość obiektu znajdującego się w tablicy, użyj następujących predefiniowanych metod JavaScript:







Metoda 1: Zmień wartość obiektu znajdującego się wewnątrz tablicy za pomocą metody „findIndex()”.

Aby zmienić wartość obiektu wewnątrz tablicy, użyj „ znajdźIndeks() ' metoda. Ta metoda znajduje indeks elementu w tablicy, która spełnia określony warunek. Do określenia warunku używa funkcji wywołania zwrotnego.



Składnia
Postępuj zgodnie z podaną składnią, aby zmienić wartość obiektu za pomocą metody findIndex() :



tablicaObiekt. znajdźIndeks ( obj => {
//stan
} ) ;

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





był arrObj = [ { ID : 5 , nazwa : „Mayer” , wiek : 25 } ,
{ ID : 9 , nazwa : 'Paweł' , wiek : 26 } ,
{ ID : 12 , nazwa : „Steven” , wiek : 20 } ]

Wywołaj metodę findIndex() z funkcją wywołania zwrotnego, która sprawdza identyfikator obiektów odpowiadający „ 12 ”, i zapisz indeks obiektu w zmiennej „ pobierzIndeks ”:

konst pobierzIndeks = arrObj. znajdźIndeks ( obj => {
powrót obj. ID === 12 ;
} ) ;

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



arrObj [ pobierzIndeks ] . wiek = 24 ;

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

konsola. dziennik ( „Zaktualizowana tablica obiektów to:” ) ;
konsola. dziennik ( arrObj ) ;

Dane wyjściowe wskazują, że wartość „ wiek ” obiektu, którego identyfikatorem jest 12, został pomyślnie zmieniony z „ 20 ' Do ' 24 ”:

Metoda 2: Zmień wartość obiektu znajdującego się wewnątrz tablicy za pomocą metody „map()” z operatorem Spread

Skorzystaj z opcji „ mapa() ” metoda z „ operator rozprzestrzeniania ” do zmiany wartości obiektu wewnątrz tablicy. „map()” służy do tworzenia nowej tablicy poprzez wywołanie funkcji na każdym elemencie istniejącej tablicy. Podczas gdy operator spread pozwala na rozłożenie lub skopiowanie elementów tablicy do nowej tablicy lub argumentów wywołania funkcji. Metoda „map()” nie modyfikuje/nie zmienia oryginalnej tablicy, ale generuje nową tablicę ze zmodyfikowanymi elementami.

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

tablicaObiekt. mapa ( obj => {
Jeśli ( stan ) {
powrót { ... obj , klucz : Nowa wartość } ;
}
powrót obj ;
} ) ;

Przykład
Wywołaj metodę map() z operatorem spread, aby zmienić nazwę obiektu, którego id to „ 9 ”:

konst nowy obiektArr = arrObj. mapa ( obj => {
Jeśli ( obj. ID === 9 ) {
powrót { ... obj , nazwa : „Alicja” } ;
}
powrót obj ;
} ) ;

Wydrukuj zmodyfikowaną tablicę obiektu na konsoli:

konsola. dziennik ( nowy obiektArr ) ;

Własność ' nazwa ” obiektu, którego identyfikatorem jest „ 9 ” zostało zmienione z „ Paweł ' Do ' Alicja ”:

Metoda 3: Zmień wartość obiektu znajdującego się wewnątrz tablicy za pomocą metody „find()”.

Aby zmienić wartość obiektu wewnątrz tablicy, użyj „ znajdować() ' metoda. Służy do znalezienia elementu w tablicy, który spełnia zadany warunek. Wyprowadza wartość elementu, jeśli spełnia warunek. W przeciwnym razie daje „ nieokreślony , ”, wskazując, że nie znaleziono takiego elementu.

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

tablicaObiekt. znajdować ( obj => {
//stan
} ) ;

Przykład
Wywołaj metodę find(), aby znaleźć obiekt, którego id to „ 5 ” i zapisz obiekt w zmiennej „ znajdźIndeks ”:

konst znajdźIndeks = arrObj. znajdować ( obj => {
powrót obj. ID === 5 ;
} ) ;

Sprawdź, czy zmienna „findIndex” nie jest równa „ nieokreślony ” oznacza, że ​​jeśli obiekt zostanie znaleziony, zmień wartość właściwości „ nazwa ” obiektu:

Jeśli ( znajdźIndeks !== nieokreślony ) {
znajdźIndeks. nazwa = 'Jan' ;
}

Na koniec wydrukuj obiekt na konsoli:

konsola. dziennik ( znajdźIndeks ) ;

Dane wyjściowe wyświetlają tylko określony obiekt, zmieniając jego wartość:

Metoda 4: Zmień wartość obiektu znajdującego się wewnątrz tablicy za pomocą pętli „for-of”.

Możesz także skorzystać z opcji „ za-z ” pętla do zmiany wartości obiektu wewnątrz tablicy. Służy do iteracji po tablicy obiektów i sprawdzania warunku zmiany wartości obiektu. Po uzyskaniu dostępu i zmianie wartości obiektu zakończ pętlę, używając „ przerwa słowo kluczowe.

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

Do ( konst obiekt tablicyObject ) {
Jeśli ( stan ) {
//oświadczenie
przerwa ;
}
}

Przykład
Użyj pętli for-of i sprawdź obiekt, którego id to „ 5 ” i zmienić „ wiek ' Do ' 27 ”:

Do ( konst obiekt arrObj ) {
Jeśli ( obj. ID === 5 ) {
obj. wiek = 27 ;
przerwa ;
}
}

Wydrukuj zaktualizowany obiekt wewnątrz tablicy na konsoli:

konsola. dziennik ( arrObj ) ;

Wyjście

Zebraliśmy wszystkie istotne informacje dotyczące zmieniającej się wartości obiektu znajdującego się wewnątrz tablicy w JavaScript.

Wniosek

Aby zmienić wartość obiektu znajdującego się wewnątrz tablicy, użyj predefiniowanych metod JavaScript, w tym metody „ znajdźIndeks() , “ mapa() ” metoda z „ operator rozprzestrzeniania ”, „ znajdować() ” metoda lub „ za-z ' pętla. Te metody z powodzeniem zmieniły wartości obiektu wewnątrz tablicy. W tym samouczku zademonstrowano różne podejścia do zmiany wartości obiektu znajdującego się wewnątrz tablicy w JavaScript.