Η JavaScript ως γλώσσα προγραμματισμού για αρχάριους

Κώδικας, πληροφορίες, ερωτήσεις και απαντήσεις σχετικές με την JavaScript.

Συντονιστές: WebDev Moderators, Super-Moderators

Άβαταρ μέλους
skeftomilos
Script Master
Δημοσιεύσεις: 2888
Εγγραφή: 07 Ιαν 2005 07:22
Τοποθεσία: Αθήνα

Η JavaScript ως γλώσσα προγραμματισμού για αρχάριους

Δημοσίευση από skeftomilos » 24 Απρ 2005 04:38

Βεβαίως, κανένα πρόβλημα. JavaScript και JScript είναι το ίδιο και το αυτό. Η ίδια ρουτίνα που θα τρέξει client-side στον browser ως JavaScript, θα τρέξει το ίδιο καλά στο server ως JScript σε σελίδα ASP, ή ως JScript Windows utility. Αρκεί να μη χρησιμοποιήσεις ορισμένες επιπλέον δυνατότητες της JScript όπως το ActiveXObject, γιατί θα τρέξουν μόνο στον Internet Explorer. Η JavaScript είναι μία γλώσσα προγραμματισμού γενική χρήσης, και ο πυρήνας της είναι εντελώς τυποποιημένος. Τα προβλήματα και οι ασυμβατότητες αφορούν τα συγκεκριμένα object models που υιοθετούν οι διάφοροι browsers. Θεωρητικά υπάρχει κι εδώ τυποποίηση, αλλά στην πράξη υπάρχουν μικρές αποκλίσεις. Για να γίνω πιο συγκεκριμένος, ένας προγραμματιστής JavaScript που γράφει κώδικα για HTML σελίδες, έχει στη διάθεσή του τα εξής:

α) Τον πυρήνα (Core) της γλώσσας JavaScript. Περιλαμβάνει τα βασικά αντικείμενα όπως Array, Date, Math, RegExp, String κ.λπ., τους τελεστές όπως + - / * ++ && || κ.λπ. και τις εντολές όπως for, while, if ... else, function, return κ.λπ. Με τον πυρήνα μπορείς να κάνεις κάθε είδους εσωτερικούς υπολογισμούς και μετασχηματισμούς, αλλά δε μπορείς να αλληλεπιδράσεις με το χρήστη. Δε μπορείς ούτε να ζητήσεις δεδομένα ούτε να εμφανίσεις πληροφορίες στην οθόνη. Είναι απόλυτα τυποποιημένος με την προδιαγραφή ECMA. Το reference της Microsoft είναι πολύ ικανοποιητική πηγή πληροφοριών για τον πυρήνα, αλλά όχι για τα υπόλοιπα.

β) Το "παραδοσιακό" Object Model, γνωστό και με το όνομα DOM0. Το βασικό πακέτο αντικειμένων, ιδιοτήτων και μεθόδων υποστηρίζεται από όλους τους browsers, αλλά δεν ισχύει το ίδιο για μερικά δευτερεύοντα αντικείμενα. Το βασικότερο αντικείμενο είναι το window, και με τις μεθόδους window.alert(), window.confirm() και window.prompt() μπορείς να εμφανίσεις μηνύματα στο χρήστη. Με το αντικείμενο location μπορείς να διαβάσεις την τρέχουσα διεύθυνση (URL) και να κάνεις redirection. Με το document μπορείς να προσθέσεις HTML κώδικα στη σελίδα με document.write(), καθώς και να έχεις πρόσβαση στις φόρμες της σελίδας και τα στοιχεία <input> που περιέχουν. Ως παράδειγμα ασυμβατότητας φέρνω το αντικείμενο navigator που έχει ιδιότητες userLanguage και systemLanguage στον IE, δεν έχει στον Firefox, και έχει μόνο της πρώτη στον Opera. Προσωπικά προσπαθώ να αποφεύγω αυτές τις προβληματικές καταστάσεις. Ως reference για το DOM0 χρησιμοποιώ το Client-Side JavaScript Reference 1.3 (PDF, 6.6M) της Netscape, το οποίο αν και κάπως παλιό (1999) με έχει βολέψει πολύ (περιλαμβάνει και τον πυρήνα). Από τον Guide (PDF, 3.2M) της ίδιας έκδοσης έμαθα τη γλώσσα. Σημειώνω πάντως ότι η τελευταία έκδοση είναι η 1.5 και έχει ορισμένες προσθήκες σε σχέση με την 1.3. Μία συνοπτική εικόνα του DOM0 μπορείς να πάρεις στη σελίδα 7 του Traditional JavaScript Object Models (PDF, 1.0M). Επίσης περιέχεται σε όλα τα βιβλία για JavaScript.

γ) Το Document Object Model (DOM1), που επεκτείνει το "παραδοσιακό" Object Model σε βαθμό που κάνει δυνατή κάθε είδους μεταβολή που μπορεί να φανταστεί κανείς σε μία web σελίδα. Η πιο χρήσιμες εντολές είναι η μέθοδος getElementById του αντικειμένου document, και η ιδιότητα innerHTML που έχουν σχεδόν όλα τα στοιχεία της σελίδας. Για παράδειγμα αν υπάρχει στη σελίδα ένα <span> με συγκεκριμένο id, μπορείς με το DOM1 να αλλάζεις το περιεχόμενό του κατά βούληση:

Κώδικας: Επιλογή όλων

<html>
  <body>
    <span id="user"></span>
    <script>
      document.getElementById&#40;"user"&#41;.innerHTML = "<b>Χρήστης&#58; " + window.prompt&#40;"Το όνομά σας?"&#41; + "</b>"
    </script>
  </body>
</html>
Όλοι οι σύγχρονοι browsers υποστηρίζουν πλήρως το DOM1. Υπάρχουν και τα DOM2 και DOM3 με ακόμα περισσότερες επεκτάσεις, που μάλλον δε θα τις χρησιμοποιούσες κι αν ακόμα ήταν διαθέσιμες. Ως αναφορά για το DOM1 χρησιμοποιώ το επίσημο reference (PDF, 538K) του W3C που είναι πλήρες, αν και κάπως υπερβολικά σχολαστικό. Οι σελίδες 135 ως 159 είναι οι πιο ενδιαφέρουσες.
The pure and simple truth is rarely pure and never simple. Ο μη νους δε σκέπτεται μη σκέψεις για το τίποτα.

Άβαταρ μέλους
xultimatex
Honorary Member
Δημοσιεύσεις: 2505
Εγγραφή: 26 Ιούλ 2003 13:02
Τοποθεσία: Ξάνθη
Επικοινωνία:

Η JavaScript ως γλώσσα προγραμματισμού για αρχάριους

Δημοσίευση από xultimatex » 24 Απρ 2005 10:29

Ευχαριστώ πολύ skeftomilos!
Θα διαβάσω το guide για να τη μάθω επιτέλους αυτή τη γλώσσα!
Το guide αναφέρεται και σε scripting για utilities ή μόνο web;
Άλλη μια ερώτηση: Αν φορτώσω ένα script σε μια σελίδα από εξωτερική πηγή μπορεί κάποιος επισκέπτης να το διαβάσει;
Και κάτι άλλο, υπάρχει τρόπος για να ορίσω σε μια μεταβλητή όλο τον κώδικα της σελίδας μου; Έψαξα στο reference αλλά τίποτα.
:arrow: Αν προσπαθείς πολύ για να πετύχεις κάτι, ίσως το κάνεις με λάθος τρόπο...

Άβαταρ μέλους
skeftomilos
Script Master
Δημοσιεύσεις: 2888
Εγγραφή: 07 Ιαν 2005 07:22
Τοποθεσία: Αθήνα

Η JavaScript ως γλώσσα προγραμματισμού για αρχάριους

Δημοσίευση από skeftomilos » 24 Απρ 2005 12:24

Ο Guide της Netscape είναι προσανατολισμένος στο Web. Τα utilities είναι συνδεδεμένα κυρίως με τη δυνατότητα πρόσβασης στο δίσκο (δημιουργία, αντιγραφή, διαγραφή αρχείων) κάτι που δεν μπορεί να γίνει ούτε με τον πυρήνα της γλώσσας, ούτε με το Object Model του browser (ευτυχώς!). Γι αυτό το σκοπό η Microsoft έχει φτιάξει το ActiveX αντικείμενο FileSystemObject, το οποίο μπορείς να χρησιμοποιήσεις με JScript που θα τρέχει από τον Windows Script Host (WSH). Μπορείς να πάρεις μία πρώτη γέυση από το άρθρο Φτιάξτε μόνοι σας χρήσιμα utilities με JavaScript. Το reference της Microsoft περιγράφει πλήρως το FileSystemObject, μαζί με παραδείγματα για τη χρήση του. Εκτός από reference είναι και πολύ καλός Guide για τον πυρήνα της γλώσσας, αλλά δε θα μάθεις τίποτα για το Web από εκεί!
xultimatex έγραψε:Αν φορτώσω ένα script σε μια σελίδα από εξωτερική πηγή μπορεί κάποιος επισκέπτης να το διαβάσει;
Πάντα μπορεί. Ο απλούστερος τρόπος είναι να κάνει save τη σελίδα και να βρει μετά το js αρχείο στο φάκελο <pagename>_files που δημιουργείται ταυτόχρονα. Μπορείς με διάφορα τεχνάσματα να το κάνεις δυσκολότερο για το 99% των χρηστών να το βρουν και να το διαβάσουν, αλλά τελικά το script κατεβαίνει πάντα στον client σε μορφή απλού κειμένου, επομένως δε θα μπορέσεις να εμποδίσεις τον αποφασισμένο χρήστη να διαβάσει ένα αρχείο που βρίσκεται στο δικό του μηχάνημα! Αν έχεις σοβαρούς λόγους να προστατέψεις τον κώδικά σου από αδιάκριτα βλέμματα θα πρέπει να καταφύγεις σε τεχνικές obfuscation δηλαδή συντακτικής διαστρέβλωσης και παραμόρφωσης του κώδικα, διατηρώντας ωστόσο τη λειτουργική του επάρκεια. Αυτές οι τεχνικές απαιτούν κόπο και χρόνο, αυξάνουν το μέγεθος των scripts, και τελικά δεν τα προστατεύουν 100%.

Περιμένω να δω το πρώτο πρόγραμμά σου σε JavaScript! :wink:
The pure and simple truth is rarely pure and never simple. Ο μη νους δε σκέπτεται μη σκέψεις για το τίποτα.

Άβαταρ μέλους
xultimatex
Honorary Member
Δημοσιεύσεις: 2505
Εγγραφή: 26 Ιούλ 2003 13:02
Τοποθεσία: Ξάνθη
Επικοινωνία:

Η JavaScript ως γλώσσα προγραμματισμού για αρχάριους

Δημοσίευση από xultimatex » 24 Απρ 2005 15:13

Σαν να μαζεύω πολλά χρωστούμενα!!!
1)Χρωστάω στον EneMe μια δουλειά με επεξεργασία μουσικής.
2)Χρωστάω κάτι από VB
3)Τώρα, χρωστάω και μια δουλειά JavaScript!
Πρέπει να κουραστώ αυτό το μεσημέρι :lol: :lol: :lol: :lol:
Δεν μου απάντησες όμως σ'αυτό που με καίει! Πως μπορώ να δώσω ως τιμή σε μια μεταβλητή όλο τον HTML κώδικα της σελίδας; Γίνεται;
:arrow: Αν προσπαθείς πολύ για να πετύχεις κάτι, ίσως το κάνεις με λάθος τρόπο...

Άβαταρ μέλους
skeftomilos
Script Master
Δημοσιεύσεις: 2888
Εγγραφή: 07 Ιαν 2005 07:22
Τοποθεσία: Αθήνα

Η JavaScript ως γλώσσα προγραμματισμού για αρχάριους

Δημοσίευση από skeftomilos » 25 Απρ 2005 16:26

Αν θέλεις όλο τον κώδικα της σελίδας, δηλαδή ό,τι είναι μέσα στο tag <html>:

Κώδικας: Επιλογή όλων

var s = document.documentElement.innerHTML
... ή αν προτιμάς:

Κώδικας: Επιλογή όλων

var s = document.getElementsByTagName&#40;"html"&#41;&#91;0&#93;.innerHTML
Αν θέλεις μόνο τα περιεχόμενα του tag <body>:

Κώδικας: Επιλογή όλων

var s = document.body.innerHTML
... ή πάλι αν προτιμάς:

Κώδικας: Επιλογή όλων

var s = document.getElementsByTagName&#40;"body"&#41;&#91;0&#93;.innerHTML
The pure and simple truth is rarely pure and never simple. Ο μη νους δε σκέπτεται μη σκέψεις για το τίποτα.

Άβαταρ μέλους
xultimatex
Honorary Member
Δημοσιεύσεις: 2505
Εγγραφή: 26 Ιούλ 2003 13:02
Τοποθεσία: Ξάνθη
Επικοινωνία:

Η JavaScript ως γλώσσα προγραμματισμού για αρχάριους

Δημοσίευση από xultimatex » 25 Απρ 2005 20:27

Τhnx skeftomilos! Τώρα, για να αρχίσω να μαθαίνω αυτό το θυμόσουν ή το βρήκες κάπου; Αν δεν το θυμόσουν, που το βρήκες;
:arrow: Αν προσπαθείς πολύ για να πετύχεις κάτι, ίσως το κάνεις με λάθος τρόπο...

Άβαταρ μέλους
skeftomilos
Script Master
Δημοσιεύσεις: 2888
Εγγραφή: 07 Ιαν 2005 07:22
Τοποθεσία: Αθήνα

Η JavaScript ως γλώσσα προγραμματισμού για αρχάριους

Δημοσίευση από skeftomilos » 26 Απρ 2005 02:44

Όλες οι παραπάνω είναι ιδιότητες του DOM1, και είναι αρκετά σημαντικές ώστε να τις θυμάμαι απ'έξω. Μπορείς να τις βρεις στο DOM1 Specification (PDF, 538K) που αναφέρω και παραπάνω, και συγκεκριμένα στις σελίδες 135, 136 και 140. Αρκετά χρήσιμη πηγή στην πράξη είναι και ένα standard tool του Firefox, ο DOM Inspector, που βρίσκεται στο μενού Tools. Δείχνει όχι μόνο όλη των ιεραρχία του DOM της κάθε σελίδας, αλλά και τις τρέχουσες τιμές όλων των ιδιοτήτων!
The pure and simple truth is rarely pure and never simple. Ο μη νους δε σκέπτεται μη σκέψεις για το τίποτα.

Άβαταρ μέλους
ThyClub
Honorary Member
Δημοσιεύσεις: 5312
Εγγραφή: 17 Νοέμ 2003 00:21
Τοποθεσία: Hell's Kitchen
Επικοινωνία:

Η JavaScript ως γλώσσα προγραμματισμού για αρχάριους

Δημοσίευση από ThyClub » 26 Απρ 2005 09:14

skeftomilos έρχεσαι να σε βάλω στην βιβλιοθήκη μου;;
:D :D :D

Άβαταρ μέλους
skeftomilos
Script Master
Δημοσιεύσεις: 2888
Εγγραφή: 07 Ιαν 2005 07:22
Τοποθεσία: Αθήνα

Η JavaScript ως γλώσσα προγραμματισμού για αρχάριους

Δημοσίευση από skeftomilos » 11 Ιουν 2005 23:23

Το site www.w3schools.com περιέχει tutorials για κάθε είδους τεχνολογία που χρησιμοποιείται στο διαδίκτυο, τα οποία είναι γραμμένα ώστε να είναι κατάλληλα για αρχάριους. Θα βρείτε tutorials για JavaScript, HTML, CSS, VBScript, ASP, PHP, XML και πολλά άλλα. Το μόνο πρόβλημα είναι ότι πρέπει να είστε συνδεδεμένοι στο Internet για να τα διαβάσετε, και ότι έχει αρκετές διαφημίσεις. Μπορείτε λοιπόν να το κατεβάσετε ολόκληρο (σχεδόν) από αυτή τη διεύθυνση σε μορφή chm, και να το διαβάσετε με την ησυχία σας (3,3MB).
:wink:

Εικόνα

________________________________________

EDIT: 16/6/2005

Το ανέβασα ξανά για άλλες επτά μέρες. Αν το θέλει κανείς αργότερα ας μου κάνει ένα PM.
The pure and simple truth is rarely pure and never simple. Ο μη νους δε σκέπτεται μη σκέψεις για το τίποτα.

Άβαταρ μέλους
Greggold
Δημοσιεύσεις: 64
Εγγραφή: 10 Σεπ 2005 11:40
Τοποθεσία: Ελλάδα- Ελλαδίτσα μου

Η JavaScript ως γλώσσα προγραμματισμού για αρχάριους

Δημοσίευση από Greggold » 17 Σεπ 2005 10:31

Συγχαρητήρια και από εμένα skeftomilos. Το όλο άρθρο είναι πολύ ενδιαφ'ερον και για αρχάριους.
Έχω όμως μία απορία: γιατί όταν τον ίδιο κώδικα τον αποθηκεύουμε με μορφή *.js εμφανίζεται σε ένα παράθυρο ενώ όταν τον αποθηκεύουμε με μορφή *.htm ανοίγει στον browser.

Επίσης θα ήθελα να ρωτήσω αν το εγγραφο με την εμφάνιση της ημερομηνίας θέλουμε να το αποθηκεύσουμε *.js και αλλάξουμε την γλώσσα η ημερομηνία θα εμφανιστεί στην άλλη γλώσσα όπως συνέβη και όταν αλλάξαμε την γλώσσα στον browser?????

Τέλος όσο αφορά τους ανθρώπους που μαθαίνουν μόνοι τους κάποιαγλώσσα, όχι μόνο είμαστε η πλειοψηφία αλλά και πάνω από το διπλάσιο από αυτούς που το μαθαίνουν με βοήθεια δασκάλου.......... :kaloe: :kaloe: :kaloe: :kaloe: :kaloe: :kaloe: :pint: :pint: :pint:

Άβαταρ μέλους
xultimatex
Honorary Member
Δημοσιεύσεις: 2505
Εγγραφή: 26 Ιούλ 2003 13:02
Τοποθεσία: Ξάνθη
Επικοινωνία:

Η JavaScript ως γλώσσα προγραμματισμού για αρχάριους

Δημοσίευση από xultimatex » 17 Σεπ 2005 11:18

Skeftomile, επειδή μόλις τώρα είδα το τελυταίο σου post ( παρ'όλο που πέρασαν κάποιοι μήνες) δε μπορώ να κατεβάσω το chm γιατί έχει λήξη. Αν το έχεις ακόμα μπορείς να το ξανανεβάσεις για να το πάρω;
:arrow: Αν προσπαθείς πολύ για να πετύχεις κάτι, ίσως το κάνεις με λάθος τρόπο...

Άβαταρ μέλους
skeftomilos
Script Master
Δημοσιεύσεις: 2888
Εγγραφή: 07 Ιαν 2005 07:22
Τοποθεσία: Αθήνα

Η JavaScript ως γλώσσα προγραμματισμού για αρχάριους

Δημοσίευση από skeftomilos » 17 Σεπ 2005 13:35

@xultimatex: It's up and waiting! :) [link]

@Greggold: Έχει διαφορετική εμφάνιση γιατί στην κάθε περίπτωση τρέχει από δύο διαφορετικά προγράμματα (interpreters). Η JavaScript είναι interpreted και δεν τρέχει μόνη της. Στη μια περίπτωση την τρέχει ο browser, στην άλλη ένα άλλο πρόγραμμα με όνομα Windows Script Host. Στην πρώτη περίπτωση χρησιμοποιούμε τη JavaScript για να "ζωντανέψουμε" τις σελίδες μας, στη δεύτερη για να φτιάξουμε Windows utilities. Υπάρχουν και άλλες χρήσεις για τη γλώσσα, καθώς και άλλοι Interpreters. Για να πάρεις μια ιδέα για τις δυνατότητες που υπάρχουν μπορείς να δεις και ένα άλλο κείμενο σχετικό με Windows utilities (το έχω κάνει link και πιο πάνω).

Για την άλλη ερώτηση (για τις γλώσσες) θα πρότεινα να το δοκιμάσεις ο ίδιος. :) Δοκιμάζοντας θα μάθεις σίγουρα περισσότερα.

Διαβάζοντας πριν λίγο .NET έμαθα ότι η JScript μπορεί να γίνει compile και να δώσει executable προγράμματα .NET. Είναι καλό αυτό; Δε νομίζω! Μια γλώσσα δε μπορεί να κάνει το ίδιο καλά τα πάντα, και για Windows προγραμματισμό .NET η VB.NET και η C# είναι καλύτερες επιλογές. Ωστόσο η χρήση JScript για σελίδες ASP.NET μοιάζει αρκετά ενδιαφέρουσα.

EDIT: Link updated.
Τελευταία επεξεργασία από το μέλος skeftomilos την 24 Οκτ 2011 02:26, έχει επεξεργασθεί 1 φορά συνολικά.
The pure and simple truth is rarely pure and never simple. Ο μη νους δε σκέπτεται μη σκέψεις για το τίποτα.

giorgt
Δημοσιεύσεις: 1
Εγγραφή: 27 Νοέμ 2005 16:19

Η JavaScript ως γλώσσα προγραμματισμού για αρχάριους

Δημοσίευση από giorgt » 27 Νοέμ 2005 16:30

mporei kapoios na mou protinei kapoio programa gia na ksekiniso na grafo javascript (thelo na kanei kai debug)

Άβαταρ μέλους
Rapid-eraser
WebDev Moderator
Δημοσιεύσεις: 6851
Εγγραφή: 05 Απρ 2003 17:50
Τοποθεσία: Πειραιάς
Επικοινωνία:

Η JavaScript ως γλώσσα προγραμματισμού για αρχάριους

Δημοσίευση από Rapid-eraser » 27 Νοέμ 2005 16:54

Firefox me to Web developer plugin + notepad/DW
H prosopiki mou epilogi :)
Cu, Rapid-eraser, Tα αγαθά copies κτώνται.
Love is like oxygen, You get too much you get too high
Not enough and you're gonna die, Love gets you high

Άβαταρ μέλους
skeftomilos
Script Master
Δημοσιεύσεις: 2888
Εγγραφή: 07 Ιαν 2005 07:22
Τοποθεσία: Αθήνα

Η JavaScript ως γλώσσα προγραμματισμού για αρχάριους

Δημοσίευση από skeftomilos » 28 Νοέμ 2005 02:13

Όλοι οι browsers δίνουν τον αριθμό της γραμμής που υπάρχει το λάθος, οπότε ένας editor με αρίθμηση γραμμών είναι πολύ χρήσιμος κατά τη γνώμη μου. Το Notepad2 είναι αρκετά καλό για μικρά αρχεία. Ως browser τελευταία το έχω γυρίσει στον IE γιατί πετάει αμέσως το λάθος ενώ στον Firefox πρέπει να ανοίξω τη σχετική κονσόλα. Πάντως τα μηνύματα λάθους του Firefox είναι πιο περιγραφικά, οπότε βοηθάνε περισσότερο στην αρχή. Σιγά-σιγά αναπτύσσεται η σχετική διαίσθηση που οδηγεί πιο γρήγορα στην πηγή του σφάλματος. :)
The pure and simple truth is rarely pure and never simple. Ο μη νους δε σκέπτεται μη σκέψεις για το τίποτα.

Απάντηση

Επιστροφή στο “JavaScript και Frameworks”

Μέλη σε σύνδεση

Μέλη σε αυτήν τη Δ. Συζήτηση: Δεν υπάρχουν εγγεγραμμένα μέλη και 0 επισκέπτες