Array Length

1

var myAlphabet = [“A”,“B”,“C”,“D”,“E”,“F”,“G”];
var myAlphabetLength = function() {
textSize(30);
fill(90,210,130);
text(myAlphabet.length,10,50);
};

this is quite basic I know - I am simply looking for the code to print the number 7 - the length of the array but no - it doesn’t do that - why not ?

2

just to add a complication, I added a conditional statement hoping that the text would print out since the condition is true but again - nothing

var myAlphabet = [“A”,“B”,“C”,“D”,“E”,“F”,“G”];
var myAlphabetLength = function() {
textSize(30);
fill(90,210,130);
text(myAlphabet.length,10,50);
if(myAlphabet.length < 4) {
text(“The number of items in the array is less than 4 - is false”,10,90,200,200);
}
};

3

You’re putting everything in a function called myAlphabetLength. Are you calling that function?

4

So I changed the code a bit so that one of 2 statements will print depending on the condition (myAlphabet.length. < 4) being true or not - then I called the function (I don’t know why I keep omitting the calls but I will learn!) - still nothing whereas I expected 2 printouts - the # 7 for the number of items in the array - the sentence “The number of items in the array is greater than 4,” - but nothing again so is there something more to the call than I have written?

var myAlphabet = [“A”,“B”,“C”,“D”,“E”,“F”,“G”];
var myAlphabetLength = function() {
textSize(30);
fill(90,210,130);
text(myAlphabet.length,10,50);
if(myAlphabet.length < 4) {
text(“The number of items within the array is less than 4.”,10,100);
} else {
text(“The number of items in the array is greater than 4.”,10,100);
}
};
myAlphabet.length();

5

If the last line is your function call, you should call it myAlphabetLength() instead :slight_smile:

6

The last line indeed was my function call and yes I should have known better - thanks for pointing that out to me

1 Like
7

original code - the end result I am looking for is a display of

  • the number 7
  • the sentence “The number of items in the array is greater than 4.”
    so the code below does accomplish that

var myAlphabet = [“A”,“B”,“C”,“D”,“E”,“F”,“G”];
var myAlphabetLength = function() {
textSize(30);
fill(90,210,130);
text(myAlphabet.length,10,50);
if(myAlphabet.length < 4) {
text(“The number of items within the array is less than 4.”,10,100);
} else {
text(“The number of items in the array is greater than 4.”,10,100,390,300);
}
};
myAlphabetLength();

in an effort to show that there is more than one way to skin a cat, I tried to get the same outcome using the following approach, here is the new code

var myAlphabet = [“A”,“B”,“C”,“D”,“E”,“F”,“G”];
var myAlphabetLength = function() {
if(myAlphabet.length < 4) {
textSize(30);
fill(20,40,60);
text(“The number of items within the array is less than 4.”,10,100);}
else
{text(“The number of items in the array is greater than 4.”,10,100);}
var lengthOfarray = myAlphabet.length;
return lengthOfarray;
};
var someNumber = myAlphabetLength();
textSize(30);
fill(20,40,60);
text(someNumber,10,50);

this time around, what is inside the function is supposed to print out the

  • sentence
    and then calling the function is supposed to print out the
  • number 7
    but I am not getting any printout at all, the reason apparently being that I am mixing spaces and tabs which I have no idea as to how to fix.
8

Does your console report any errors?

9

I don’t even know what console refers to. From your question, I assume it’s some sort of program that catches errors in code. Well, I have 2 similar programs that I know of - the first one being the Oh Noes character -
Screen Shot 2020-10-04 at 3.49.27 PM .
and this is all I get from him with respect to analyzing my code - he’s usually much more specific with his pointing out of errors - I can only assume that Hmmm…
means that so far - so good even though I’m not getting the printout that I want.
My second troubleshooter is Linter and that one tells me that for all the lines that have - textSize fill text - those terms are not defined. Again, I don’t know why that would be

10

The console is something your browser provides as part of the developer tools: https://www.kirupa.com/html5/console.htm It helps catch and display errors :slight_smile:

For your function, mixing spaces and tabs won’t cause your code to not run. It is a stylistic choice where you want to either consistently use tabs or spaces, but mixing between them both is not a good idea.

Your code seems fine to me, but that is because I also don’t have a way of running it to see if there are any other issues. The console output can help with that.

11

Screen Shot 2020-10-05 at 9.52.13 AM
Screen Shot 2020-10-05 at 9.52.13 AM2896×2970 423 KB

So I clicked on the link to the console that you provided in your reply and was expecting to see
"What we have here is a really simple HTML page with a button that you can click. "
I don’t know if it has to do with the fact that I am using Safari on MacOS but the code that was pasted got placed in the bottom half of the Safari console window but nowhere do I see a “simple HTML page with a button that you can click”. I just have a big blank above the code that was pasted. Any ideas on why I don’t see the button?

12

Does your page show up in the browser with the button and text appearing? The console shouldn’t be showing the contents of your document, so something strange is going on.

13

So what I’ve done is choose Develop from the Menu then select - Show Java Script Console - this doesn’t open in my Safari window - a new window titled
Web Inspector - forum.kirupa.com - 12 opens and it is into this window that I followed the instructions
“create a new HTML document and add the following HTML, CSS, and JavaScript into it:”
Now that I look at it, is the Java Script Console window the new HTML document that is being referred to above? Maybe that’s the issue? They’re not the same?

14

No, the JS Console is not the new HTML document. It is a lens into an existing HTML document, which is often the page that is currently displayed in your browser. If you are interested in building your own HTML page, this article should help you out:

:slight_smile:

15

Thanks for the link - more study ahead !!

16

Screen Shot 2020-10-06 at 11.00.32 AM
Screen Shot 2020-10-06 at 11.00.32 AM1072×1662 142 KB

Just wanted to let you know that I used Visual Studio quote to go through the exercise and it was quite thrilling to see the browser page turn yellow and have the button appear and so on. I loved the way the button turns a turquoise green when the arrow hovers over it. So obviously the exercise worked as intended so in that regard it was a success. I just have a question regarding some of the code. You will notice in the upper screenshot we have an upper and lower “body” bracketing 4 lines of code. In the lower screenshot, we still have 4 lines of code but the lower bracket “body” has vanished. Since the tutorial was a success in that the final goal was achieved, this vanishing lower bracket obviously wasn’t crucial but I wonder whether there’s an explanation for its disappearance.

17

You found a bug in my code! Thanks for pointing it out. That body element should be there. I will revise it tonight :grinning:

Glad you got the tutorial working!

18

Yes the tutorial was fun in that I actually did something that had a visible and functional result. Glad to help out with the debugging even though I have no idea what the elements that I pointed out actually do. I just noticed the lack of symmetry in the lower window and thought that I should at least comment on it.

1 Like