1. Κατηγορίες
  2. Ανάπτυξη Ιστοσελίδων
  3. Javascript
  4. Αντικείμενα

Αντικείμενα

Η javascript είναι αντικειμενοστραφής γλώσσα προγραμματισμού. Αυτό σημαίνει ότι ο χρήστης μπορεί να δημιουργήσει δικά του αντικείμενα ή να χρησιμοποιήσει εκείνα που διαθέτει ήδη η γλώσσα. Ένα αντικείμενο αποτελείται από ιδιότητες και μεθόδους. Οι ιδιότητες είναι κάποιες τιμές που συνδέονται με το αντικείμενο, ενώ οι μέθοδοι είναι συναρτήσεις που που συνδέονται με το αντικείμενο. Π.χ.

<body>
<script type="text/javascript">
    var txt = "Hello!";
    document.write(txt.length);
</script>
</body>

Δημιουργούμε τη μεταβλητή txt η οποία έχει σαν τιμή κείμενο (δηλαδή αλφαριθμητικό – String). Κάθε string έχει την ιδιότητα length, η οποία περιέχει τον αριθμό των χαρακτήρων από τους οποίους αποτελείται. Επομένω στο παραπάνω παράδειγμα, θα εμφανιστεί στην οθόνη ο αριθμός 6, όσα δηλαδή είναι τα γράμματα συν το θαυμαστικό.

Αναφέραμε ότι οι μέθοδοι είναι στην ουσία συναρτήσεις. Έτσι αν στο παραπάνω παράδειγμα, κάνουμε τη μετατροπή ως εξής:

<body>
<script type="text/javascript">
    var txt = "Hello!";
    document.write( txt.toUpperCase () );
</script>
</body>

Θα δούμε ότι η μέθοδος toUpperCase αναλαμβάνει τη μετατροπή των πεζών χαρακτήρων σε κεφαλαίων. Κατά σύμβαση, όλες οι ονομασίες των ιδιοτήτων και των μεθόδων της javascript ξεκινάνε με πεζό χαρακτήρα και σε κάθε λέξη που αλλάζει, το πρώτο γράμμα είναι κεφαλαίο (π.χ.  το toUpperCase αποτελείται από τις λέξεις to, upper και case καιι για ευκολία η javascript τις ξεχωρίζει μεταξύ τους με το πρώτο γράμμα κεφαλαίο από τη δεύτερη λέξη και μετά). Αυτό βοηθάει στην ανάγνωση των ονομασιών από το χρήστη.

Το αντικείμενο String
Χρησιμοποιείται για την αποθήκευση ακολουθίας χαρακτήρων σε μία μεταβλητή. Μπορεί να δημιουργηθεί με δύο τρόπους:

var txt = new String  ( 'hello' );
ή
var txt = 'hello';

Ιδιότητα

Περιγραφή

length

Επιστρέφει το μήκος των χαρακτήρων του string

 

Μέθοδος - Περιγραφή

Παράδειγμα

charAt (index)

Επιστρέφει το χαρακτήρα στην θέση που του ορίσουμε

var str = 'Hello';
document.write ( str.charAt ( 0 ) );

concat (string1, string2, ... stringN)

Ενώνει δύο ή παραπάνω strings

var str1 = "Hello";
var str2 = "World";
document.write ( str1.concat ( str2 ) );

indexOf (searchString, start)

Επιστρέφει τη θέση της πρώτης εμφάνισης μιας συγκεκριμένης τιμής μέσα σε ένα string

var str1 = "Hello";
var str2 = "ell";
document.write ( str1.indexOf ( str2, 0 ) );

lastIndexOf (searchString, start)

Επιστρέφει τη θέση της τελευταίας εμφάνισης μιας συγκεκριμένης τιμής μέσα σε ένα string

var str1 = "Hello";
var str2 = "ell";
document.write ( str1.lastIndexOf ( str2, 0 )

replace (substring, newstring)

 

Ψάχνει μία ακολουθία χαρακτήρων μέσα σε ένα string και την αντικαθιστά με την τιμή που θα του ορίσουμε

var string = "Hello World";
document.write ( string.replace ( 'Hello', 'Bye' ) );

search ( string)

Ψάχνει μία ακολουθία χαρακτήρων μέσα σε ένα string και επιστρέφει τη θέση εμφάνισής της στο string.

Επιστρέφει -1 σε περίπτωση που δεν βρει την ακολουθία.

var string = "Hello World";
document.write ( string.search ( 'World' ) );

slice (begin, end)

Εξάγει ένα μόνο μέρος από ένα string.

var string = "Hello World";
document.write ( string.slice ( 0, 3 ) );

split (separator, limit)

Χωρίζει το string βάσει κάποιου χαρακτήρα και τοποθετεί τα επιμέρους κομμάτια σε πίνακα

var string = "Hello World";
document.write ( string.split ( "l" ) );

substr (start, length)

Εξάγει τους χαρακτήρες ενός string από το σημείο και για όσους χαρακτήρες του έχουμε ορίσει

var string = "Hello World";
document.write ( string.substr ( 3, 4 ) );

toLowerCase ()

Μετατρέπει τους χαρακτήρες ενός string σε πεζούς.

var string = "Hello World";
document.write ( string.toLowerCase () );

toUpperCase ()

Μετατρέπει τους χαρακτήρες ενός string σε κεφαλαία.

var string = "Hello World";
document.write ( string.toUpperCase () );

 

Το αντικείμενο Date
Χρησιμοποιείται σε περιπτώσεις που σχετίζονται με ημερομηνίες ή / και ώρα. Υπάρχουν τέσσερις τρόποι για να δημιουργήσουμε ένα αντικείμενο date.

new Date (); // τρέχουσα ημερομηνία και ώρα
new Date ( milliseconds ); // τα milliseconds που έχουν περάσει από 1 Ιανουαρίου 1970
new Date ( dateString );
new Date ( year, month, day, hours, minutes, seconds, milliseconds );

Π.χ.
var today = new Date ();
var d1 = new Date ( "March 10, 2012 08:55:00" );
var d2 = new Date ( 12, 3, 10, 8, 55, 0 );

Μερικές από τις πιο συνήθεις μεθόδους του αντικειμένου Date είναι οι εξής:

Μέθοδος - Περιγραφή

Παράδειγμα

getDate ()

Επιστρέφει τη μέρα του μήνα (1 - 31)

var d = new Date ();
document.write ( d.getDate () );

getDay ()

Επιστρέφει τη μέρα της εβδομάδος (0 - 6)

var d = new Date ();
document.write ( d.getDay () );

getFullYear ()

Επιστρέφει τη χρονολογία (4 ψηφία)

var d = new Date ();
document.write ( d.getFullYear () );

getHours ()

Επιστρέφει την ώρα (0-23)

var d = new Date ();
document.write ( d.getHours () );

getMinutes ()

Επιστρέφει τα λεπτά (0-59)

var d = new Date ();
document.write ( d.getMinutes () );

getSeconds ()

Επιστρέφει τα δευτερόλεπτα (0-59)

var d = new Date ();
document.write ( d.getSeconds () );

setDate (1-31)

Θέτει την ημέρα του μήνα

var d = new Date ();
d.setDate ( 27 );
document.write ( d );

setFullYear (year)

Θέτει τη χρονολογία (4 ψηφία)

var d = new Date ();
d.setFullYear ( 2010 );
document.write ( d );

setHours (hour)

Θέτει τον αριθμό της ώρας (0-23)

var d = new Date ();
d.setHours ( 11 );
document.write ( d );

setMinutes (minutes)

Θέτει τον αριθμό των λεπτών (0-59)

var d = new Date ();
d.setMinutes ( 54 );
document.write ( d );

setSeconds (seconds)

Θέτει τον αριθμό των δευτερολέπτων (0-59)

var d = new Date ();
d.setSeconds ( 24 );
document.write ( d );

 

Το αντικείμενο Array

Το αντικείμενο Array (πίνακας) χρησιμοποιείται για την καταχώρηση πολλαπλών τιμών σε μία μεταβλητή. Ένας πίνακας μπορεί να δημιουργηθεί με τους εξής τρόπους:

var fruits = new Array ();
fruits [0] = 'apple';
fruits [1] = 'orange';
fruits [2] = 'banana';
document.write ( fruits );

ή

var fruits = new Array ( 'apple', 'orange', 'banana' );
document.write ( fruits );

ή

var fruits = [ 'apple', 'orange', 'banana' ];
document.write ( fruits );

Μπορούμε να προσπελάσουμε ένα στοιχείο του πίνακα με τη βοήθεια τη θέση καταχώρησης του στον πίνακα (κλειδί). Π.χ.

var fruits = [ 'apple', 'orange', 'banana' ];
document.write ( fruits [1] ); // Εμφανίζει την τιμή 'orange'

Ομοίως, μπορούμε να αλλάξουμε την τιμή ενός στοιχείου του πίνακα. Π.χ.

var fruits = [ 'apple', 'orange', 'banana' ];
fruits [1] = 'watermelon';
document.write ( fruits [1] );

Ιδιότητα

Περιγραφή

length

Επιστρέφει τον αριθμό των στοιχείων του πίνακα

 

Μέθοδος - Περιγραφή

Παράδειγμα

concat (array1, array2,..., arrayN)

Ενώνει δύο ή περισσότερους πίνακες και επιστρέφει το συνολικό πίνακα.

var fruits = [ 'apple', 'orange', 'banana' ];
var temp = [ 'watermelon', 'cherry' ];
document.write ( fruits.concat ( temp ) );

join (separator)

Ενώνει όλα τα στοιχεία ενός πίνακα σε ένα string, χωρίζοντάς τα με τον separator (προαιρετικό)

var fruits = [ 'apple', 'orange', 'banana' ];
document.write ( fruits.join ( '-' ) );

pop ()

Αφαιρεί το τελευταίο στοιχείο του πίνακα και το επιστρέφει

var fruits = [ 'apple', 'orange', 'banana' ];
document.write ( fruits + '<br />' );
document.write ( fruits.pop () + '<br />' );
document.write ( fruits );

push ()

Προσθέτει ένα στοιχείο στο τέλος του πίνακα και επιστρέφει το νέο αριθμό (μήκος) του πίνακα

var fruits = [ 'apple', 'orange', 'banana' ];
document.write ( fruits + '<br />' );
document.write ( fruits.push ( 'watermelon' ) + '<br />' );
document.write ( fruits );

reverse ()

Αντιστρέφει τη σειρά των στοιχείων του πίνακα

var fruits = [ 'apple', 'orange', 'banana' ];
document.write ( fruits + '<br />' );
fruits.reverse ();
document.write ( fruits );

shift ()

Αφαιρεί το πρώτο στοιχείο του πίνακα και το επιστρέφει

var fruits = [ 'apple', 'orange', 'banana' ];
document.write ( fruits + '<br />' );
document.write ( fruits.shift () + '<br />' );
document.write ( fruits );

slice (start, end)

Επιλέγει ένα κομμάτι του πίνακα και το επιστρέφει

var fruits = [ 'apple', 'orange', 'banana' ];
document.write ( fruits + '<br />' );
document.write ( fruits.slice ( 1, 3 ) + '<br />' );

unshift (element1, element2,..., elementN)

Προσθέτει ένα ή περισσότερα στοιχεία στον πίνακα και επιστρέφει το νέο του μήκος

var fruits = [ 'apple', 'orange', 'banana' ];
document.write ( fruits + '<br />' );
document.write ( fruits.unshift ( 'watermelon', 'cherry' ) + '<br />' );
document.write ( fruits );

 

Το αντικείμενο Math
Χρησιμοποιείται για την εκτέλεση μαθηματικών πράξεων.

Ιδιότητα

Περιγραφή

E

Ο αριθμός του euler (e = 2.718)

PI

Επιστρέφει την τιμή του π (περίπου 3.14)

SQRT2

Επιστρέφει την τετραγωνική ρίζα του 2 (περίπου 1.414)

 

Μέθοδος - Περιγραφή

Παράδειγμα

abs (x)

Επιστρέφει την απόλυτη τιμή του x

var x = -5;
document.write ( Math.abs ( x ) );

ceil (xo)

Επιστρέφει την στρογγυλοποιήμενη προς τα πάνω τιμή του x

var x = 3.4;
document.write ( Math.ceil ( x ) );

cos (x)

Επιστρέφει το συνημίτονο της τιμής x. Το x πρέπει να είναι σε ακτίνια

var x = 3;
document.write ( Math.cos ( x ) );

exp (x)

Επιστρέφει την τιμή του e υψωμένο στο x

var x = 1;
document.write ( Math.exp ( x ) );

floor (x)

Επιστρέφει την στρογγυλοποιημένη προς τα κάτω τιμή του x

var x = 2.8;
document.write ( Math.floor ( x ) );

log (x)

Επιστρέφει το νεπέριο λογάριθμο του x

var x = Math.E;
document.write ( Math.log ( x ) );

max (x1, x2,..., xN)

Επιστρέφει τον αριθμό με τη μέγιστη τιμή

var x1 = 3;
var x2 = 8;
var x3 = 4;
document.write ( Math.max ( x1, x2, x3 ) );

min (x1, x2,..., xN)

Επιστρέφει τον αριθμό με την ελάχιστη τιμή

var x1 = 3;
var x2 = 8;
var x3 = 4;
document.write ( Math.min ( x1, x2, x3 )

pow (x, y)

Επιστρέφει την τιμή του x υψωμένο στην τιμή του y

var x1 = 2;
var x2 = 4;
document.write ( Math.pow ( x1, x2 ) );

random ()

Επιστρέφει μία τυχαία δεκαδική τιμή ανάμεσα στο 0 και το 1.

var x = Math.random ();
document.write ( x )

round (x)

Επιστρέφει την στρογγυλοποιημένη τιμή του x

var x = 5.6;
document.write ( Math.round ( x ) );

sin (x)

 

Επιστρέφη το ημίτονο του x. Το x πρέπει να είναι σε ακτίνια

var x = 3;
document.write ( Math.sin ( x ) );

sqrt (x)

Επιστρέφει την τετραγωνική ρίζα του x

var x = 81;
document.write ( Math.sqrt ( x ) );

tan (x)

Επιστρέφει την εφαπτομένη του x

var x = 90;
document.write ( Math.tan ( x ) );