< Return to Video

https:/.../32d1e9fe-0a8b-4ec5-8411-dbdb76c62dfe-2e5187e6-2024-41f3-a14f-a6e03299351a.mp4?invocationId=6001ef3b-5fb9-e611-8150-0a10558ed887

  • 0:11 - 0:16
    Hello and welcome to 6.2 lab 3 let's go ahead and dive in! Open this file and your js
  • 0:16 - 0:21
    file like usual, and let's look at what we're going to do here. We are going to create a
  • 0:21 - 0:26
    function lab62_3 function and we are going to create two array variables this is were we
  • 0:26 - 0:30
    are going to deal with parallel arrays, and so you can just copy and paste this code in
  • 0:30 - 0:34
    here so you don't have to retype everything. Now one thing, let me just take a side step
  • 0:34 - 0:38
    for a moment and talk about parallel arrays. A lot of times when you are working
  • 0:38 - 0:42
    on an application you are not going to type it or hard code it in like this. A lot of times
  • 0:42 - 0:46
    the data you are going to receive is going to come from some other source like a
  • 0:46 - 0:51
    database that you are getting that information from or maybe a third party so you
  • 0:51 - 0:54
    are hitting a web service or something were you are pulling that data back.
  • 0:54 - 0:58
    Whenever you are working with data and parallel like this you just need to be
  • 0:58 - 1:05
    careful with your logic, for example I had my first student there in my names, Natasha
  • 1:05 - 1:12
    Peeks and her score is a 76, Boyd, he has a 99. We wouldn't want to mess that up
  • 1:12 - 1:18
    were Natasha now as a 99 and Boyd as a 76 or Natasha will be extremely happy
  • 1:18 - 1:22
    and Boyd extremely disappointed. So we want to make sure we work things correctly
  • 1:22 - 1:27
    when we are working with parallel data, in fact a lot of times what I'll do is if I am getting
  • 1:27 - 1:34
    this from a database I may lump it into 1 2 dimensional ray and that way I am hitting
  • 1:34 - 1:39
    one array and I am lumping that stuff together or I use a j son object where I have an
  • 1:39 - 1:45
    object of Boyd and he has a property of 99, that sort of thing. But sometimes you will
  • 1:45 - 1:48
    work with parallel arrays like this and I just want to go through this with you so you
  • 1:48 - 1:54
    understand how these are working. So we are going to have a variable and use
  • 1:54 - 1:59
    the get by ID to get are table. And then we are going to have a look looking for scores
  • 1:59 - 2:04
    88 or above. When we hit that, we are going to output the students name and table row
  • 2:04 - 2:09
    and I have an example of arrays you can click on here to see some information on it
  • 2:09 - 2:17
    so if you need to take a look at that feel free. Now let's just check the output here, and
  • 2:17 - 2:24
    the example I have, I am going to have all those names listed if they have 88 or
  • 2:24 - 2:32
    above. So let's take a look at how we are going to do this, so in our html in our output
  • 2:32 - 2:37
    div I have a table were I have an ID of outputTable so I can grab it, the class of the
  • 2:37 - 2:42
    contentTable is just stylistic, and then I created a table row with two headers with the
  • 2:42 - 2:47
    name and exam score so I can add rows and put them in our columns appropriately
  • 2:47 - 2:53
    so then in my function I have a scores variable, and I have a names variable with the
  • 2:53 - 3:00
    appropriate data. Then in my output variable I simply said go into my document get my
  • 3:00 - 3:07
    element with an ID with outputTable. So I grabbed that html element of outputTable, that
  • 3:07 - 3:12
    table tag and dumped it in my output variable so now I have a hold on that. And then I
  • 3:12 - 3:17
    am just doing a loop. So in my loop here I am looping through my scores, starting at 76
  • 3:17 - 3:22
    and going all the way through to 79 just a normal for loop and I am just testing it
  • 3:22 - 3:29
    is my score greater than or equal to 88? if it is, then I am saying ok I want to compound
  • 3:29 - 3:35
    add to my table, a table with a table row with a table data cell with names and
  • 3:35 - 3:39
    notice I am using, I am hitting, even though I am looping over my scores array
  • 3:39 - 3:44
    I am hitting my names array and using the same i variable to make sure I pull out
  • 3:44 - 3:50
    the exact same. So if I am pulling out 99 here I want to pull out Boyd, so that is why
  • 3:50 - 3:55
    I am using my names bracket notation there and then I am pulling out the scores with
  • 3:55 - 4:01
    the appropriate html tag intersperse for my cells. So this example is just to show you
  • 4:01 - 4:05
    how you can go through loop through one array and hit a parallel array at the
  • 4:05 - 4:09
    same time, you just got to be careful you are doing it correctly so that you pull out
  • 4:09 - 4:14
    the appropriate information so like in my scenario Boyd is getting the right score
  • 4:14 - 4:20
    and not Natasha who did not earn her 99 so if you do that correctly you will get that
  • 4:20 - 4:25
    table. If you have any questions let me know and happy coding!
Title:
https:/.../32d1e9fe-0a8b-4ec5-8411-dbdb76c62dfe-2e5187e6-2024-41f3-a14f-a6e03299351a.mp4?invocationId=6001ef3b-5fb9-e611-8150-0a10558ed887
Video Language:
English
Duration:
04:34

English subtitles

Revisions