Функція-конструктор це функція яка повертає об'єкт.
function Name(){
//тіло функції
}
//застосування
new Name();
Name - назва функції-конструктор. У JavaScript принято функцію конструктор називати першу літеру з великої букви, хоча це не обов'язково.
Функція-конструктор (конструктор) - це функція яка повертає новостворений об'єкт.
Для отримання екземпляра об'єкту від функції-конструктор потрібно визвати її за допомогою оператора new.
При виклику функції-конструктор оператором new створюється порожній об'єкт, який передається функції-конструктор. На цей об'єкт вказує this, до об'єкту додаються властивості і методи. Даний об'єкт функцією-конструктором повертається автоматично, тобто return this; НЕ потрібно визивати.
function myObj(a){
this.name=a;
}
var ob=new myObj("тест");
alert( ob.name );
Якщо при виклику функції-конструктор не вказати new то це може привести до помилок, так як this буде посилатися на глобальний об'єкт window.
function myObj(a){
this.hit=a;
alert("this = "+this); //[window]
}
var ob=myObj("тест");
alert( "ob = "+ob ); //undefined
alert( "window.hit = "+window.hit );
Функція-конструктор повертає об'єкт на який посилається this, але можна повернути і інший об'єкт за допомогою return:
Повернення об'єкта за допомогою this:
function Test(a,b){
this.name=a;
this.text=b;
}
var ob= new Test('JavaScript','js');
alert(ob.name);
Повернення об'єкта за допомогою return:
function Test(a,b){
var res={};
res.name=a;
res.text=b;
return res;
}
var ob= new Test('JavaScript','js');
alert(ob.name);
Якщо повернути за допомогою return не об'єкт а інше значення, то функція-конструктор проігнорує помилку і поверне this:
function myObj(a){
this.name=a;
return null;
}
var ob=new myObj("тест");
alert( ob.name );
Щоб створити метод потрібно властивості об'єкту що повертається присвоювати функцію:
function test(){
this.method=function(x,y){return x+y;}
}
var b=new test();
alert(b.method(1,1));
function p(name, rn){
this.name=name;
this.rn=parseInt(rn);
if(this.rn<1900) this.rn=1990;
//метод getVik
this.getVik=function(){
let d= new Date();
return d.getFullYear()-this.rn;
}
}
var ob= new p('Віра', 1995), ob2 = new p('Катерина', 1997);
alert(ob.name+': '+ob.getVik()+' '+ob2.name+': '+ob2.getVik());
Так як функція-конструктор це та ж сама функція щоб визначити чи була функція викликана за допомогою оператора new використовують оператор instanceof:
function Test(){
if( this instanceof Test ) alert("викликано оператором new");
else alert("звичайний виклик функції");
}
Test();
new Test();
function myObject(s){
this.name = s;
this.prototype={
get text(){ return this.name.toString() },
set text(a){this.mame=a;}
}
}
var ob=new myObject("тест");
ob.text= 8;
alert( ob.text );function myObject(s){
this.name = s;
this.prototype={};
Object.defineProperty(this.prototype, "text",{
get : function(){ return this.name.toString() },
set: function(a){this.mame=a;}
});
}
var ob=new myObject("тест");
ob.text= 8;
alert( ob.text );function myObject(s){
var res={name:s,
get : function(){ return this.name.toString() },
set: function(a){this.mame=a;}
};
return res;
}
var ob=new myObject("тест");
ob.text= 8;
alert( ob.text );Наслідування у функції-.конструктор за допомогою Object.__proto__:
function myObj(){
this.name="test";
}
function myObj2(){
this.__proto__=new myObj();
this.id="3";
}
var ob=new myObj2();
alert( ob.name);
Наслідування у функції-конструктор за допомогою Object.prototype:
function myObject(s){
this.name=s;
}
function myObj2(){
this.prototype= myObject.apply(this ,arguments);
this.toString=function(){return this.name.toString()};
}
var ob=new myObj2("тест");
alert( ob);
function myObj(){
this.name="test";
}
function myObj2(){
this.id="3";
}
myObj2.prototype=new myObj();
var ob=new myObj2();
alert( ob.name);
function Obj(x, y, z){
this.x=x;
this.y=y;
this.z=z;
this.toText=function(){
return (this.x?"x="+this.x+" ":"")+( this.y?"y="+this.y+" ":"" )+( this.z?"z="+this.z+" ":"");
};
this.toString=function(){
return "x="+this.x+", y="+this.y+", z="+this.z;
};
this.suma=function(){
return x+y+z;
};
}
var ob=new Obj(1, 4, 2);
alert( ob.suma() );
Приклад створення об'єкту який зберігає назву події, опис і дату:
function Ev(){
var name = new Array(), desc = new Array(), date = new Array();
this.length=0;
//метод додає подію
this.add=function(a, b){
name.push(a);
desc.push(b);
date.push(new Date() );
this.length=name.length;
}
//текстове представлення події
this.toString=function(){
return name.toString();
};
//повертаємо дані про подію за індексом
this.item=function(index){
if(index<0 || index>name.length-1) return null;
return {name: name[index], description:desc[index], date:date[index]};
};
}
var ob= new Ev();
ob.add("старт", "перша подія");
alert(ob.item(0).name);
Приклад створення об'єкту який приймає масив чисел і містить методи для отримання загального добутку, частки, суми, різниці:
function Num(){
this.mas=Array.prototype.slice.call(arguments);
this._mas=[];
for(i=0, n; i < this.mas.length; i++){
n=parseFloat(this.mas[i]);
if(isNaN(n)==false) this._mas.push(n);}
//сума
this.sum=function(){
var res=null;
for(i=0; i< this._mas.length; i++)res+=this._mas[i];
return res;
}
//різниця
this.riz=function(){
if(this._mas.length==0)return null;
var res=this._mas[0];
for(i=1; i< this._mas.length; i++)res-=this._mas[i];
return res;}
//добуток
this.mul=function(){ if(this._mas.length==0)return null;
var res=this._mas[0];
for(i=1; i< this._mas.length; i++)res=res * this._mas[i];
return res;}
//частка
this.div=function(){ if(this._mas.length==0)return null;
var res=this._mas[0];
for(i=1; i< this._mas.length; i++)res=res / this._mas[i];
return res;}
this.toString=function(){return this.mas.toString();}
}
var n=new Num(2, 2, 3);
alert(n.sum() );