Operatory w JavaScript, typy danych, elementy globalne. Podstawy języka część 3.

javascript-html5-tutorial.pl

Sierpień 8th, 2013

Dominik-W

Witam w kolejnym artykule o podstawach JavaScript. Poruszymy tu bardzo istotne tematy, takie jak operatory, typy danych, elementy globalne.

Operatory w JavaScript

Służą one programiście do wykonywania podstawowych operacji na zmiennych, jak przypisania, arytmetyka, porównania i inne.

Operatory arytmetyczne

Sprawa wygląda tak samo, jak w innych językach programowania:

+ (dodawanie)
– (odejmowanie)
/ (dzielenie)
* (mnożenie)
% (dzielenie modulo – reszta z dzielenia)
++ (inkrementacja czyli zwiększenie o 1)
– – (dekrementacja czyli zmniejszenie o 1)

Czyli podstawowa matematyka.

Przykład – operacje arytmetyczne w JavaScript:


var x = 2, y = 3, wynik = 0;

wynik = x + y;
alert('2+3 = ' + wynik);

wynik = x / y;
alert('2/3 = ' + wynik);

wynik = x % y;
alert('2%3 to: ' + wynik);

y++; // y--;
alert(y);

2/3 wynosi 0.66… i tu właśnie możemy zobaczyć istotę typów danych. Jeżeli wynik zostałby przypisany do zmiennej typu int(liczba całkowita) to otrzymalibyśmy 0. Jednak typowaniem zajmuje się sam JavaScript (typowanie dynamiczne).

Operatory logiczne

Służą one do zapisywania warunków logicznych:

! – negacja wartości logicznej
&& – koniunkcja wartości logicznych („i”)
|| – alternatywa wartości logicznych („lub”)

Przykładowo:

if (!a) {
  // negacja wartości - operator NOT
}

if (a > 0 && b > 0) {
  // koniunkcja - operator AND, oba warunki muszą być spełnione
}

if (a >= 1 || b >= 1) {
  // alternatywa - operator OR, przynajmniej jeden z warunków 
  // musi być spełniony
}

Operatory porównania

Jak sugeruje nazwa, służą do porównywania wartości ze sobą:

== (równe)
=== (identyczne, sprawdzane są wartość oraz dodatkowo typ zmiennych; PHP również posiada taki operator)
!= (różne)
!== (nie identyczne)
< (mniejsze)
<= (mniejsze równe)
> (większe)
>= (większe równe)

Użycie pokazano już w poprzednim przykładzie.

Operatory bitowe (bitwise operators)

Służą do operowania na samych bitach.

Operatorami bitowymi są: ~, &, |, ^, <<, >>,
oraz >>> czyli przesunięcie w prawo bez zachowania znaku.

Uwaga: operatory bitowe opiszemy obszerniej wkrótce, w osobnym artykule.

Operatory przypisania

Czyli sposoby przypisywania wartości zmiennym:

= (przypisanie wartości)
+= (powiększenie wartości zmiennej i przypisanie do zmiennej po lewej stronie)
-= (pomniejszenie wartości zmiennej i przypisanie do zmiennej po lewej stronie)
*= (pomnożenie wartości zmiennej i przypisanie do zmiennej po lewej stronie)
/= %= – podzielenie oraz podzielenie modulo zmiennej i przypisanie do zmiennej po lewej stronie

Pozostałe operatory JavaScript

Język daje nam do dyspozycji jeszcze kilka operatorów:

, (przecinek – rozdzielanie argumentów)
. (kropka – dostęp do właściwości lub metody obiektu w postaci: obiekt.element_obiektu)
new (tworzenie nowego obiektu)
delete (kasowanie obiektu, zadanego elementu tablicy, itp.)
?: (operator warunkowy – opiszemy go dokładniej w kolejnym artykule)
typeof nazwa (zwraca tekstową nazwę operandu nazwa określającą jego typ)

Skoro jesteśmy przy temacie typeof, napiszemy teraz o typach danych.

Typy danych w języku JavaScript

Język daje nam możliwość pracy na następujących, podstawowych typach danych:

– liczby (Number)
– łańcuchy tekstowe / ciągi znaków (String)
– wartości logiczne – true i false (Boolean)
– obiekty (Object)
– tablice (Array)
– oraz specjalne: null i undefined

Deklaracje zmiennych

Zmienne można deklarować bezpośrednio przed użyciem w dowolnym miejscu skryptu. Można to zrobić na kilka sposobów:

var tekst; // deklaracja zmiennej tekst, w ten sposób została jej 
// nadana wartość null, jest nieokreślona czyli undefined

// deklaracja z nadaniem wartości
var tekst = "Zenon";
var liczba = 123;

// poprzez stworzenie nowego obiektu danego typu
var str = new String("Nowy napis");

Tekst można umieszczać w pojedynczych lub podwójnych cudzysłowach.

Gdy wartość zmiennej nie może zostać określona np. gdy dzielimy przez 0 to otrzymamy rezultat infinity. Typ zmiennej po jej zadeklarowaniu zostaje automatycznie określony.

Operator typeof(zmienna) zwróci typ zmiennej podanej w nawiasie:

document.write(typeof(true)); // boolean

W tym przykładzie sprawdzamy czy podana nazwa jest nazwą funkcji:

if (typeof foobar !== 'function') {
    alert("foobar nie jest funkcją");
}

Można również łatwo sprawdzić typ składowej obiektu:

alert(typeof nazwa_obiektu.skladowa); // zwróci nazwę typu składowej

Argumenty do funkcji przekazywane są przez wartość; wyjątkiem są obiekty – te przekazywane są przez referencję.

Dodatkowe funkcje do pracy z typami

Funkcja isNaN() sprawdza czy argument nie zawiera wartości NaN (Not a Number), czyli nie jest liczbą.

Zatem:
isNaN(25) – zwróci wartość false (jest liczbą)

var a1 = „x”;
isNaN(a1) – zwróci wartość true (argument nie jest liczbą)

Ponadto mamy do dyspozycji (bardzo przydatne w niektórych sytuacjach) funkcje konwertujące. Funkcje te pozwalają wyciągnąć liczby (Integer lub Float) z wyrażenia, na przykład:

parseInt(5e1) – zwróci wartość 5
parseInt(-21a) – zwróci wartość -21
parseFloat(-2.3) – zwróci wartość -2.3
parseFloat(-12.1+5) – zwróci wartość -12

Literały i \u czyli wyraź to w Unicode!

Jest to specjalna notacja do wyrażania znaków.

Przykłady:

alert("A" === "\u0041");
alert('\u0041');
alert('\u0042'); // B

Funkcja eval()

Jest to funkcja, która interpretuje i wykonuje kod JavaScript zawarty w łańcuchu znaków, bez odniesienia do żadnego konkretnego obiektu.

Przykład – użycie funkcji eval():

// zwraca obiekt String zawierający wartość "2+4"
eval(new String("2+4"));

eval("2+4");  // zwraca 6

zmienna = "10+2*4";

// zmienna2 będzie wynosiła 18, będzie zmienną typu number.
zmienna2 = eval(zmienna);

Ponadto istnieje operator void, który określa wyrażenie, które ma zostać ocenione bez zwracania wartości. Innymi słowy wykonuje podane wyrażenie, po czym zwraca undefined. Możemy się z tym spotkać m.in. przy tworzeniu odnośników powiązanych z wywołaniem kodu JS:

<a href="javascript:void(jakas_funkcja())"></a>

Właściwości i metody globalne

Na koniec podsumowanie globalnych właściwości i metod w JavaScript.

Właściwości:
Infinity – nieskończoność

NaN – Not A Number – nie jest liczbą

undefined – niezdefiniowana wartość

Metody:
encodeURI – zakodowanie URI

decodeURI – odkodowanie zakodowanego URI

encodeURIComponent – zakodowanie komponentu URI

decodeURIComponent – odkodowanie komponentu URI

eval – wykonanie podanego łańcuch jako kod JavaScript

isFinite – określa, czy podano poprawną liczbę skończoną; zwraca false gdy wartość jest +infinity, -infinity lub NaN

isNaN – czy jest NaN

oraz parseInt i parseFloat zaprezentowane powyżej.

Przykłady użycia:

// encode URI:
var uri = encodeURI("testowy test.php?id=7&amp;state=correct");
alert(uri);

// uri = testowy%20test.php?id=7state=ok

d_uri = decodeURI(uri); // odkodowanie

Na ten moment to wszystko w 3. części podstaw JavaScript. W kolejnej omówimy nieco rozleglej takie tematy jak instrukcje warunkowe, pętle, czyli generalnie sterowanie przebiegiem programu.

Dziękuję za uwagę.

Dominik Wlazłowski

Programista WWW i aplikacji mobilnych z wieloletnim doświadczeniem, początkujący bloger. Pasjonat programowania, nowych technologii, e-commerce, a także sportu i motoryzacji.