Katika post hii tutajifunza kuhusu javascript object. Utajifunza jinsi ya kutengeneza javascript object. Pia tutajifunza kuhusu kutimia method kwenye javascript. 

 

Object ni nini?

Object ni data ambayo ina sifa na tabia (property). Mfano unaposema gari linakuwa na sifa kama rangi,  mwendo kasi, aina ya injini. Hivyo kwa mfano huu gari ni object ambayo inaweza kuandikwa kama hivi: 

 

<script>

  var gari={

  jina: "Toyota",

  injini: "Disel",

  speed: "180kh/h",

  manufacture:"Japan"

  }

  

  document.write(gari.jina +"<br>"+

  gari.speed +"<br>"+

  gari.injini +"<br>"+

  gari.manufacture

  );

</script>

Ukiangalia code hizo utagundua kuwa:-

  1. OBJECT ni variable kama unavyoona hapo bar gari, ambapo OBJECT yetu ni gari ambayo ni variable

 

  1. OBJECT ina jina la OBJECT na thamani ama sifa zake kwa mfano hapo jina ni gari na sifa zake ni mwendo, injini, manufacture, jina la gari. 

 

  1. Jina la OBJECT linaitwa object name, na hizo sifa huitwa object property au behaviour na hizo thamani kwa mfano Toyota, dizel, 180kh/h hizo zote huitwa property values. 

 

  1. Kutoka property moja kwenda nyingine hutenganishwa na alama ya koma (,).

 

  1. Property na value yake kutenganishwa na alama ya nukta pacha (:)

 

 

Jinsi ya kuandika OBJECT katika javascript.

  1. Utaweka jina la object. Jina hili halitakiwibkuanza na namba ama special character wala javascript keywords

 

  1. Kisha utaweka jina la object likifuatiwa na mabano {}

 

  1. Ndani ya mabano ndio utaweka hizo property zake. 

 

  1. Kuandika property ataandika. Jina la hiyo property ikifuatiwa na alama ya nukta pacha kisha itafuatiwa na value. Kama ni string utaweka ndani ya alama za "".

 

Mfano: 

<script>

  var tovuti={

  jina: "Bongoclass",

  umri: 4,

  nchi: "Tanzania",

  hai:true,

  mafunzo: ["html", "php", "javascript", "sql"]

  }

 

  document.write(tovuti["jina"] +"<br>"+tovuti.mafunzo[0] +" "+tovuti.mafunzo[1])

</script>

Katika mfano huo hapo utagundua kuwa object inaweza kuwa na array ndani yake kwa mfano hapo juu property mafunzo value zake zipo kwenye array. 

 

Si hivyo tu bali object pia inaweza kuwa na function kama tutakavyoona katika mifano inayokuja. 

 

 

Jinsi ya ku access object

Ku access object ni sawa na kuitumia hiyo objectvkwenye code zako. Kwa nfano katika mifano miwili iliyotangulia baada ya kuandika object tuliweza kuzitumia na ku out put code ndipo tukapata matokeo ya hizo code. 

 

Kuna njia kuu tatu ambazo hutumika ku access object. Yaani njia tatu ambazo hutumika ili uweze kuitumia object kwenye code zako. Njia hizo ni: -

  1. Kwa kutumia doti. Kama tulivyoona katika mfano wa kwanza gari.jina

 

  1. Njia ya pili ni kwa kutumia mabango kama ilivyo katika mfano wa pili tovuti[jina]

 

  1. Njia ya tatu ni kwa kutumia this keyword kama tutakavyojifunza. 

 

  1. KWA KUTUMIA DOTI

ili uweze ku access object kwa kutumia doti kwanza utaandika jina la hiyo Object kisha itafuatiwa na kidoti kisha ndipo itafanya jina la property. 

 

Mfano: 

<script>

  var mafunzo={

  somo: "Javascript",

  muda: "wiki mbili",

  lugha: "kiswahili",

  host:"Bongoclass"

  }

  

  alert("Je upo tayari kujiunga na mafunzo ya"+mafunzo.somo+ "yatakayotolewa"+mafunzo.host+"kwa muda wa"+mafunzo.muda+"kwa lugha ya"+mafunzo.lugha)

</script>

 

2.KWA KUTUMIA MABANO []

Kutumia njia hii kwanza utaweka jina ka object kisha litafuatiea na mabano,  ndani ya mabano utaweka jina la hiyo property. Zingatia kama ni string kuiweka ndani ya alama za ""

 

Mfano: 

 

<p id="demo"></p>

<script>

  var mafunzo={

  somo: "Javascript",

  muda: "wiki mbili",

  lugha: "kiswahili",

  host:"Bongoclass"

  }

document.getElementById("demo").innerHTML="karibu" + mafunzo["host"] + "upate mafunzo ya" + mafunzo["somo"]+ "yatakayifanyika kwa muda wa" + mafunzo["muda"] + "kwa lugha ya" + mafunzo["lugha"];

</script>

 

 

3: KWA KUTUMIA THIS

Katika javascript this keyword hutumika katika maeneo mengi na kwa maana tofauti tofauti. Katika object this itatumika ku refer object yaani kuhusisha hiyo object. 

 

Badala ya kuitaja hiyo object sasa tutatumia this kwa mfano hapo mwanzo tulisema tovuti.jina kwa mfano kama huu tukitumia this tutasema this. Jina wacha tuone mfano unaoguata. 

 

<!DOCTYPE html>

<html>

<body>

 

 

 

<p id="demo"></p>

 

<script>

// Create an object:

const course = {

  name: "javascript",

  type: "programming",

  time: "two weeks",

  host: "bongoclass",

  code: 243,

 

  summary : function() {

    return "welcome at "+this.host+" we are going to offer you free "+this.name +" " +this.type+"for a period of "+this.time+" the code number of a course is "+this.code;

  }

};

 

 

document.getElementById("demo").innerHTML = course.summary();

</script>

 

</body>

</html>

 

 

Array ndani ya Object

Kama nilivyotangulia kusema kuwa unaweza kutumia array ndani ya object kama nilivyotumia kwenye mfano wa pili. 

 

Kumbuka kuwa array huhesabiwa kuanzia 0. Angalia vyema mfano wa pili kule au mfano unaofuata. 

 

<script>

let tovuti={

jina: ["Google", "Bongoclass", "wikipedia","jamiiforum"]

}

document.write(tovuti.jina[0]+"<br>"+tovuti.jina[3]+"<br>"+tovuti.jina[1]+"<br>"+tovuti.jina[2])

</script>

 

 

OBJECT NDANI YA OBJECT:

Katika javascript pia unapata fursa ya kuweka object ndani ya object. kwa mfano tuna object yetu ya gari. Ambapo ndani ya oroperty kuna object.

 

Tuseme object gari ina property kama van na lorry. Na ndani ya property van kuna object nyingine ambayo itakuwa na property kama speed, width na weight. Hivyo object hii utaweza kuiandika hivi: -

 

<script>

      var gari = {

         van: {

           name: "Toyota",

            speed: "180km/h",

            weight: "4000kg",

            width:'12m * 2.5m'

         },

         lory: {

           name: "scania",

            speed: "180km/h",

            weight: "7000kg",

            width:"15m * 3m"

         }

      }

      

      document.write("Jina la gari :"+gari.van.name+"<br>"+"speed yake :"+gari.van.speed+"<br>"+"uzito wake :"+gari.van.weight+"<br>"+"size yake :"+gari.van.width+'<br><br>');

      

     

document.write("Jina la gari :"+gari.lory.name+"<br>"+"speed yake :"+gari.lory.speed+"<br>"+"uzito wake :"+gari.lory.weight+"<br>"+"size yake :"+gari.van.width+'<br><br>');

   </script>

 

 

METHOD NDANI YA OBJECT. 

Method ni function ambayo imetumika ndani ya object. Yaani ndani ya object unaweza kutumia function. Sasa function hizi utakazozitumia ndani ya object ndio zinaitwa method. Kwa mfano tumeona tulipojifunzabkuhusu this keyword tulitumia function ndani tmya object. 

 

 

<!DOCTYPE html>

<html>

<body>

 

<p id="demo"></p>

 

<script>

// Create an object:

const numbers = {

  first: 2500,

  second: 3000,

  third: 7000,

 

  total : function() {

   let forth = this.first + this.second+this.third;

   return forth;

      }

};

 

 

document.getElementById("demo").innerHTML = numbers.total();

</script>

 

</body>

</html>

 

 

Mwisho: 

Somo linalofuata tutajifunza object kwenye string na namba ya nitumie built in method ama fnction kwenye string. Tutajifunza baadhi ya function muhimu ambazo tutazitumia kwenye masomo ya mbele.