JavaScript Essentials: как да вземаме житейски решения с изявления if / else

Да речем, че вървите по оживена улица насред града. На път сте да пресечете пътя, когато забележите, че светофарът за пешеходци става червен. Какво правиш?

Спрете, нали?

И какво се случва, когато светлината отново стане зелена? Започваш да ходиш.

И ние можем да включим тази аналогия в код. Звучи нещо като: „Ако светлината стане червена, спрете да ходите. В противен случай продължете да ходите ”.

И това, приятелю, е в основата на изявлението if / else.

Изявлението if / else

Изявлението if / else помага да се контролира какво прави вашата програма в определени ситуации. Изглежда така:

ако (условие) {
  // Направи нещо
} else {
  // Направете някакво друго нещо
}

Условието казва JavaScript за какво да проверите, преди да продължите. Ако условието се оцени като вярно, JavaScript изпълнява кода в блока if.

Ако условието се оцени на невярно, JavaScript изпълнява код от блока else.

В примера на светофара проверяваме дали светлината е червена:

// Забележка: Този пример все още не съдържа валиден код
ако (светлината е червена) {
  спри да ходиш
} else {
  продължете да ходите
}

Ако трябва да проверите за повече от едно условие, можете да използвате друго, ако, което минава между ако и друго.

Кога ще имате нужда от такова второ условие?

Е, нека кажем, че искате да пресечете малък път. Ако няма коли наоколо, ще изчакате ли светофара да стане зелен? Все още пресичаш, нали?

В код това ще изглежда така:

ако (светлината е червена) {
  // Спрете да ходите
} else if (коли наоколо) {
  // Спрете да ходите
} else if (още едно условие) {
  // Направете още нещо
} else {
  // Направете финалното нещо
}

В този случай, ако първото условие се оцени като истина, JavaScript изпълнява кода в блока if.

Ако първото условие се оцени на невярно, JavaScript проверява състоянието в следващия, ако е блок, и вижда дали то оценява на истина. Продължава и продължава, докато всички останали, ако блоковете са изчерпани.

За да провери дали условието се оценява като вярно или невярно, JavaScript разчита на две неща:

  1. Оператори за сравнение
  2. Истинни и фалшиви стойности

Нека първо да поговорим за операторите за сравнение

Оператори за сравнение

Има четири основни типа оператори за сравнение:

  1. По-голям от (>) или по-голям или равен на (> =)
  2. По-малък от (<) или по-малък или равен на (<=)
  3. Строго равно (===) или равно ==
  4. Строго неравен (! ==) или неравен! =

Първите два типа оператори за сравнение са прави. Използвате ги за сравняване на числа.

24> 23 // Вярно
24> 24 // Неверни
24> = 24 // Вярно
24 <25 // Вярно
24 <24 // Неверни
24 <= 24 // Вярно

Следващите два типа оператори за сравнение също са доста ясни. Използвате ги, за да проверите дали нещата са равни или неравни помежду си.

24 === 24 // Вярно
24! == 24 // Неверни

Има обаче разлика между строго равен (===) спрямо равен (==) и строго неравен (! ==) спрямо неравен (! =):

'24' === 24 // Неверно
'24' == 24 // Вярно
'24'! == 24 // Вярно
'24'! = 24 // Неверни

Както можете да видите от примера по-горе, когато сравнявате низ от 24 спрямо числото 24, === оценява на невярно, докато == оценява на истина.

Защо е така? Нека да разгледаме разликата между строго равни и равни.

=== срещу == (или! == срещу! =)

JavaScript е свободно въведен език. Това означава, че когато декларираме променливи, не ни интересува какъв тип стойност влиза в променливата.

Можете да декларирате всеки примитив или обект, а JavaScript прави всичко останало за вас:

const aString = 'Някой низ "
const aNumber = 123
const aBoolean = true

Когато сравнява нещата със строго равен (===) или строго неравен (! ==), JavaScript проверява типа на променливата. Ето защо низ от 24 и число 24 не се равняват.

'24' === 24 // Неверно
'24'! == 24 // Вярно

Когато сравнявате неща с еднакви (==) или неравномерни (! =), JavaScript преобразува (или извежда) типовете, така че те съвпадат помежду си.

По принцип JavaScript се опитва да преобразува всички типове в числа, когато използвате оператор за преобразуване. В примера по-долу низът 24 се преобразува в число 24 преди сравнението.

Ето защо низ от 24 се равнява на число 24, когато използвате ==.

'24' == 24 // Вярно
'24'! = 24 // Неверни

Булевите също могат да бъдат преобразувани в числа. Когато JavaScript преобразува Booleans в числа, true става 1, а false - 0.

0 == false // Вярно
1 == true // Вярно
2 == true // Грешно

Автоматичното преобразуване на типа (при използване на оператори за сравнение) е една от честите причини за трудно откриваеми грешки. Винаги, когато сравнявате за равенство, винаги използвайте строгите версии (=== или! ==).

Сравняване на обекти и масиви

Опитайте да сравнявате обекти и масиви с === или ==. Ще бъдете много изненадани.

const a = {isHavingFun: true}
const b = {isHavingFun: true}
console.log (a === b) // false
console.log (a == b) // false

В горния пример и a, и b изглеждат абсолютно еднакви. И двамата са обекти, имат еднакви стойности.

Странното е, че a === b винаги ще бъде невярно. Защо?

Да речем, че имате идентичен брат / сестра близнак. Изглеждаш точно като близнака. Същият цвят на косата, същото лице, същите дрехи, същото всичко. Как хората могат да разграничат двете ви? Ще бъде трудно

В JavaScript всеки обект има „лична карта.“ Тази лична карта се нарича препратка към обекта. Когато сравнявате обекти с оператори за равенство, вие искате JavaScript да проверите дали двата обекта имат една и съща референция (една и съща лична карта).

Изненада ли е, че a === b винаги ще бъде невярно сега?

Нека да го ощипнем малко и да зададем a на b.

const a = {isHavingFun: true}
const b = a

В този случай a === b се оценява като true, тъй като b сега сочи към същата препратка като a.

console.log (a === b) // вярно

Truthy и Falsy

Ако напишете единична променлива (като hasApples в примера по-долу) като условие на изявление if / else, JavaScript проверява за truuthy или фалшива стойност.

const hasApples = 'true'
ако (hasApples) {
  // Яжте ябълка
} else {
  // Купете ябълки
}

Falsy стойност е стойност, която се оценява на false, когато се преобразува в булева. В JavaScript има шест възможни фалшиви стойности:

  1. фалшив
  2. неопределен
  3. нула
  4. 0 (числова нула)
  5. "" (празен низ)
  6. NaN (не е номер)

Стойност на тръба, от друга страна, е стойност, която се оценява като истинна, когато се преобразува в булева. В случай на числа, всичко, което не е 0, се превръща в истина.

Автоматичното преобразуване на тип в стойности на фалшиви и фалшиви се насърчава силно в JavaScript, тъй като те правят код по-кратък и по-лесен за разбиране.

Например, ако искате да проверите дали низът е празен, можете да използвате низ в състоянието веднага.

const str = ''
ако (str) {
  // Направете нещо, ако низът не е празен
} else {
  // Направете нещо, ако низът е празен
}

Обобщавайки

ако / else операторите се използват за контрол на това, което вашата програма прави в конкретни ситуации. Тя ви позволява да определите дали да ходите пеша или да пресичате пътя, в зависимост от условията, дадени ви.

За да провери дали дадено условие е вярно или невярно, Javascript разчита на две неща:

  1. оператори за сравнение
  2. стойности на фалшиви / фалшиви

Ако сте харесали тази статия, ще обичате да научите Научете JavaScript - курс, който ви помага да се научите да изграждате истински компоненти от нулата с Javascript. Кликнете тук, за да научите повече за Научете JavaScript, ако се интересувате.

(О, между другото, ако тази статия ви е харесала, ще се радвам, ако можете да я споделите. )

Първоначално публикуван в zellwk.com.