|
|
<!--
|
|
|
CO_OP_TRANSLATOR_METADATA:
|
|
|
{
|
|
|
"original_hash": "90a3c32c3377f83ab750c2447c77ab98",
|
|
|
"translation_date": "2025-10-24T22:24:23+00:00",
|
|
|
"source_file": "2-js-basics/3-making-decisions/README.md",
|
|
|
"language_code": "bg"
|
|
|
}
|
|
|
-->
|
|
|
# Основи на JavaScript: Вземане на решения
|
|
|
|
|
|

|
|
|
|
|
|
> Скетч от [Tomomi Imura](https://twitter.com/girlie_mac)
|
|
|
|
|
|
Чудили ли сте се някога как приложенията вземат интелигентни решения? Например как навигационна система избира най-бързия маршрут или как термостат решава кога да включи отоплението? Това е основната концепция за вземане на решения в програмирането.
|
|
|
|
|
|
Точно както Аналитичната машина на Чарлз Бабидж е била проектирана да следва различни последователности от операции въз основа на условия, съвременните JavaScript програми трябва да правят избори въз основа на различни обстоятелства. Тази способност да се разклонява и да взема решения е това, което превръща статичния код в отзивчиви и интелигентни приложения.
|
|
|
|
|
|
В този урок ще научите как да внедрите условна логика във вашите програми. Ще разгледаме условни изрази, оператори за сравнение и логически изрази, които позволяват на вашия код да оценява ситуации и да реагира подходящо.
|
|
|
|
|
|
## Предварителен тест
|
|
|
|
|
|
[Предварителен тест](https://ff-quizzes.netlify.app/web/quiz/11)
|
|
|
|
|
|
Способността да се вземат решения и да се контролира потокът на програмата е основен аспект на програмирането. Тази секция обхваща как да контролирате пътя на изпълнение на вашите JavaScript програми, използвайки булеви стойности и условна логика.
|
|
|
|
|
|
[](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)!
|
|
|
|
|
|
## Кратко припомняне за булевите стойности
|
|
|
|
|
|
Преди да разгледаме вземането на решения, нека си припомним булевите стойности от предишния урок. Наречени на математика Джордж Бул, тези стойности представляват бинарни състояния – или `true`, или `false`. Няма двусмислие, няма средно положение.
|
|
|
|
|
|
Тези бинарни стойности са основата на цялата изчислителна логика. Всяко решение, което вашата програма взема, в крайна сметка се свежда до булева оценка.
|
|
|
|
|
|
Създаването на булеви променливи е лесно:
|
|
|
|
|
|
```javascript
|
|
|
let myTrueBool = true;
|
|
|
let myFalseBool = false;
|
|
|
```
|
|
|
|
|
|
Това създава две променливи с явни булеви стойности.
|
|
|
|
|
|
✅ Булевите стойности са наречени на английския математик, философ и логик Джордж Бул (1815–1864).
|
|
|
|
|
|
## Оператори за сравнение и булеви стойности
|
|
|
|
|
|
На практика рядко ще задавате булеви стойности ръчно. Вместо това ще ги генерирате, като оценявате условия: "Това число по-голямо ли е от онова?" или "Тези стойности равни ли са?"
|
|
|
|
|
|
Операторите за сравнение позволяват тези оценки. Те сравняват стойности и връщат булеви резултати въз основа на връзката между операндите.
|
|
|
|
|
|
| Символ | Описание | Пример |
|
|
|
| ------ | ---------------------------------------------------------------------------------------------------------------------------------------------------------- | ------------------ |
|
|
|
| `<` | **По-малко от**: Сравнява две стойности и връща булевата стойност `true`, ако стойността отляво е по-малка от тази отдясно | `5 < 6 // true` |
|
|
|
| `<=` | **По-малко или равно на**: Сравнява две стойности и връща булевата стойност `true`, ако стойността отляво е по-малка или равна на тази отдясно | `5 <= 6 // true` |
|
|
|
| `>` | **По-голямо от**: Сравнява две стойности и връща булевата стойност `true`, ако стойността отляво е по-голяма от тази отдясно | `5 > 6 // false` |
|
|
|
| `>=` | **По-голямо или равно на**: Сравнява две стойности и връща булевата стойност `true`, ако стойността отляво е по-голяма или равна на тази отдясно | `5 >= 6 // false` |
|
|
|
| `===` | **Строго равенство**: Сравнява две стойности и връща булевата стойност `true`, ако стойностите отдясно и отляво са равни И са от един и същ тип данни. | `5 === 6 // false` |
|
|
|
| `!==` | **Неравенство**: Сравнява две стойности и връща обратната булева стойност на това, което би върнал операторът за строго равенство | `5 !== 6 // true` |
|
|
|
|
|
|
✅ Проверете знанията си, като напишете няколко сравнения в конзолата на браузъра си. Изненадва ли ви някой от върнатите резултати?
|
|
|
|
|
|
## Условен оператор `if`
|
|
|
|
|
|
Операторът `if` е като задаване на въпрос в кода ви. "Ако това условие е вярно, тогава направи това." Вероятно това е най-важният инструмент, който ще използвате за вземане на решения в JavaScript.
|
|
|
|
|
|
Ето как работи:
|
|
|
|
|
|
```javascript
|
|
|
if (condition) {
|
|
|
// Condition is true. Code in this block will run.
|
|
|
}
|
|
|
```
|
|
|
|
|
|
Условието се поставя в скобите, и ако е `true`, JavaScript изпълнява кода в къдравите скоби. Ако е `false`, JavaScript просто пропуска целия блок.
|
|
|
|
|
|
Често ще използвате оператори за сравнение, за да създадете тези условия. Нека видим практически пример:
|
|
|
|
|
|
```javascript
|
|
|
let currentMoney = 1000;
|
|
|
let laptopPrice = 800;
|
|
|
|
|
|
if (currentMoney >= laptopPrice) {
|
|
|
// Condition is true. Code in this block will run.
|
|
|
console.log("Getting a new laptop!");
|
|
|
}
|
|
|
```
|
|
|
|
|
|
Тъй като `1000 >= 800` се оценява като `true`, кодът в блока се изпълнява, показвайки "Купувам нов лаптоп!" в конзолата.
|
|
|
|
|
|
## Условен оператор `if..else`
|
|
|
|
|
|
Но какво, ако искате програмата ви да направи нещо различно, когато условието е невярно? Тук идва `else` – това е като резервен план.
|
|
|
|
|
|
Операторът `else` ви дава начин да кажете "ако това условие не е вярно, направи това друго нещо вместо това."
|
|
|
|
|
|
```javascript
|
|
|
let currentMoney = 500;
|
|
|
let laptopPrice = 800;
|
|
|
|
|
|
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!");
|
|
|
}
|
|
|
```
|
|
|
|
|
|
Сега, тъй като `500 >= 800` е `false`, JavaScript пропуска първия блок и изпълнява блока `else`. Ще видите "Още не мога да си позволя нов лаптоп!" в конзолата.
|
|
|
|
|
|
✅ Тествайте разбирането си за този код и следващия код, като го изпълните в конзолата на браузъра. Променете стойностите на променливите currentMoney и laptopPrice, за да промените върнатия `console.log()`.
|
|
|
|
|
|
## Оператор `switch`
|
|
|
|
|
|
Понякога трябва да сравните една стойност с множество опции. Въпреки че можете да свържете няколко оператора `if..else`, този подход става тромав. Операторът `switch` предоставя по-чиста структура за обработка на множество отделни стойности.
|
|
|
|
|
|
Концепцията наподобява механичните системи за превключване, използвани в ранните телефонни централи – една входна стойност определя кой конкретен път ще следва изпълнението.
|
|
|
|
|
|
```javascript
|
|
|
switch (expression) {
|
|
|
case x:
|
|
|
// code block
|
|
|
break;
|
|
|
case y:
|
|
|
// code block
|
|
|
break;
|
|
|
default:
|
|
|
// code block
|
|
|
}
|
|
|
```
|
|
|
|
|
|
Ето как е структурирано:
|
|
|
- JavaScript оценява израза веднъж
|
|
|
- Преглежда всеки `case`, за да намери съвпадение
|
|
|
- Когато намери съвпадение, изпълнява този блок код
|
|
|
- `break` казва на JavaScript да спре и да излезе от switch
|
|
|
- Ако няма съвпадение, изпълнява блока `default` (ако има такъв)
|
|
|
|
|
|
```javascript
|
|
|
// Program using switch statement for day of week
|
|
|
let dayNumber = 2;
|
|
|
let dayName;
|
|
|
|
|
|
switch (dayNumber) {
|
|
|
case 1:
|
|
|
dayName = "Monday";
|
|
|
break;
|
|
|
case 2:
|
|
|
dayName = "Tuesday";
|
|
|
break;
|
|
|
case 3:
|
|
|
dayName = "Wednesday";
|
|
|
break;
|
|
|
default:
|
|
|
dayName = "Unknown day";
|
|
|
break;
|
|
|
}
|
|
|
console.log(`Today is ${dayName}`);
|
|
|
```
|
|
|
|
|
|
В този пример JavaScript вижда, че `dayNumber` е `2`, намира съответстващия `case 2`, задава `dayName` на "Вторник" и след това излиза от switch. Резултатът? "Днес е вторник" се записва в конзолата.
|
|
|
|
|
|
✅ Тествайте разбирането си за този код и следващия код, като го изпълните в конзолата на браузъра. Променете стойностите на променливата a, за да промените върнатия `console.log()`.
|
|
|
|
|
|
## Логически оператори и булеви стойности
|
|
|
|
|
|
Сложните решения често изискват оценка на множество условия едновременно. Точно както булевата алгебра позволява на математиците да комбинират логически изрази, програмирането предоставя логически оператори за свързване на множество булеви условия.
|
|
|
|
|
|
Тези оператори позволяват сложна условна логика чрез комбиниране на прости оценки true/false.
|
|
|
|
|
|
| Символ | Описание | Пример |
|
|
|
| ------ | -------------------------------------------------------------------------------------------- | --------------------------------------------------------------------- |
|
|
|
| `&&` | **Логическо И**: Сравнява два булеви израза. Връща true **само** ако и двете страни са верни | `(5 > 3) && (5 < 10) // И двете страни са верни. Връща true` |
|
|
|
| `\|\|` | **Логическо ИЛИ**: Сравнява два булеви израза. Връща true, ако поне една страна е вярна | `(5 > 10) \|\| (5 < 10) // Едната страна е невярна, другата е вярна. Връща true` |
|
|
|
| `!` | **Логическо НЕ**: Връща обратната стойност на булев израз | `!(5 > 10) // 5 не е по-голямо от 10, така че "!" го прави вярно` |
|
|
|
|
|
|
Тези оператори ви позволяват да комбинирате условия по полезни начини:
|
|
|
- И (`&&`) означава, че и двете условия трябва да са верни
|
|
|
- ИЛИ (`||`) означава, че поне едно условие трябва да е вярно
|
|
|
- НЕ (`!`) обръща true на false (и обратно)
|
|
|
|
|
|
## Условия и решения с логически оператори
|
|
|
|
|
|
Нека видим тези логически оператори в действие с по-реалистичен пример:
|
|
|
|
|
|
```javascript
|
|
|
let currentMoney = 600;
|
|
|
let laptopPrice = 800;
|
|
|
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 false. Code in this block will run.
|
|
|
console.log("Can't afford a new laptop, yet!");
|
|
|
}
|
|
|
```
|
|
|
|
|
|
В този пример: изчисляваме цена с 20% отстъпка (640), след това оценяваме дали наличните ни средства покриват или пълната цена, или цената с отстъпка. Тъй като 600 отговаря на прага за цена с отстъпка от 640, условието се оценява като вярно.
|
|
|
|
|
|
### Оператор за отрицание
|
|
|
|
|
|
Понякога е по-лесно да мислите за това, когато нещо НЕ е вярно. Например вместо да питате "Потребителят влязъл ли е?", може да искате да попитате "Потребителят НЕ е ли влязъл?" Операторът за отрицание (`!`) обръща логиката вместо вас.
|
|
|
|
|
|
```javascript
|
|
|
if (!condition) {
|
|
|
// runs if condition is false
|
|
|
} else {
|
|
|
// runs if condition is true
|
|
|
}
|
|
|
```
|
|
|
|
|
|
Операторът `!` е като да кажете "обратното на..." – ако нещо е `true`, `!` го прави `false`, и обратно.
|
|
|
|
|
|
### Тернарни изрази
|
|
|
|
|
|
За прости условни присвоявания JavaScript предоставя **тернарния оператор**. Този кратък синтаксис ви позволява да напишете условен израз в един ред, полезен когато трябва да присвоите една от две стойности въз основа на условие.
|
|
|
|
|
|
```javascript
|
|
|
let variable = condition ? returnThisIfTrue : returnThisIfFalse;
|
|
|
```
|
|
|
|
|
|
Чете се като въпрос: "Това условие вярно ли е? Ако да, използвай тази стойност. Ако не, използвай онази стойност."
|
|
|
|
|
|
Ето един по-осезаем пример:
|
|
|
|
|
|
```javascript
|
|
|
let firstNumber = 20;
|
|
|
let secondNumber = 10;
|
|
|
let biggestNumber = firstNumber > secondNumber ? firstNumber : secondNumber;
|
|
|
```
|
|
|
|
|
|
✅ Отделете минута, за да прочетете този код няколко пъти. Разбирате ли как работят тези оператори?
|
|
|
|
|
|
Ето какво казва този ред: "Първото число по-голямо ли е от второто число? Ако да, постави първото число в biggestNumber. Ако не, постави второто число в biggestNumber."
|
|
|
|
|
|
Тернарният оператор е просто по-кратък начин да напишете този традиционен оператор `if..else`:
|
|
|
|
|
|
```javascript
|
|
|
let biggestNumber;
|
|
|
if (firstNumber > secondNumber) {
|
|
|
biggestNumber = firstNumber;
|
|
|
} else {
|
|
|
biggestNumber = secondNumber;
|
|
|
}
|
|
|
```
|
|
|
|
|
|
И двата подхода произвеждат идентични резултати. Тернарният оператор предлага краткост, докато традиционната структура if-else може да бъде по-четима за сложни условия.
|
|
|
|
|
|
---
|
|
|
|
|
|
|
|
|
|
|
|
## 🚀 Предизвикателство
|
|
|
|
|
|
Създайте програма, която първо е написана с логически оператори, а след това я пренапишете, използвайки тернарен израз. Кой синтаксис предпочитате?
|
|
|
|
|
|
---
|
|
|
|
|
|
## Предизвикателство с GitHub Copilot Agent 🚀
|
|
|
|
|
|
Използвайте режим Agent, за да завършите следното предизвикателство:
|
|
|
|
|
|
**Описание:** Създайте цялостен калкулатор за оценки, който демонстрира множество концепции за вземане на решения от този урок, включително оператори if-else, оператори switch, логически оператори и тернарни изрази.
|
|
|
|
|
|
**Задача:** Напишете JavaScript програма, която приема числовата оценка на ученик (0-100) и определя неговата буквена оценка, използвайки следните критерии:
|
|
|
- A: 90-100
|
|
|
- B: 80-89
|
|
|
- C: 70-79
|
|
|
- D: 60-69
|
|
|
- F: Под 60
|
|
|
|
|
|
Изисквания:
|
|
|
1. Използвайте оператор if-else, за да определите буквена оценка
|
|
|
2. Използвайте логически оператори, за да проверите дали ученикът е преминал (оценка >= 60) И има отличен успех (оценка >= 90)
|
|
|
3. Използвайте оператор switch, за да предоставите специфична обратна връзка за всяка буквена оценка
|
|
|
4. Използвайте тернарен оператор, за да определите дали ученикът е допустим за следващия курс (оценка >= 70)
|
|
|
5. Включете проверка на входа, за да се уверите, че оценката е между 0 и 100
|
|
|
|
|
|
Тествайте програмата си с различни оценки, включително гранични случаи като 59, 60, 89, 90 и невалидни входове.
|
|
|
|
|
|
Научете повече за [режим Agent](https://code.visualstudio.com/blogs/2025/02/24/introducing-copilot-agent-mode) тук.
|
|
|
|
|
|
|
|
|
## Тест след лекцията
|
|
|
|
|
|
[Тест след лекцията](https://ff-quizzes.netlify.app/web/quiz/12)
|
|
|
|
|
|
## Преглед и самостоятелно обучение
|
|
|
|
|
|
Прочетете повече за многото налични оператори за потребителя [на MDN](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Operators).
|
|
|
|
|
|
Разгледайте чудесния [справочник за оператори на Джош Комо](https://joshwcomeau.com/operator-lookup/)!
|
|
|
|
|
|
## Задание
|
|
|
|
|
|
[Оператори](assignment.md)
|
|
|
|
|
|
---
|
|
|
|
|
|
**Отказ от отговорност**:
|
|
|
Този документ е преведен с помощта на AI услуга за превод [Co-op Translator](https://github.com/Azure/co-op-translator). Въпреки че се стремим към точност, моля, имайте предвид, че автоматизираните преводи може да съдържат грешки или неточности. Оригиналният документ на неговия роден език трябва да се счита за авторитетен източник. За критична информация се препоръчва професионален човешки превод. Ние не носим отговорност за каквито и да било недоразумения или погрешни интерпретации, произтичащи от използването на този превод. |