# Array Length

**URL:** <https://forum.kirupa.com/t/array-length/644423>\
**Category:** Uncategorized\
**Created:** [October 3, 2020, 12:14am UTC](https://forum.kirupa.com/t/array-length/644423 "2020-10-03T00:14:27Z")\
**Posts on this page:** 18\
**Page:** 1

<div class="post-metadata">

**Author:** ![John\_Stern](https://yyz1.discourse-cdn.com/flex011/user_avatar/forum.kirupa.com/john_stern/32/12050_2.png) [@John\_Stern](https://forum.kirupa.com/u/John_Stern)\
**Post date:** [October 3, 2020, 12:14am UTC](https://forum.kirupa.com/t/array-length/644423/1 "2020-10-03T00:14:27Z")

</div>

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 ?

---

<div class="post-metadata">

**Author:** ![John\_Stern](https://yyz1.discourse-cdn.com/flex011/user_avatar/forum.kirupa.com/john_stern/32/12050_2.png) [@John\_Stern](https://forum.kirupa.com/u/John_Stern)\
**Post date:** [October 3, 2020, 12:24am UTC](https://forum.kirupa.com/t/array-length/644423/2 "2020-10-03T00:24:53Z")

</div>

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);  
}  
};

---

<div class="post-metadata">

**Author:** ![senocular](https://yyz1.discourse-cdn.com/flex011/user_avatar/forum.kirupa.com/senocular/32/7217_2.png) [@senocular](https://forum.kirupa.com/u/senocular)\
**Post date:** [October 3, 2020, 1:24am UTC](https://forum.kirupa.com/t/array-length/644423/3 "2020-10-03T01:24:55Z")

</div>

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

---

<div class="post-metadata">

**Author:** ![John\_Stern](https://yyz1.discourse-cdn.com/flex011/user_avatar/forum.kirupa.com/john_stern/32/12050_2.png) [@John\_Stern](https://forum.kirupa.com/u/John_Stern)\
**Post date:** [October 3, 2020, 3:19pm UTC](https://forum.kirupa.com/t/array-length/644423/4 "2020-10-03T15:19:59Z")

</div>

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();

---

<div class="post-metadata">

**Author:** ![kirupa](https://yyz1.discourse-cdn.com/flex011/user_avatar/forum.kirupa.com/kirupa/32/11616_2.png) [@kirupa](https://forum.kirupa.com/u/kirupa)\
**Post date:** [October 3, 2020, 8:29pm UTC](https://forum.kirupa.com/t/array-length/644423/5 "2020-10-03T20:29:55Z")

</div>

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

---

<div class="post-metadata">

**Author:** ![John\_Stern](https://yyz1.discourse-cdn.com/flex011/user_avatar/forum.kirupa.com/john_stern/32/12050_2.png) [@John\_Stern](https://forum.kirupa.com/u/John_Stern)\
**Post date:** [October 4, 2020, 1:52pm UTC](https://forum.kirupa.com/t/array-length/644423/6 "2020-10-04T13:52:11Z")

</div>

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

---

<div class="post-metadata">

**Author:** ![John\_Stern](https://yyz1.discourse-cdn.com/flex011/user_avatar/forum.kirupa.com/john_stern/32/12050_2.png) [@John\_Stern](https://forum.kirupa.com/u/John_Stern)\
**Post date:** [October 4, 2020, 2:35pm UTC](https://forum.kirupa.com/t/array-length/644423/7 "2020-10-04T14:35:54Z")

</div>

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.

---

<div class="post-metadata">

**Author:** ![kirupa](https://yyz1.discourse-cdn.com/flex011/user_avatar/forum.kirupa.com/kirupa/32/11616_2.png) [@kirupa](https://forum.kirupa.com/u/kirupa)\
**Post date:** [October 4, 2020, 4:30pm UTC](https://forum.kirupa.com/t/array-length/644423/8 "2020-10-04T16:30:56Z")

</div>

Does your console report any errors?

---

<div class="post-metadata">

**Author:** ![John\_Stern](https://yyz1.discourse-cdn.com/flex011/user_avatar/forum.kirupa.com/john_stern/32/12050_2.png) [@John\_Stern](https://forum.kirupa.com/u/John_Stern)\
**Post date:** [October 4, 2020, 10:57pm UTC](https://forum.kirupa.com/t/array-length/644423/9 "2020-10-04T22:57:49Z")

</div>

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](https://canada1.discourse-cdn.com/flex011/uploads/kirupa/original/2X/1/12a54f31596b833dc68837efa36492f09fabdb19.png) .  
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

---

<div class="post-metadata">

**Author:** ![kirupa](https://yyz1.discourse-cdn.com/flex011/user_avatar/forum.kirupa.com/kirupa/32/11616_2.png) [@kirupa](https://forum.kirupa.com/u/kirupa)\
**Post date:** [October 5, 2020, 12:59am UTC](https://forum.kirupa.com/t/array-length/644423/10 "2020-10-05T00:59:08Z")

</div>

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

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.

---

<div class="post-metadata">

**Author:** ![John\_Stern](https://yyz1.discourse-cdn.com/flex011/user_avatar/forum.kirupa.com/john_stern/32/12050_2.png) [@John\_Stern](https://forum.kirupa.com/u/John_Stern)\
**Post date:** [October 5, 2020, 7:09pm UTC](https://forum.kirupa.com/t/array-length/644423/11 "2020-10-05T19:09:54Z")

</div>

![Screen Shot 2020-10-05 at 9.52.13 AM](https://canada1.discourse-cdn.com/flex011/uploads/kirupa/original/2X/c/cdf9c743ab888985ae4c90702329abb9d55261ba.jpeg)

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?

---

<div class="post-metadata">

**Author:** ![kirupa](https://yyz1.discourse-cdn.com/flex011/user_avatar/forum.kirupa.com/kirupa/32/11616_2.png) [@kirupa](https://forum.kirupa.com/u/kirupa)\
**Post date:** [October 5, 2020, 7:38pm UTC](https://forum.kirupa.com/t/array-length/644423/12 "2020-10-05T19:38:36Z")

</div>

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.

---

<div class="post-metadata">

**Author:** ![John\_Stern](https://yyz1.discourse-cdn.com/flex011/user_avatar/forum.kirupa.com/john_stern/32/12050_2.png) [@John\_Stern](https://forum.kirupa.com/u/John_Stern)\
**Post date:** [October 5, 2020, 8:02pm UTC](https://forum.kirupa.com/t/array-length/644423/13 "2020-10-05T20:02:00Z")

</div>

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](http://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?

---

<div class="post-metadata">

**Author:** ![kirupa](https://yyz1.discourse-cdn.com/flex011/user_avatar/forum.kirupa.com/kirupa/32/11616_2.png) [@kirupa](https://forum.kirupa.com/u/kirupa)\
**Post date:** [October 6, 2020, 4:23am UTC](https://forum.kirupa.com/t/array-length/644423/14 "2020-10-06T04:23:54Z")

</div>

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:

[https://www.kirupa.com/html5/getting\_your\_feet\_wet\_html5.htm](https://www.kirupa.com/html5/getting_your_feet_wet_html5.htm)

🙂

---

<div class="post-metadata">

**Author:** ![John\_Stern](https://yyz1.discourse-cdn.com/flex011/user_avatar/forum.kirupa.com/john_stern/32/12050_2.png) [@John\_Stern](https://forum.kirupa.com/u/John_Stern)\
**Post date:** [October 6, 2020, 4:22pm UTC](https://forum.kirupa.com/t/array-length/644423/15 "2020-10-06T16:22:52Z")

</div>

Thanks for the link - more study ahead !!

---

<div class="post-metadata">

**Author:** ![John\_Stern](https://yyz1.discourse-cdn.com/flex011/user_avatar/forum.kirupa.com/john_stern/32/12050_2.png) [@John\_Stern](https://forum.kirupa.com/u/John_Stern)\
**Post date:** [October 6, 2020, 6:01pm UTC](https://forum.kirupa.com/t/array-length/644423/16 "2020-10-06T18:01:47Z")

</div>

![Screen Shot 2020-10-06 at 11.00.32 AM](https://canada1.discourse-cdn.com/flex011/uploads/kirupa/original/2X/4/47a487506eb6ad503cb4e16b6b1d34176240d72c.jpeg)

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.

---

<div class="post-metadata">

**Author:** ![kirupa](https://yyz1.discourse-cdn.com/flex011/user_avatar/forum.kirupa.com/kirupa/32/11616_2.png) [@kirupa](https://forum.kirupa.com/u/kirupa)\
**Post date:** [October 6, 2020, 9:41pm UTC](https://forum.kirupa.com/t/array-length/644423/17 "2020-10-06T21:41:55Z")

</div>

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

Glad you got the tutorial working!

---

<div class="post-metadata">

**Author:** ![John\_Stern](https://yyz1.discourse-cdn.com/flex011/user_avatar/forum.kirupa.com/john_stern/32/12050_2.png) [@John\_Stern](https://forum.kirupa.com/u/John_Stern)\
**Post date:** [October 7, 2020, 1:42am UTC](https://forum.kirupa.com/t/array-length/644423/18 "2020-10-07T01:42:30Z")

</div>

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.