In questo tutorial imparerai a conoscere la funzione di costruzione JavaScript con l'aiuto di esempi.
In JavaScript, una funzione di costruzione viene utilizzata per creare oggetti. Per esempio,
// constructor function function Person () ( this.name = 'John', this.age = 23 ) // create an object const person = new Person();
Nell'esempio precedente, function Person()è una funzione di costruzione di oggetti.
Per creare un oggetto da una funzione di costruzione, usiamo la newparola chiave.
Nota : è considerata una buona pratica scrivere in maiuscolo la prima lettera della funzione di costruzione.
Crea più oggetti con la funzione Costruttore
In JavaScript è possibile creare più oggetti da una funzione di costruzione. Per esempio,
// constructor function function Person () ( this.name = 'John', this.age = 23, this.greet = function () ( console.log('hello'); ) ) // create objects const person1 = new Person(); const person2 = new Person(); // access properties console.log(person1.name); // John console.log(person2.name); // John
Nel programma precedente, vengono creati due oggetti utilizzando la stessa funzione di costruzione.
JavaScript questa parola chiave
In JavaScript, quando la thisparola chiave viene utilizzata in una funzione di costruzione, si thisriferisce all'oggetto quando l'oggetto viene creato. Per esempio,
// constructor function function Person () ( this.name = 'John', ) // create object const person1 = new Person(); // access properties console.log(person1.name); // John
Quindi, quando un oggetto accede alle proprietà, può accedere direttamente alla proprietà come person1.name.
Parametri della funzione del costruttore JavaScript
È inoltre possibile creare una funzione di costruzione con parametri. Per esempio,
// constructor function function Person (person_name, person_age, person_gender) ( // assigning parameter values to the calling object this.name = person_name, this.age = person_age, this.gender = person_gender, this.greet = function () ( return ('Hi' + ' ' + this.name); ) ) // creating objects const person1 = new Person('John', 23, 'male'); const person2 = new Person('Sam', 25, 'female'); // accessing properties console.log(person1.name); // "John" console.log(person2.name); // "Sam"
Nell'esempio precedente, abbiamo passato argomenti alla funzione di costruzione durante la creazione dell'oggetto.
const person1 = new Person('John', 23, 'male'); const person2 = new Person('Sam', 25, 'male');
Ciò consente a ciascun oggetto di avere proprietà diverse. Come mostrato sopra,
console.log(person1.name); dà John
console.log(person2.name); dà Sam
Creare oggetti: funzione di costruzione vs oggetto letterale
- Object Literal viene generalmente utilizzato per creare un singolo oggetto. La funzione di costruzione è utile se si desidera creare più oggetti. Per esempio,
// using object literal let person = ( name: 'Sam' )
// using constructor function function Person () ( this.name = 'Sam' ) let person1 = new Person(); let person2 = new Person();
- Ogni oggetto creato dalla funzione di costruzione è unico. È possibile avere le stesse proprietà della funzione di costruzione o aggiungere una nuova proprietà a un particolare oggetto. Per esempio,
// using constructor function function Person () ( this.name = 'Sam' ) let person1 = new Person(); let person2 = new Person(); // adding new property to person1 person1.age = 20;
Ora questa ageproprietà è univoca per l' person1oggetto e non è disponibile per l' person2oggetto.
Tuttavia, se un oggetto viene creato con un oggetto letterale e se una variabile viene definita con quel valore oggetto, qualsiasi modifica nel valore della variabile cambierà l'oggetto originale. Per esempio,
// using object lateral let person = ( name: 'Sam' ) console.log(person.name); // Sam let student = person; // changes the property of an object student.name = 'John'; // changes the origins object property console.log(person.name); // John
Quando un oggetto viene creato con un oggetto letterale, qualsiasi variabile oggetto derivata da quell'oggetto agirà come un clone dell'oggetto originale. Pertanto, qualsiasi modifica apportata a un oggetto si rifletterà anche nell'altro oggetto.
Aggiunta di proprietà e metodi in un oggetto
Puoi aggiungere proprietà o metodi in un oggetto come questo:
// constructor function function Person () ( this.name = 'John', this.age = 23 ) // creating objects let person1 = new Person(); let person2 = new Person(); // adding property to person1 object person1.gender = 'male'; // adding method to person1 object person1.greet = function () ( console.log('hello'); ) person1.greet(); // hello // Error code // person2 doesn't have greet() method person2.greet();
Produzione
ciao Uncaught TypeError: person2.greet non è una funzione
Nell'esempio precedente, una nuova proprietà gendere un nuovo metodo greet()vengono aggiunti person1all'oggetto.
Tuttavia, questa nuova proprietà e metodo viene solo aggiunto a person1. Non puoi accedere gendero greet()da person2. Quindi il programma dà errore quando proviamo ad accedereperson2.greet();
Prototipo di oggetto JavaScript
È inoltre possibile aggiungere proprietà e metodi a una funzione di costruzione utilizzando un prototipo . Per esempio,
// constructor function function Person () ( this.name = 'John', this.age = 23 ) // creating objects let person1 = new Person(); let person2 = new Person(); // adding new property to constructor function Person.prototype.gender = 'Male'; console.log(person1.gender); // Male console.log(person2.gender); // Male
Per ulteriori informazioni sui prototipi, visita JavaScript Prototype.
Costruttori JavaScript incorporati
JavaScript ha anche costruttori incorporati. Alcuni di loro sono:
let a = new Object(); // A new Object object let b = new String(); // A new String object let c = new Number(); // A new Number object let d = new Boolean(); // A new Boolean object
In JavaScript, le stringhe possono essere create come oggetti da:
const name = new String ('John'); console.log(name); // "John"
In JavaScript, i numeri possono essere creati come oggetti da:
const number = new Number (57); console.log(number); // 57
In JavaScript, i booleani possono essere creati come oggetti da:
const count = new Boolean(true); console.log(count); // true
Nota : Si consiglia di utilizzare i tipi di dati primitivi e creare in modo normale, come ad esempio const name = 'John';, const number = 57;econst count = true;
Non si dovrebbero dichiarare stringhe, numeri e valori booleani come oggetti perché rallentano il programma.
Nota : in JavaScript, la parola chiave è classstata introdotta in ES6 (ES2015) che ci consente anche di creare oggetti. Le classi sono simili alle funzioni del costruttore in JavaScript. Per saperne di più, visita Corsi JavaScript.
