Oggetti JavaScript - Come creare e accedere a un oggetto in JavaScript?

Sommario:

Anonim

Cosa sono gli oggetti JavaScript?

Gli oggetti sono i mattoni di base per ogni linguaggio orientato agli oggetti. JavaScript essendo un linguaggio orientato agli oggetti non fa eccezione a questo concetto. Con javascript ampiamente adottato grazie alla sua capacità di fornire un comportamento dinamico alle pagine Web, si dovrebbe essere consapevoli di javascript e di come lavorare con i suoi oggetti.

Gli oggetti in JavaScript sono un gruppo di diversi tipi di dati o oggetti messi insieme come coppie "valore-chiave". La parte "chiave" dell'oggetto non è altro che le proprietà dell'oggetto.

Ad esempio, consideriamo che abbiamo un oggetto "Studente", in cui le sue proprietà sono: nome, cognome, età, student_id, classe, ecc. La rappresentazione dell'oggetto javascript per questo oggetto studente sarebbe rappresentata come segue:

var student = ( first_name : 'Anamika',
last_name : 'Rai',
age : 14,
student_id : 20,
class : 'VIII D'
)

Qui si noti che le proprietà first_name, last_name e class contengono valori del tipo di dati String, mentre age e student_id sono del tipo di dati numerico.

Come creare un oggetto in JavaScript?

Per creare oggetti, JavaScript fornisce alcune opzioni che consentono di creare oggetti secondo le proprie necessità.

1. Utilizzo della sintassi dell'inizializzatore di oggetti

La sintassi dell'inizializzatore di oggetti è un elenco di nomi di proprietà (chiavi) insieme ai rispettivi valori, racchiusi tra parentesi graffe ((…)). Nell'esempio sopra abbiamo creato l'oggetto "studente" usando la sintassi dell'inizializzatore di oggetti. La sintassi è la seguente:

var object = ( prop_1 : val_1,
prop_2 : val_2,
… … …
prop_n: val_n)

Qui le proprietà sono di un tipo di dati primitivo (stringa, numero, booleano, null e indefinito sono i tipi di dati primitivi in ​​javascript) o un altro oggetto.

Per esempio

var student = ( first_name : 'Anamika',
last_name : 'Rai',
age : 14,
student_id : 20,
class : 'VIII D'
parents : (father : 'Mrinal Rai', mother : 'Payal Rai')
)

Nota, qui la proprietà "genitori" è di tipo oggetto. Consiste in due sotto-proprietà, rispettivamente padre e madre.

2. Uso della funzione costruttore

In questo caso, innanzitutto definire una funzione di costruzione con le rispettive proprietà, in seguito alla quale creare il suo oggetto utilizzando la parola chiave "nuova". Quindi assegnare i valori a questo oggetto appena creato.

Ad esempio: consideriamo una funzione di costruzione, ad esempio Studente:

function Student(name, age, gender)(
this.name= name;
this.age = age;
this.gender = gender;
)

Si noti che il nome del costruttore dovrebbe iniziare con una lettera maiuscola secondo la convenzione di denominazione.

Ora creiamo l'oggetto usando la "nuova" parola chiave.

var myStudent = new Student('Anita Rai', 14, 'female');

Inoltre, nota che qui stiamo solo passando i valori al costruttore. Il costruttore sta assegnando questi valori alle rispettive proprietà usando la parola chiave "this". Si fa riferimento all'oggetto corrente usando la parola chiave "this".

3. Utilizzo dell'istanza di un oggetto

In alternativa, è possibile utilizzare l'istanza / il costruttore dell'oggetto per crearlo e inizializzarlo come segue:

var student = new Object();
student.name = “Anita Rai”;
student.age = 14;
student.gender = “female”;

4. Utilizzo del metodo Create () nella classe di oggetti

Si potrebbe anche creare oggetti usando il metodo create () fornito dalla classe di oggetti. Il metodo create accetta un prototipo di oggetto come parametro. A causa di ciò si potrebbe evitare di dover scrivere una funzione di costruzione.

Per esempio

var student = ( name : “Anamika Rai”, age : 14, gender : “female” )

Qui "studente" è il nostro oggetto prototipo. Ora, usando questo, creiamo un altro oggetto:

var student_1 = object.create(student);

Qui, l'oggetto student_1 viene creato usando il prototipo student. Se è necessario modificare uno qualsiasi dei valori in questo oggetto appena creato, questo viene fatto come segue:

Student_1.name = “Ananya Gupta”;

Ora, l'oggetto student_1 ha valori di proprietà simili a quelli dell'oggetto studente, ad eccezione della proprietà "nome".

Come accedere agli oggetti in JavaScript?

Ora che l'oggetto viene creato, la prossima cosa che devi sapere è come accedervi? Bene, JavaScript fornisce due modi con cui si può accedere all'oggetto:

1. Utilizzo di un'istanza di oggetto

Qui l'istanza dell'oggetto viene utilizzata per accedere alle sue proprietà.

Sintassi: object.property

Ad esempio: considera che abbiamo definito uno studente oggetto,

var student = ( name : “Anamika Rai”, age : 14, gender : “female” )

Ora per accedere all'oggetto e alle sue proprietà, stampiamolo sulla console:

console.log (“Student” + student.name + “is” + student.age + “years old.”);
// output: Student Anamika Rai is 14 years old.

2. Utilizzo di parentesi quadre

La proprietà dell'oggetto viene posizionata tra parentesi quadre dopo l'oggetto stesso.

Sintassi: object('property')

Ad esempio: accedere all'oggetto studente sopra usando parentesi quadre,

console.log (“Student” + student('name') + “is” + student('age ') + “years old.”);
// output: Student Anamika Rai is 14 years old.

Metodi oggetto JavaScript

Pochi metodi javascript maggiormente utilizzati sono i seguenti:

  1. create (): come abbiamo già visto sopra, questo metodo viene utilizzato per creare oggetti javascript da un oggetto prototipo.
  2. is (): questo metodo accetta un secondo oggetto come parametro e determina se entrambi gli oggetti sono uguali e restituisce un valore booleano. Cioè se entrambi gli oggetti sono uguali, viene restituito "vero", altrimenti "falso".
  3. keys (): il metodo keys () accetta l'oggetto javascript come parametro e restituisce un array delle sue proprietà.
  4. valori (): allo stesso modo il metodo valori accetta un oggetto javascript come parametro e restituisce una matrice dei suoi valori.
  5. entry (): questo metodo accetta anche un oggetto javascript come parametro e restituisce un array, contenente un altro array di entrambe le coppie chiave-valore. Esempio: consideriamo ancora una volta il nostro oggetto "studente",

console.log(Object.entries(student));
//output: Array (Array ("name", "Anamika Rai"), Array ("age", 14), Array ("gender", "female"))

Conclusione

Questo articolo dà un'idea di cosa siano esattamente gli oggetti javascript e dei vari modi in cui è possibile crearli. Discute anche le proprietà che possiedono questi oggetti e come si potrebbe accedervi in ​​modi diversi. Infine, è necessario conoscere i metodi più comunemente utilizzati per lavorare con gli oggetti javascript.

Articoli consigliati

Questa è una guida agli oggetti JavaScript. Qui discutiamo come creare un oggetto in JavaScript e come accedere agli oggetti in JavaScript. Puoi anche dare un'occhiata ai seguenti articoli per saperne di più -

  1. Costruttore in JavaScript
  2. Sostituzione in JavaScript
  3. Funzionalità di JavaScript
  4. Come funziona JavaScript
  5. Oggetto in Java