Funkcia konštruktora JavaScript (s príkladmi)

V tomto tutoriáli sa pomocou príkladov dozviete o funkcii konštruktora JavaScriptu.

V JavaScripte sa na vytváranie objektov používa funkcia konštruktora. Napríklad,

 // constructor function function Person () ( this.name = 'John', this.age = 23 ) // create an object const person = new Person();

Vo vyššie uvedenom príklade function Person()je funkcia konštruktora objektu.

Na vytvorenie objektu z funkcie konštruktora používame newkľúčové slovo.

Poznámka : Za osvedčený postup sa považuje veľké písmeno vašej funkcie konštruktora za veľké.

Vytvorte viac objektov pomocou funkcie konštruktora

V JavaScripte môžete vytvoriť viac objektov z funkcie konštruktora. Napríklad,

 // 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

Vo vyššie uvedenom programe sú dva objekty vytvorené pomocou rovnakej funkcie konštruktora.

JavaScript tohto kľúčového slova

Keď sa v jazyku JavaScript thispoužíva kľúčové slovo vo funkcii konštruktora, thisodkazuje na objekt pri jeho vytváraní. Napríklad,

 // constructor function function Person () ( this.name = 'John', ) // create object const person1 = new Person(); // access properties console.log(person1.name); // John

Keď teda objekt pristupuje k vlastnostiam, môže k nemu priamo pristupovať ako person1.name.

Parametre funkcie konštruktora JavaScriptu

Môžete tiež vytvoriť funkciu konštruktora s parametrami. Napríklad,

 // 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" 

Vo vyššie uvedenom príklade sme odovzdali argumenty funkcii konštruktora počas vytvárania objektu.

 const person1 = new Person('John', 23, 'male'); const person2 = new Person('Sam', 25, 'male');

To umožňuje, aby každý objekt mal odlišné vlastnosti. Ako je uvedené vyššie,

console.log(person1.name); dáva Ján

console.log(person2.name); dáva Sam

Create Objects: Constructor Function Vs Object Literal

  • Object Literal sa zvyčajne používa na vytvorenie jedného objektu. Funkcia konštruktora je užitočná, ak chcete vytvoriť viac objektov. Napríklad,
 // using object literal let person = ( name: 'Sam' )
 // using constructor function function Person () ( this.name = 'Sam' ) let person1 = new Person(); let person2 = new Person();
  • Každý objekt vytvorený pomocou funkcie konštruktora je jedinečný. Môžete mať rovnaké vlastnosti ako funkcia konštruktora alebo môžete pridať novú vlastnosť k jednému konkrétnemu objektu. Napríklad,
 // using constructor function function Person () ( this.name = 'Sam' ) let person1 = new Person(); let person2 = new Person(); // adding new property to person1 person1.age = 20;

Teraz je táto agevlastnosť jedinečná pre person1objekt a nie je k dispozícii pre person2objekt.

Ak je však objekt vytvorený pomocou literálu objektu a ak je premenná definovaná s touto hodnotou objektu, akékoľvek zmeny v hodnote premennej zmenia pôvodný objekt. Napríklad,

 // 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

Keď je objekt vytvorený pomocou literálu objektu, akákoľvek premenná objektu odvodená z tohto objektu bude fungovať ako klon pôvodného objektu. Akákoľvek zmena, ktorú urobíte v jednom objekte, sa teda prejaví aj v druhom objekte.

Pridávanie vlastností a metód do objektu

Do objektu môžete pridať vlastnosti alebo metódy, ako je tento:

 // 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();

Výkon

 ahoj Uncaught TypeError: person2.greet nie je funkcia

Vo vyššie uvedenom príklade je do objektu pridaná nová vlastnosť gendera nová metóda .greet()person1

Táto nová vlastnosť a metóda sa však iba pridáva do person1. Nemáte prístup genderalebo greet()z person2. Preto sa pri pokuse o prístup k programu zobrazuje chybaperson2.greet();

Prototyp objektu JavaScript

Vlastnosti a metódy môžete tiež pridať do funkcie konštruktora pomocou prototypu . Napríklad,

 // 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

Ak sa chcete dozvedieť viac informácií o prototypoch, navštívte prototyp JavaScript.

Vstavané konštruktory JavaScriptu

JavaScript má tiež zabudované konštruktory. Niektoré z nich sú:

 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

V JavaScripte môžu byť reťazce vytvorené ako objekty:

 const name = new String ('John'); console.log(name); // "John"

V JavaScripte je možné čísla vytvárať ako objekty:

 const number = new Number (57); console.log(number); // 57

V JavaScripte môžu byť booleany vytvorené ako objekty:

 const count = new Boolean(true); console.log(count); // true

Poznámka : Odporúča sa používať primitívne dátové typy a vytvárať ich bežným spôsobom, napríklad const name = 'John';, const number = 57;aconst count = true;

Reťazce, čísla a logické hodnoty by ste nemali deklarovať ako objekty, pretože spomaľujú program.

Poznámka : V JavaScripte bolo kľúčové slovo classzavedené v ES6 (ES2015), čo nám umožňuje aj vytvárať objekty. Triedy sú podobné funkciám konštruktora v JavaScripte. Ak sa chcete dozvedieť viac, navštívte triedy JavaScript.

Zaujímavé články...