JavaScript JSON

JavaScript JSON

JSON σημαίνει JavaScript Object Notation. Είναι μια μορφή για την αποθήκευση και τη μεταφορά δεδομένων. JSON χρησιμοποιείται συχνά όταν στέλνουμε δεδομένα σε ένα διακομιστή. Η μορφή JSON είναι συντακτικά όμοια με τον κώδικα για τη δημιουργία αντικειμένων JavaScript. Εξαιτίας αυτής της ομοιότητας, μπορούμε να μετατρέψουμε εύκολα τα δεδομένα JSON σε αντικείμενα JavaScript. Τα JSON δεδομένα είναι γραμμένα σε ζεύγη όνομα/τιμή(“firstName”:”ΓΙΑΝΝΗΣ”). Τα αντικείμενα JSON είναι γραμμένα μέσα άγκιστρα( {“firstName”:”ΝΙΚΟΣ”, “lastName”:”ΝΙΚΟΥ”} ). Οι πίνακες JSON είναι γραμμένοι μέσα σε αγκύλες( “employees”:[
{“firstName”:”ΝΙΚΟΣ”, “lastName”:”ΝΙΚΟΥ”},
{“firstName”:”ΜΑΡΙΑ”, “lastName”:”ΜΑΡΙΑΣ”}] ).
Για τη μετατροπή απο JSON σε Javascript μορφή υπάρχει η συνάρτηση JSON.parse().

 

Δοκιμάστε!

 

JavaScript Debugging

JavaScript Debugging(εντοπισμός σφαλμάτων)

Είναι δύσκολο να γράψουμε κώδικα JavaScript χωρίς πρόγραμμα εντοπισμού σφαλμάτων. Ο κώδικας μας ενδέχεται να περιέχει σφάλματα σύνταξης ή λογικά σφάλματα. Συχνά, όταν ο κώδικας της JavaScript περιέχει σφάλματα δεν υπάρχουν μηνύματα λάθους και δεν έχουμε καμία ένδειξη πού να ψάξουμε. Το ψάξιμο για τα λάθη στον κώδικα μας ονομάζεται Debugging. Το Debugging δεν είναι εύκολο, αλλά ευτυχώς, όλα τα σύγχρονα προγράμματα περιήγησης έχουν ενσωματωμένο Debugger. Στο Chrome, firefox, ie πατήστε το πλήκτρο F12, στην Opera πατήστε τον συνδυασμό πλήκτρων ctrl+shift+c. Στο Debugger μπορούμε να ορίσουμε σημεία διακοπής (σημεία όπου σταματάει η εκτέλεση κώδικα), και να εξετάσουμε τις μεταβλητές, ενώ ο κώδικας μας εκτελείται.

 

Δοκιμάστε!

 

JavaScript Ημερομηνίες

JavaScript Ημερομηνίες

Το object Date(ημερομηνία) μας επιτρέπει να δουλεύουμε με ημερομηνίες (χρόνια, μήνες, ημέρες, ώρες, λεπτά, δευτερόλεπτα, και χιλιοστά του δευτερολέπτου). Στη JavaScript η ημερομηνία μπορεί να γραφτεί σαν κείμενο Mon Apr 18 2016 07:51:46 GMT+0300 (Θερινή ώρα GTB) ή σαν αριθμός 1460955106780 που είναι τα χιλιοστά του δευτερολέπτου από την 1η Ιανουαρίου 1970, 00:00:00. Κατά τον καθορισμό μιας ημερομηνίας, αν δεν προσδιορίζουμε τη χρονική ζώνη, η JavaScript χρησιμοποιεί τη χρονική ζώνη του προγράμματος περιήγησης.

 

Δοκιμάστε!

 

JavaScript Math Object

JavaScript Math Object

Το object Math μας επιτρέπει να εκτελούμε μαθηματικές πράξεις, περιλαμβάνει διάφορες μαθηματικές μεθόδους.

 

Δοκιμάστε!

 

JavaScript Regular Expressions

JavaScript Regular Expressions

Μια Regular Expression(κανονική έκφραση) είναι μια ακολουθία χαρακτήρων που σχηματίζει ένα μοτίβο αναζήτησης που μπορεί να χρησιμοποιηθεί για την αναζήτηση και αντικατάσταση κειμένου.

 

Δοκιμάστε!

 

JavaScript For Loop(Επαναλήψεις)

JavaScript For Loop(Επαναλήψεις)

Οι δηλώσεις επανάληψης εκτελούν ένα κομμάτι κώδικα πολλές φορές. Η Javascript υποστηρίζει τα εξής είδη επαναλήψεων: for, while.

 

Δοκιμάστε!

 

JavaScript If…Else

JavaScript If…Else

Οι δηλώσεις επιλογής If…Else χρησιμοποιούνται για την εκτέλεση διαφόρων εντολών που βασίζονται σε διαφορετικές συνθήκες. Στην Javascript υπάρχουν οι δηλώσεις επιλογής: if, else, else if, switch.

 

Δοκιμάστε!

 

JavaScript Array Methods

JavaScript Array Methods

Στην προηγούμενη ανάρτηση μιλήσαμε για τους JavaScript arrays, θα συνεχίσουμε με τις JavaScript Array Methods. Θα αναφερθούμε στις μεθόδους toString(), join(), pop(), push(), shift(), unshift(), splice(), sort() , reverse().

 

Δοκιμάστε!

 

JavaScript Arrays(Πίνακες)

JavaScript Arrays(Πίνακες)

Οι JavaScript arrays χρησιμοποιούνται για να αποθηκεύουν πολλές τιμές σε μία μεταβλητή. Μπορείτε να έχετε πρόσβαση στις τιμές με τη χρήση ενός index(cars[0]). Μπορούν να περιέχουν objects, functions και άλλους arrays(myArray[0] = Date.now, myArray[1] = Function1, myArray[2] = Car1).Η πραγματική δύναμη των JavaScript arrays είναι στο ότι περιέχουν ιδιότητες και μεθόδους(cars.length , cars.sort()).Οι JavaScript arrays χρησιμοποιούν αριθμούς για indexes, ενώ τα objects χρησιμοποιούν ονόματα για indexes.

 

Δοκιμάστε!

 

JavaScript Objects(Αντικείμενα)

JavaScript Objects(Αντικείμενα)

Στην πραγματική ζωή, ένα αυτοκίνητο είναι ένα αντικείμενο. Ένα αυτοκίνητο έχει ιδιότητες όπως το βάρος και το χρώμα, και μεθόδους, όπως εκκίνηση και στάση. Όλα τα αυτοκίνητα έχουν τις ίδιες ιδιότητες, αλλά οι τιμές τους διαφέρουν. Όλα τα αυτοκίνητα έχουν τις ίδιες μεθόδους, αλλά οι μέθοδοι εκτελούνται σε διαφορετικούς χρόνους. Στη JavaScript τα Objects είναι μεταβλητές που περιέχουν πολλές τιμές. Οι τιμές αναγράφονται name:value(όνομα:τιμή) και είναι οι ιδιότητες. Οι μέθοδοι είναι ενέργειες που μπορούν να εκτελεστούν σε αντικείμενα και αποθηκεύονται σε function definitions(ορισμούς συναρτήσεων). Μπορείτε να αποκτήσετε πρόσβαση στις ιδιότητες ενός αντικειμένου με δύο τρόπους(objectName.propertyName ή objectName[“propertyName”]). Μπορείτε να αποκτήσετε πρόσβαση σε μια μέθοδο με την ακόλουθη σύνταξη: objectName.methodName().

 

Δοκιμάστε!

 

JavaScript Functions

JavaScript Functions

Είναι μπλοκ κώδικα σχεδιασμένα για να εκτελούν μια συγκεκριμένη εργασία. Ορίζονται με τη λέξη-κλειδί function, που ακολουθείται από ένα όνομα και παρενθέσεις (). Τα ονόματα των function μπορούν να περιέχουν γράμματα, ψηφία, παύλες. Οι παρενθέσεις περιλαμβάνουν τα ονόματα των παραμέτρων χωρισμένα με κόμμα: (παράμετρος1, παράμετρος2, …). Ο κώδικας που πρέπει να εκτελεστούν τοποθετείται μέσα σε αγκύλες: {}.

 

Δοκιμάστε!

 

JavaScript – Τύποι δεδομένων

JavaScript Τύποι δεδομένων

Οι Τύποι δεδομένων στην JavaScript είναι String, Number, Boolean, Array, Object.
Στον προγραμματισμό οι τύποι δεδομένων είναι μια σημαντική έννοια, για να κάνουμε πράξεις πρέπει να γνωρίζουμε το τύπο δεδομένων. Η JavaScript έχει dynamic τύπους δεδομένων, αυτό σημαίνει πως η ίδια μεταβλητή μπορεί να χρησιμοποιηθεί με διαφορετικούς τύπους.

 

Δοκιμάστε!

 

Javascript – Syntax

Javascript – Syntax

Όταν μιλάμε για σύνταξη(syntax) στην javascript εννοούμε το σύνολο των κανόνων για τη κατασκευή προγραμμάτων. Το πρόγραμμα ενός υπολογιστή είναι μια λίστα “οδηγιών” που πρέπει να “εκτελούνται” από τον υπολογιστή. Σε μια γλώσσα προγραμματισμού, αυτές οι οδηγίες ονομάζονται δηλώσεις, στη Javascript οι δηλώσεις διαχωρίζονται με ερωτηματικά. Οι δηλώσεις αποτελούνται από Values, Operators, Expressions, Keywords, and Comments.

 

Δοκιμάστε!

 

JavaScript – Έξοδος

JavaScript-Έξοδος

H JavaScript δεν έχει εσωτερικές functions για εκτύπωση ή εμφάνιση δεδομένων. Μπορούμε να “δούμε” τα δεδομένα με τη χρήση των: window.alert(), document.write() , innerHTML, console.log().

 

Δοκιμάστε!

 

JavaScript – Δήλωση, functions, events

JavaScript – Δήλωση

H JavaScript μπορεί να τοποθετηθεί στα body και head τμήματα μιας ιστοσελίδας. Στην HTML, ο κώδικας JavaScript πρέπει να βρίσκετε μεταξύ των στοιχείων script και /script.

JavaScript functions και events

Η JavaScript function είναι ένα μπλοκ κώδικα που εκτελείτε όταν “ζητηθεί”(καλεστεί). Για παράδειγμα μία function μπορεί να εκτελεστεί όταν συμβεί ένα γεγονός όπως το click του ποντικιού από ένα χρήστη.

 

Δοκιμάστε!

 

JavaScript – Εισαγωγή

JavaScript – Εισαγωγή

Η JavaScript είναι μια από τις 3 γλώσσες που πρέπει να γνωρίζουν οι web developers. Πρώτη είναι η HTML που καθορίζει το περιεχόμενο των ιστοσελίδων, δεύτερη η CSS που καθορίζει την διάταξη των ιστοσελίδων και τρίτη η Javascript για να προγραμματίσετε τη συμπεριφορά των ιστοσελίδων. Η JavaScript είναι η πιο δημοφιλής γλώσσα προγραμματισμού στον κόσμο και είναι εύκολη στην εκμάθηση. Ας δούμε μερικά παραδείγματα χρήσης της Javascript.

 

Δοκιμάστε!

 

Tip: JavaScript και Java είναι εντελώς διαφορετικές γλώσσες, τόσο σε σύλληψη και σχεδιασμό.

 

Μαθήματα προγραμματισμού και σχεδιασμού ιστοσελίδων – HTML αρχεία, επικεφαλίδες, παράγραφοι, σύνδεσμοι, εικόνες.

website-647013_1920

Θα ξεκινήσουμε μία σειρά μαθημάτων προγραμματισμού και σχεδιασμού ιστοσελίδων για ηλικίες από 6 μέχρι 106 ετών. Ο προγραμματισμός είναι για όλους, όχι μόνο για αυτούς που τελειώσαν μία σχολή πληροφορικής. Τα παιδιά μας πρέπει να ξεκινήσουν να μαθαίνουν γλώσσες προγραμματισμού από το δημοτικό. Κατά την έναρξη του σχολικού έτους το 2014 τα κρατικά σχολεία της Αγγλίας άρχισαν να διδάσκουν στους μαθητές τους αλγορίθμους. Αποφάσισαν ότι το πρόγραμμα σπουδών του κρατικού σχολείου πρέπει να εμπλουτισθεί με την εκμάθηση προγραμματισμού. Πιστεύουν ότι τα παιδιά δεν πρέπει μόνο να καταναλώνουν την τεχνολογία, αλλά να τη δημιουργούν. Να σταματήσουν να χάνουν το χρόνο τους στα κοινωνικά δίκτυα αλλά να δημιουργούν τα δικά τους προγράμματα. Τα πρώτα μαθήματα μας  είναι στις γλώσσες HTML, CSS και Javascript που είναι απαραίτητες για την δημιουργία ιστοσελίδων.

Τί είναι η HTML;
Η HTML είναι μια γλώσσα σήμανσης(markup) για την περιγραφή των ιστοσελίδων.
HTML σημαίνει Hyper Text Markup Language.
Μια γλώσσα σήμανσης είναι ένα σύνολο από ετικέτες σήμανσης.
Τα έγγραφα HTML περιγράφονται με ετικέτες HTML.
Κάθε ετικέτα HTML περιγράφει διαφορετικό περιεχόμενο του εγγράφου.

HTML Αρχεία
Τα HTML αρχεία ξεκινάνε με <html> και τελειώνουν με </html>.
Τα ορατά μέρη του HTML κειμένου βρίσκονται μεταξύ του <body> και </body>.

Δοκιμάστε!

 

HTML Επικεφαλίδες
Οι επικεφαλίδες HTML ορίζονται με τις ετικέτες < h1 > έως < h6 >.

Δοκιμάστε!

 

HTML παράγραφοι
Οι παράγραφοι HTML ορίζονται με την ετικέτα < p >.

Δοκιμάστε!

 

HTML Σύνδεσμοι
Οι παράγραφοι HTML ορίζονται με την ετικέτα < a >.

Δοκιμάστε!

 

HTML Εικόνες
Οι παράγραφοι HTML ορίζονται με την ετικέτα < img>.
Το αρχείο προέλευσης ( src ) , το εναλλακτικό κείμενο ( ALT ) και το μέγεθος ( πλάτος και ύψος) είναι τα χαρακτηριστικά τους.

Δοκιμάστε!

 

Καλή επιτυχία!!
Σε επόμενη ανάρτηση θα συνεχίσουμε με άλλα χαρακτηριστικά της HTML.