|
|
<!--
|
|
|
CO_OP_TRANSLATOR_METADATA:
|
|
|
{
|
|
|
"original_hash": "f7009631b73556168ca435120a231c98",
|
|
|
"translation_date": "2025-08-29T07:13:28+00:00",
|
|
|
"source_file": "2-js-basics/3-making-decisions/README.md",
|
|
|
"language_code": "el"
|
|
|
}
|
|
|
-->
|
|
|
# Βασικά Στοιχεία JavaScript: Λήψη Αποφάσεων
|
|
|
|
|
|
|
|
|
|
|
|
> Σκίτσο από την [Tomomi Imura](https://twitter.com/girlie_mac)
|
|
|
|
|
|
## Κουίζ Πριν το Μάθημα
|
|
|
|
|
|
[Κουίζ πριν το μάθημα](https://ff-quizzes.netlify.app/web/quiz/11)
|
|
|
|
|
|
Η λήψη αποφάσεων και ο έλεγχος της σειράς εκτέλεσης του κώδικά σας καθιστούν τον κώδικα επαναχρησιμοποιήσιμο και ανθεκτικό. Αυτή η ενότητα καλύπτει τη σύνταξη για τον έλεγχο της ροής δεδομένων στη JavaScript και τη σημασία της όταν χρησιμοποιείται με Boolean τύπους δεδομένων.
|
|
|
|
|
|
[](https://youtube.com/watch?v=SxTp8j-fMMY "Λήψη Αποφάσεων")
|
|
|
|
|
|
> 🎥 Κάντε κλικ στην παραπάνω εικόνα για ένα βίντεο σχετικά με τη λήψη αποφάσεων.
|
|
|
|
|
|
> Μπορείτε να παρακολουθήσετε αυτό το μάθημα στο [Microsoft Learn](https://docs.microsoft.com/learn/modules/web-development-101-if-else/?WT.mc_id=academic-77807-sagibbon)!
|
|
|
|
|
|
## Μια Σύντομη Ανακεφαλαίωση για τα Booleans
|
|
|
|
|
|
Τα Booleans μπορούν να έχουν μόνο δύο τιμές: `true` ή `false`. Τα Booleans βοηθούν στη λήψη αποφάσεων για το ποιες γραμμές κώδικα θα εκτελεστούν όταν πληρούνται ορισμένες συνθήκες.
|
|
|
|
|
|
Ορίστε το boolean σας ως true ή false όπως παρακάτω:
|
|
|
|
|
|
`let myTrueBool = true`
|
|
|
`let myFalseBool = false`
|
|
|
|
|
|
✅ Τα Booleans πήραν το όνομά τους από τον Άγγλο μαθηματικό, φιλόσοφο και λογικό George Boole (1815–1864).
|
|
|
|
|
|
## Τελεστές Σύγκρισης και Booleans
|
|
|
|
|
|
Οι τελεστές χρησιμοποιούνται για την αξιολόγηση συνθηκών κάνοντας συγκρίσεις που θα δημιουργήσουν μια Boolean τιμή. Ακολουθεί μια λίστα με τελεστές που χρησιμοποιούνται συχνά.
|
|
|
|
|
|
| Σύμβολο | Περιγραφή | Παράδειγμα |
|
|
|
| ------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------- | ------------------ |
|
|
|
| `<` | **Μικρότερο από**: Συγκρίνει δύο τιμές και επιστρέφει την Boolean τιμή `true` αν η τιμή στα αριστερά είναι μικρότερη από τη δεξιά | `5 < 6 // true` |
|
|
|
| `<=` | **Μικρότερο ή ίσο με**: Συγκρίνει δύο τιμές και επιστρέφει την Boolean τιμή `true` αν η τιμή στα αριστερά είναι μικρότερη ή ίση με τη δεξιά | `5 <= 6 // true` |
|
|
|
| `>` | **Μεγαλύτερο από**: Συγκρίνει δύο τιμές και επιστρέφει την Boolean τιμή `true` αν η τιμή στα αριστερά είναι μεγαλύτερη από τη δεξιά | `5 > 6 // false` |
|
|
|
| `>=` | **Μεγαλύτερο ή ίσο με**: Συγκρίνει δύο τιμές και επιστρέφει την Boolean τιμή `true` αν η τιμή στα αριστερά είναι μεγαλύτερη ή ίση με τη δεξιά | `5 >= 6 // false` |
|
|
|
| `===` | **Αυστηρή ισότητα**: Συγκρίνει δύο τιμές και επιστρέφει την Boolean τιμή `true` αν οι τιμές στα δεξιά και αριστερά είναι ίσες ΚΑΙ είναι του ίδιου τύπου δεδομένων | `5 === 6 // false` |
|
|
|
| `!==` | **Ανισότητα**: Συγκρίνει δύο τιμές και επιστρέφει την αντίθετη Boolean τιμή από αυτή που θα επέστρεφε ο τελεστής αυστηρής ισότητας | `5 !== 6 // true` |
|
|
|
|
|
|
✅ Ελέγξτε τις γνώσεις σας γράφοντας μερικές συγκρίσεις στην κονσόλα του προγράμματος περιήγησής σας. Σας εκπλήσσει κάποιο από τα δεδομένα που επιστρέφονται;
|
|
|
|
|
|
## Δήλωση If
|
|
|
|
|
|
Η δήλωση if θα εκτελέσει τον κώδικα που βρίσκεται ανάμεσα στα μπλοκ της αν η συνθήκη είναι true.
|
|
|
|
|
|
```javascript
|
|
|
if (condition) {
|
|
|
//Condition is true. Code in this block will run.
|
|
|
}
|
|
|
```
|
|
|
|
|
|
Οι λογικοί τελεστές χρησιμοποιούνται συχνά για τη δημιουργία της συνθήκης.
|
|
|
|
|
|
```javascript
|
|
|
let currentMoney;
|
|
|
let laptopPrice;
|
|
|
|
|
|
if (currentMoney >= laptopPrice) {
|
|
|
//Condition is true. Code in this block will run.
|
|
|
console.log("Getting a new laptop!");
|
|
|
}
|
|
|
```
|
|
|
|
|
|
## Δήλωση If..Else
|
|
|
|
|
|
Η δήλωση `else` θα εκτελέσει τον κώδικα που βρίσκεται ανάμεσα στα μπλοκ της όταν η συνθήκη είναι false. Είναι προαιρετική με μια δήλωση `if`.
|
|
|
|
|
|
```javascript
|
|
|
let currentMoney;
|
|
|
let laptopPrice;
|
|
|
|
|
|
if (currentMoney >= laptopPrice) {
|
|
|
//Condition is true. Code in this block will run.
|
|
|
console.log("Getting a new laptop!");
|
|
|
} else {
|
|
|
//Condition is false. Code in this block will run.
|
|
|
console.log("Can't afford a new laptop, yet!");
|
|
|
}
|
|
|
```
|
|
|
|
|
|
✅ Δοκιμάστε την κατανόησή σας για αυτόν τον κώδικα και τον παρακάτω κώδικα εκτελώντας τον στην κονσόλα ενός προγράμματος περιήγησης. Αλλάξτε τις τιμές των μεταβλητών currentMoney και laptopPrice για να αλλάξετε το αποτέλεσμα του `console.log()`.
|
|
|
|
|
|
## Δήλωση Switch
|
|
|
|
|
|
Η δήλωση `switch` χρησιμοποιείται για την εκτέλεση διαφορετικών ενεργειών με βάση διαφορετικές συνθήκες. Χρησιμοποιήστε τη δήλωση `switch` για να επιλέξετε ένα από τα πολλά μπλοκ κώδικα που θα εκτελεστούν.
|
|
|
|
|
|
```javascript
|
|
|
switch (expression) {
|
|
|
case x:
|
|
|
// code block
|
|
|
break;
|
|
|
case y:
|
|
|
// code block
|
|
|
break;
|
|
|
default:
|
|
|
// code block
|
|
|
}
|
|
|
```
|
|
|
|
|
|
```javascript
|
|
|
// program using switch statement
|
|
|
let a = 2;
|
|
|
|
|
|
switch (a) {
|
|
|
case 1:
|
|
|
a = "one";
|
|
|
break;
|
|
|
case 2:
|
|
|
a = "two";
|
|
|
break;
|
|
|
default:
|
|
|
a = "not found";
|
|
|
break;
|
|
|
}
|
|
|
console.log(`The value is ${a}`);
|
|
|
```
|
|
|
|
|
|
✅ Δοκιμάστε την κατανόησή σας για αυτόν τον κώδικα και τον παρακάτω κώδικα εκτελώντας τον στην κονσόλα ενός προγράμματος περιήγησης. Αλλάξτε τις τιμές της μεταβλητής a για να αλλάξετε το αποτέλεσμα του `console.log()`.
|
|
|
|
|
|
## Λογικοί Τελεστές και Booleans
|
|
|
|
|
|
Οι αποφάσεις μπορεί να απαιτούν περισσότερες από μία συγκρίσεις και μπορούν να συνδυαστούν με λογικούς τελεστές για να παραχθεί μια Boolean τιμή.
|
|
|
|
|
|
| Σύμβολο | Περιγραφή | Παράδειγμα |
|
|
|
| ------- | --------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------- |
|
|
|
| `&&` | **Λογικό AND**: Συγκρίνει δύο Boolean εκφράσεις. Επιστρέφει true **μόνο** αν και οι δύο πλευρές είναι true | `(5 > 6) && (5 < 6 ) //Μία πλευρά είναι false, η άλλη είναι true. Επιστρέφει false` |
|
|
|
| `\|\|` | **Λογικό OR**: Συγκρίνει δύο Boolean εκφράσεις. Επιστρέφει true αν τουλάχιστον μία πλευρά είναι true | `(5 > 6) \|\| (5 < 6) //Μία πλευρά είναι false, η άλλη είναι true. Επιστρέφει true` |
|
|
|
| `!` | **Λογικό NOT**: Επιστρέφει την αντίθετη τιμή μιας Boolean έκφρασης | `!(5 > 6) // 5 δεν είναι μεγαλύτερο από 6, αλλά το "!" θα επιστρέψει true` |
|
|
|
|
|
|
## Συνθήκες και Αποφάσεις με Λογικούς Τελεστές
|
|
|
|
|
|
Οι λογικοί τελεστές μπορούν να χρησιμοποιηθούν για τη δημιουργία συνθηκών σε δηλώσεις if..else.
|
|
|
|
|
|
```javascript
|
|
|
let currentMoney;
|
|
|
let laptopPrice;
|
|
|
let laptopDiscountPrice = laptopPrice - laptopPrice * 0.2; //Laptop price at 20 percent off
|
|
|
|
|
|
if (currentMoney >= laptopPrice || currentMoney >= laptopDiscountPrice) {
|
|
|
//Condition is true. Code in this block will run.
|
|
|
console.log("Getting a new laptop!");
|
|
|
} else {
|
|
|
//Condition is true. Code in this block will run.
|
|
|
console.log("Can't afford a new laptop, yet!");
|
|
|
}
|
|
|
```
|
|
|
|
|
|
### Τελεστής Άρνησης
|
|
|
|
|
|
Μέχρι τώρα έχετε δει πώς μπορείτε να χρησιμοποιήσετε μια δήλωση `if...else` για να δημιουργήσετε λογική συνθηκών. Οτιδήποτε εισάγεται σε μια δήλωση `if` πρέπει να αξιολογείται ως true/false. Χρησιμοποιώντας τον τελεστή `!` μπορείτε να _αντιστρέψετε_ την έκφραση. Θα μοιάζει κάπως έτσι:
|
|
|
|
|
|
```javascript
|
|
|
if (!condition) {
|
|
|
// runs if condition is false
|
|
|
} else {
|
|
|
// runs if condition is true
|
|
|
}
|
|
|
```
|
|
|
|
|
|
### Τριαδικές Εκφράσεις
|
|
|
|
|
|
Η δήλωση `if...else` δεν είναι ο μόνος τρόπος για να εκφράσετε λογική αποφάσεων. Μπορείτε επίσης να χρησιμοποιήσετε κάτι που ονομάζεται τριαδικός τελεστής. Η σύνταξή του μοιάζει κάπως έτσι:
|
|
|
|
|
|
```javascript
|
|
|
let variable = condition ? <return this if true> : <return this if false>
|
|
|
```
|
|
|
|
|
|
Παρακάτω είναι ένα πιο απτό παράδειγμα:
|
|
|
|
|
|
```javascript
|
|
|
let firstNumber = 20;
|
|
|
let secondNumber = 10;
|
|
|
let biggestNumber = firstNumber > secondNumber ? firstNumber : secondNumber;
|
|
|
```
|
|
|
|
|
|
✅ Αφιερώστε ένα λεπτό για να διαβάσετε αυτόν τον κώδικα μερικές φορές. Καταλαβαίνετε πώς λειτουργούν αυτοί οι τελεστές;
|
|
|
|
|
|
Ο παραπάνω κώδικας δηλώνει ότι:
|
|
|
|
|
|
- αν το `firstNumber` είναι μεγαλύτερο από το `secondNumber`
|
|
|
- τότε εκχωρήστε το `firstNumber` στο `biggestNumber`
|
|
|
- αλλιώς εκχωρήστε το `secondNumber`.
|
|
|
|
|
|
Η τριαδική έκφραση είναι απλώς ένας συμπαγής τρόπος γραφής του παρακάτω κώδικα:
|
|
|
|
|
|
```javascript
|
|
|
let biggestNumber;
|
|
|
if (firstNumber > secondNumber) {
|
|
|
biggestNumber = firstNumber;
|
|
|
} else {
|
|
|
biggestNumber = secondNumber;
|
|
|
}
|
|
|
```
|
|
|
|
|
|
---
|
|
|
|
|
|
## 🚀 Πρόκληση
|
|
|
|
|
|
Δημιουργήστε ένα πρόγραμμα που γράφεται πρώτα με λογικούς τελεστές και στη συνέχεια ξαναγράψτε το χρησιμοποιώντας μια τριαδική έκφραση. Ποια σύνταξη προτιμάτε;
|
|
|
|
|
|
---
|
|
|
|
|
|
## Κουίζ Μετά το Μάθημα
|
|
|
|
|
|
[Κουίζ μετά το μάθημα](https://ff-quizzes.netlify.app/web/quiz/12)
|
|
|
|
|
|
## Ανασκόπηση & Αυτομελέτη
|
|
|
|
|
|
Διαβάστε περισσότερα για τους πολλούς τελεστές που είναι διαθέσιμοι στον χρήστη [στο MDN](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Operators).
|
|
|
|
|
|
Δείτε τον υπέροχο [οδηγό τελεστών](https://joshwcomeau.com/operator-lookup/) του Josh Comeau!
|
|
|
|
|
|
## Εργασία
|
|
|
|
|
|
[Τελεστές](assignment.md)
|
|
|
|
|
|
---
|
|
|
|
|
|
**Αποποίηση Ευθύνης**:
|
|
|
Αυτό το έγγραφο έχει μεταφραστεί χρησιμοποιώντας την υπηρεσία αυτόματης μετάφρασης [Co-op Translator](https://github.com/Azure/co-op-translator). Παρόλο που καταβάλλουμε προσπάθειες για ακρίβεια, παρακαλούμε να έχετε υπόψη ότι οι αυτόματες μεταφράσεις ενδέχεται να περιέχουν λάθη ή ανακρίβειες. Το πρωτότυπο έγγραφο στη μητρική του γλώσσα θα πρέπει να θεωρείται η αυθεντική πηγή. Για κρίσιμες πληροφορίες, συνιστάται επαγγελματική ανθρώπινη μετάφραση. Δεν φέρουμε ευθύνη για τυχόν παρεξηγήσεις ή εσφαλμένες ερμηνείες που προκύπτουν από τη χρήση αυτής της μετάφρασης. |
