Array length property in Javascript - Interactive Code Practice

Practice - 5 Tasks

1fill in blank

easy

Complete the code to get the length of the array.

Javascript

const fruits = ['apple', 'banana', 'cherry'];
console.log(fruits.[1]);

Drag options to blanks, or click blank then click option'

Alength

Bsize

Ccount

Dtotal

Attempts:

3 left

💡 Hint

Common Mistakes

Using 'size' instead of 'length'.

Trying to call length as a function like length().

The length property returns the number of elements in an array.

2fill in blank

medium

Complete the code to check if the array is empty.

Javascript

const numbers = [];
if (numbers.[1] === 0) {
  console.log('Array is empty');
}

Drag options to blanks, or click blank then click option'

Asize

Btotal

Clength

Dcount

Attempts:

3 left

💡 Hint

Common Mistakes

Using 'size' or 'count' which are not valid array properties.

Forgetting to compare length to 0.

Checking if length is 0 tells us if the array has no elements.

3fill in blank

hard

Fix the error in accessing the array length.

Javascript

const colors = ['red', 'green', 'blue'];
console.log(colors.[1]());

Drag options to blanks, or click blank then click option'

Atotal

Bsize

Ccount

Dlength

Attempts:

3 left

💡 Hint

Common Mistakes

Using parentheses after length causing a TypeError.

Using incorrect property names like size or count.

length is a property, not a function, so it should not have parentheses.

4fill in blank

hard

Fill both blanks to create an array of numbers and print its length.

Javascript

const numbers = new Array([1]);
console.log(numbers.[2]);

Drag options to blanks, or click blank then click option'

A5

Blength

Csize

D10

Attempts:

3 left

💡 Hint

Common Mistakes

Using 'size' instead of 'length' for the property.

Using a string instead of a number for the array size.

new Array(5) creates an array with length 5, and length property gives the size.

5fill in blank

hard

Fill all three blanks to create an array, add an element, and print the new length.

Javascript

const arr = [];
arr.[1]('hello');
console.log(arr.[2] + [3]);

Drag options to blanks, or click blank then click option'

Apush

Blength

C0

D1

Attempts:

3 left

💡 Hint

Common Mistakes

Using incorrect method names like 'add' instead of 'push'.

Trying to call length as a function.

Adding 0 instead of 1 to length.

push adds an element, length gives current size, adding 1 gives the new length after adding the element.

Practice

1.

What does the length property of a JavaScript array represent?

easy

A. The last element value in the array

B. The highest index number in the array

C. The total size in bytes of the array

D. The number of elements in the array

Solution

1. Step 1: Understand the length property

   The length property counts how many items are stored in the array.

2. Step 2: Differentiate from other properties

   It does not give the highest index or size in bytes, only the count of elements.

3. Final Answer:

   The number of elements in the array -> Option D

4. Quick Check:

   Array length = number of elements [OK]

Hint: Remember: length counts items, not indexes or sizes [OK]

Common Mistakes:

• Confusing length with highest index
• Thinking length gives memory size
• Assuming length returns last element

2.

Which of the following is the correct way to get the length of an array arr in JavaScript?

easy

A. arr.length()

B. arr.length

C. length(arr)

D. arr.size

Solution

1. Step 1: Recall the syntax for accessing length

   The length property is accessed without parentheses because it is a property, not a function.

2. Step 2: Check each option

   arr.length uses arr.length correctly. arr.length() uses parentheses incorrectly. Options C and D are not valid JavaScript syntax for array length.

3. Final Answer:

   arr.length -> Option B

4. Quick Check:

   Use property, not function: arr.length [OK]

Hint: Access length as property, no parentheses [OK]

Common Mistakes:

• Using arr.length() with parentheses
• Trying length(arr) like a function
• Using arr.size which doesn't exist

3.

What will be the output of the following code?

const fruits = ['apple', 'banana', 'cherry'];
console.log(fruits.length);

medium

A. undefined

B. 2

C. 3

D. Error

Solution

1. Step 1: Count the elements in the array

   The array fruits has three elements: 'apple', 'banana', and 'cherry'.

2. Step 2: Use the length property

   Accessing fruits.length returns the number of elements, which is 3.

3. Final Answer:

   3 -> Option C

4. Quick Check:

   Array length = 3 [OK]

Hint: Count items inside brackets to find length [OK]

Common Mistakes:

• Counting indexes starting from 0
• Expecting length to be last index
• Confusing length with undefined

4.

Identify the error in the following code snippet:

let numbers = [1, 2, 3, 4];
numbers.length = 2;
console.log(numbers.length);
console.log(numbers[2]);

medium

A. Setting length to 2 removes elements after index 1

B. numbers.length cannot be changed

C. numbers[2] will print 3

D. Syntax error in setting length

Solution

1. Step 1: Understand setting length property

   Setting numbers.length = 2 truncates the array to first two elements, removing elements after index 1.

2. Step 2: Check the output of numbers[2]

   Since the array is truncated, numbers[2] is now undefined, not 3.

3. Final Answer:

   Setting length to 2 removes elements after index 1 -> Option A

4. Quick Check:

   Changing length truncates array [OK]

Hint: Changing length can cut off elements [OK]

Common Mistakes:

• Thinking length is read-only
• Expecting old elements to remain after truncation
• Assuming numbers[2] still holds value

5.

Given the array let data = [10, 20, 30, 40, 50];, which code snippet correctly doubles the array size by adding undefined elements at the end?

// Choose the correct code
A) data.length = data.length * 2;
B) data.length = data.length + data.length;
C) data.length = data.length * 2; data.fill(undefined, 5, data.length);
D) data.length = data.length * 2; data.fill(undefined);

hard

A. data.length = data.length * 2; data.fill(undefined, 5, data.length);

B. data.length = data.length + data.length;

C. data.length = data.length * 2;

D. data.length = data.length * 2; data.fill(undefined);

Solution

1. Step 1: Double the length property

   Setting data.length = data.length * 2 doubles the array size but new slots are empty (holes).

2. Step 2: Fill new slots with undefined

   Using data.fill(undefined, 5, data.length) fills the new slots from index 5 to the new length with undefined.

3. Step 3: Check other options

   A and B only change length but do not fill new slots, leaving holes. D uses data.fill(undefined) which fills from index 0, overwriting original data.

4. Final Answer:

   data.length = data.length * 2; data.fill(undefined, 5, data.length); -> Option A

5. Quick Check:

   Double length then fill new slots [OK]

Hint: Double length then fill new slots with fill(start, end) [OK]

Common Mistakes:

• Not filling new slots, leaving holes
• Overwriting existing elements with fill
• Using fill without end index