Obrazek użytkownika cytrynek

Funkcje w JavaScript

Treść: 
  • Funkcje w JS są obiektami (zwierający kolecję nazwa:wartośc, które to są powiązane z obiektem prototypu). 
  • Obiekty powiązane są z Object.prototype. 
  • Funkcje są powiązane najpierw z Function.prototype a ona z Object.prototype.
  • Funkcje to obiekty więc mogą być przechowywane w zmiennych, obiektach, tablicach. Mogą być przekazywane jako argumenty. Funkcje to obiekty, które mogą mieć METODY
var suma =function (a,b){
return a+b;
}

Funkcje skaładają się z 4 części:

  • słowo zastrzeżona function
  • identyfikator funkcji (nazwa) jest opcjonalna -> funkcja anonimowa, jak powyżej
  • zbiór parametrów
  • zbiór instrukcji w nawiasach klamrowych

Wywoływanie funkcji

document.writeln("<br><br><br>");
//definiujemy funkcję w obiekcie TowarObj o metodę dodaj.
var TowarObj = {
stan:0,
dodaj: function (wartosc){
    this.stan += typeof wartosc ==='number' ? wartosc : 1;

}
}
TowarObj.dodaj();
document.writeln("stan:"+TowarObj.stan);

TowarObj.dodaj(5);
document.writeln("stan:"+TowarObj.stan);

Konstruktor. Wzorzec wywołania konstruktora

Jako, że JS jest językiem bezklasowym - obiekty mogą dziedziczyć po sobie. Jeżeli funkcja jest wywołana przy użycia operatora new, wówczas tworzony jest obiekt z ukrytym łacznikiem do wartości porotype tej funkcji. Po tej operacji this wiązane jest z nowym obiektem.

var UFO={
  "nazwa":"obiekt",
  a:2,
  b:3,
  suma:function (){
    return this.a+this.b;
   //return a+b; // a i b nie są zdefiniowane
  }
}
document.writeln(UFO.suma());
function person(firstname,lastname,age,eyecolor)
{
this.firstname=firstname;
this.lastname=lastname;
this.age=age;
this.eyecolor=eyecolor;
}

var Jablko = function (string){
this.gatunek = string; //dodanie nowej własności do obiektu
}
Jablko.prototype.get_gatunek = function(){
    return this.gatunek;
}

Jablko.producent="Firma Krzak";
Jablko.get_gatunek2 = function(){
    return this.gatunek;
}

var mojObiekt = new Jablko("<br>McIntosh"); // Funkcje z operatorem new to konstruktory
var mojObiekt2 = new Jablko("<br>Antonówka");

document.writeln(mojObiekt.get_gatunek());
document.writeln(mojObiekt2.get_gatunek());
//document.writeln(mojObiekt2.get_gatunek2());
mojObiekt2.producent="Firma Krzak2";
document.writeln(mojObiekt2.producent);
document.writeln(Jablko.producent);


Metoda call() i apply()

Metody call() i apply() w JavaScript pozwalają wywołać metodę jednego obiektu w kontekście innego obiektu. Czyli wywołujemy metodę jakiegoś obiektu i jako argument podajemy inny obiekt.
Składnia metody call(): call(obiekt, argument1, argument2, …);

var Rabat1 = {
rab: 0.2
}
var Rabat2 = {
rab: 0.3
}

var Cena = {
 nazwaOp: 'sumowanie',
 obliczCene: function(l1,l2) {
  if (typeof this.rab=='undefined'){
  return 0;
   }else return (l1 + l2) - (l1 + l2) * this.rab;
 }
}

console.log("Cena jabłek:"+Cena.obliczCene(6,3)+"zł"); // zwróci 9
console.log("Cena jabłek:"+Cena.obliczCene.call(Rabat1,6,9)+"zł"); // return 20
console.log("Liczba:"+Cena.obliczCene.call(Rabat1,6,9)+"zł"); // return 20

var sumuj = function (a, b) {
   return a + b;
};
var array = [3, 4];
var sum = sumuj.apply(3, array);
console.log("suma:"+sum); // return 20

function zlicz(arg, arr){
    var str="";
    if (this!="[object Window]")
    str+="wartość this:"+this+"<br>";
    for (i in zlicz.arguments){
    str+="argument:"+zlicz.arguments[i]+"<br>"
    }
 return str;
}

document.writeln("<p>zwykła funkcja:</p>");
document.writeln(zlicz(1,2));
document.writeln("<p>funkcja z użyciem apply:</p>");
document.writeln(zlicz.apply(1,[4,7]));