Switch statement haina utifauti na if else ama kiweka if. Chukulia mfano huu hapa
Unatakiwa uandae program ya dictionary, yenyewe utaandika neno kwa kiswahili kisha utaletewa kiongereza chake.
Ili kutengeneza program hii tutakwendabkutumia maneno yafuatayo kama mfano
Father - baba
Mother - mama
Sister - dada
Uncle - mjomba
Aunt - shangazi
Nephew or cousin - mpwa
Cousin - binamu
Brother - kaka
Sasa program hii tutaanza kuitengeneza kwa kutumia if tupu, kama ambavyo tuliona katika somo lililotangaulia. Pia unaweza kutumia else if kama tulivyojifunza.
<html>
<head>
<title>Mafunzo ya javascript</title>
</head>
<body>
<script>
let neno = prompt("weka neno la kiswahili kwa herufi ndogo");
if(neno == 'baba'){
document.write("<b style='color:blue'>Father</b>");
}
if(neno == 'mama'){
document.write("<b style='color:blue'>mother</b>");
}
if(neno == 'dada'){
document.write("<b style='color:blue'>sister</b>");
}
if(neno == 'mjomba'){
document.write("<b style='color:blue'>uncle</b>");
}
if(neno == 'shangazi'){
document.write("<b style='color:blue'>aunt</b>");
}
if(neno == 'mpwa'){
document.write("<b style='color:blue'>nephew or cousin</b>");
}
if(neno == 'kaka'){
document.write("<b style='color:blue'>brother</b>");
}
</script>
</body>
</html>
Hapo utaona kuna changamoto kuu 2
- Kwanza kila wakati tumerudia rudia kuweka condition if(neno==)
- Pili hata ukitumia else ili kuhusisha manono yasio na mfanano haitakaa sawa. Maana result ya else itakuwa inajirudia
Sasa ili tuweze kupambana na hali hii ndipo tutatumia switch ambapo itaturahisishia kuthibiti changamoto hizo.
Jinsi ya kutengeneza switch
Utaanza na neno switch likifuatiwa na mabano switch () ndani ya mabano utaweka statement katika hii statement utaweka kile ambacho unakwenda kukitest. Inaweza kuwa variable ama chochote kila kitakachokuwepo kwenye statement hio. switch(statement) baada ya hapo itafuatiwa mabano{} kisha ndipo tutaanza kutest condition ambayo tutaiita value kwa kutumia neno case 'condition' utamalizia na nukta pacha : baada ya hapo utafuata kuandika statement yako yaani nini kitokee kwenye hiyo case.
switch(statement){
case value 1:
statement
case value 2:
statement
case value 3:
statement
}
Sasa wacha tuone mfano wetu wa kwanza kwa kutumia switch
<html>
<head>
<title>Mafunzo ya javascript</title>
</head>
<body>
<script>
let neno = prompt("weka neno la kiswahili kwa herufi ndogo");
switch(neno){
case'baba':
document.write("<h1>Father<h1>")
case'mama':
document.write("<h1>Mother<h1>")
case'dada':
document.write("<h1>Sister<h1>")
case'kaka':
document.write("<h1>Brother<h1>")
case'mjomba':
document.write("<h1>Uncle<h1>")
case'shangazi':
document.write("<h1>Aunt<h1>")
case'mpwa':
document.write("<h1>Nephew or niece<h1>")
}
</script>
</body>
</html>
Saaa hapo utaona kuna changamoto mbili kwenye hizo code:-
Kwanza code baada ya kuonyesha matokeo ya inputi zinaendelea kufanya kazi. Utaona hapo nimeweka neno baba sasa ikaniletea jibu father kisha ikaendelea kukaliza na list iliyobaki kutokea kwa baba.
Ili kutatua changamoto hii tutatumia break keyword yaani baada ya matokeo code zinatakiwa zi stop kufanya kazi.
Pili hapo hatukuweza kuthibiti endapo mtu ataandika ambacho hakina mfanano. Kwa mfano hapo uliandika mbuzi haitaleta majibu yeyote.
Ili kutatua tatizo hili tutatumia default keyword ambayo mi sawa na else kama tulivyoona somo lililotangalia. Hivyo basi kanuni nzima itakuwa hivi. Hii default itafanyabkazi endapo mtu ataandika kitu chochote ambacho hakipo kwenye list.
switch(statement){
case value 1:
statement
Break;
case value 2:
statement
break;
case value 3:
statement
break;
}
<html>
<head>
<title>Mafunzo ya javascript</title>
</head>
<body>
<script>
let neno = prompt("weka neno la kiswahili kwa herufi ndogo");
switch(neno){
case'baba':
document.write("<h1>Father<h1>")
break;
case'mama':
document.write("<h1>Mother<h1>")
break;
case'dada':
document.write("<h1>Sister<h1>")
break;
case'kaka':
document.write("<h1>Brother<h1>")
break;
case'mjomba':
document.write("<h1>Uncle<h1>")
break;
case'shangazi':
document.write("<h1>Aunt<h1>")
break;
case'mpwa':
document.write("<h1>Nephew or niece<h1>")
break;
default:
document.write('Hatujui')
}
</script>
</body>
</html>
Wacha tuone jinsi ya kutumia switch kwenye mfano wa somo lililotangulia
<html>
<head>
<title>Mafunzo ya javascript</title>
</head>
<body>
<script>
let umri = prompt("weka umri wa Mtoto");
switch(umri){
case umri < 6:
document.write("<h1>Rudi chekechea<h1>")
break;
case umri > 6 & umri <9:
document.write("<h1>Amefanikiwa kuingiavdarasavka kwanza<h1>")
break;
case umri > 8 & umri < 18:
document.write("<h1>Anza Memkwa<h1>")
break;
default:
document.write('Umeoa?')
}
</script>
</body>
</html>
Mfano wa program ya mauzo
Program hii nimei copy kutoka kwenye app ya learn javascript itakusaidiabkujifunza zaidi kuhusu switch
<!DOCTYPE html>
<html>
<head>
<title> Try It Yourself </title>
</head>
<body>
<label> Choose a fruit
<select id="fruits" onchange="checkPrice()">
<option value="apple"> apple </option>
<option value="banana"> banana </option>
<option value="cherry"> cherry </option>
<option value="mango"> mango </option>
<option value="orange"> orange </option>
<option value="strawberry"> strawberry </option>
</select>
</label>
<p id="price"></p>
<script>
function checkPrice() {
var fruit = document.getElementById("fruits").value;
switch(fruit) {
case "apple":
var amount = "$1.92"
document.getElementById("price").innerHTML = "The price of " + fruit + " is " + amount;
break;
case "banana":
var amount = "$2.32"
document.getElementById("price").innerHTML = "The price of " + fruit + " is " + amount;
break;
case "mango":
var amount = "$3.11"
document.getElementById("price").innerHTML = "The price of " + fruit + " is " + amount;
break;
case "orange":
var amount = "$2.87"
document.getElementById("price").innerHTML = "The price of " + fruit + " is " + amount;
break;
default:
document.getElementById("price").innerHTML = "Sorry for the inconveniences, " + fruit + " is currently not available.";
}
}
</script>
</body>
</html>
Tukutane somo linalofuata tutakwendavkujifunza kuhusu loop