Funkce konstruktoru JavaScript (s příklady)

V tomto kurzu se na příkladech dozvíte o funkci konstruktoru JavaScriptu.

V JavaScriptu se k vytváření objektů používá funkce konstruktoru. Například,

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

Ve výše uvedeném příkladu function Person()je funkce konstruktoru objektu.

K vytvoření objektu z funkce konstruktoru použijeme newklíčové slovo.

Poznámka : Za dobrou praxi se považuje velká písmena prvního písmene vaší funkce konstruktoru.

Vytvořte více objektů pomocí funkce konstruktoru

V JavaScriptu můžete z funkce konstruktoru vytvořit více objektů. Napří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

Ve výše uvedeném programu jsou dva objekty vytvořeny pomocí stejné funkce konstruktoru.

JavaScript toto klíčové slovo

V jazyce JavaScript, když thisje klíčové slovo použito ve funkci konstruktoru, thisodkazuje na objekt, když je objekt vytvořen. Například,

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

Když tedy objekt přistupuje k vlastnostem, může přímo přistupovat k vlastnosti jako person1.name.

Parametry funkce konstruktoru JavaScriptu

Můžete také vytvořit funkci konstruktoru s parametry. Napří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" 

Ve výše uvedeném příkladu jsme předali argumenty funkci konstruktoru během vytváření objektu.

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

To umožňuje každému objektu mít různé vlastnosti. Jak je uvedeno výše,

console.log(person1.name); dává Johnovi

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

Vytvořte objekty: funkce konstruktoru vs. literál objektu

  • Object Literal se obecně používá k vytvoření jediného objektu. Funkce konstruktoru je užitečná, pokud chcete vytvořit více objektů. Napří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 vytvořený funkcí konstruktoru je jedinečný. Můžete mít stejné vlastnosti jako funkce konstruktoru nebo přidat novou vlastnost k jednomu konkrétnímu objektu. Napří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;

Nyní je tato agevlastnost pro person1objekt jedinečná a není pro person2objekt k dispozici .

Pokud je však objekt vytvořen pomocí literálu objektu a pokud je proměnná definována s touto hodnotou objektu, jakékoli změny hodnoty proměnné změní původní objekt. Napří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

Když je objekt vytvořen pomocí literálu objektu, bude jakákoli proměnná objektu odvozená od tohoto objektu fungovat jako klon původního objektu. Jakákoli změna provedená v jednom objektu se tedy projeví i v druhém objektu.

Přidání vlastností a metod do objektu

Do objektu můžete přidat vlastnosti nebo metody, jako 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ýstup

 ahoj Uncaught TypeError: person2.greet není funkce

Ve výše uvedeném příkladu je do objektu přidána nová vlastnost gendera nová metoda .greet()person1

Tato nová vlastnost a metoda je však pouze přidána do person1. Nemůžete vstoupit gendernebo greet()z person2. Proto program při pokusu o přístup dává chybuperson2.greet();

Prototyp objektu JavaScript

Můžete také přidat vlastnosti a metody do funkce konstruktoru pomocí prototypu . Napří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

Chcete-li se dozvědět více o prototypech, navštivte JavaScript Prototype.

Integrované konstruktory JavaScriptu

JavaScript má také integrované konstruktory. Někteří z nich jsou:

 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 JavaScriptu lze řetězce vytvořit jako objekty:

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

V JavaScriptu lze čísla vytvářet jako objekty:

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

V JavaScriptu mohou být booleové vytvořeny jako objekty:

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

Poznámka : Doporučuje se používat primitivní datové typy a vytvářet je běžným způsobem, například const name = 'John';, const number = 57;aconst count = true;

Neměli byste deklarovat řetězce, čísla a booleovské hodnoty jako objekty, protože zpomalují program.

Poznámka : V JavaScriptu bylo klíčové slovo classpředstaveno v ES6 (ES2015), což nám také umožňuje vytvářet objekty. Třídy jsou podobné funkcím konstruktoru v JavaScriptu. Chcete-li se dozvědět více, navštivte třídy JavaScriptu.

Zajímavé články...