Problem in : Refactor Global Variables Out of Functions lesson of JS

JavaScript
1

Tell us what’s happening:
In “function add (bookName)” , why the ouput of console.log(bookList.length) is
4
4 ??
I am a newbie in js, please help !!
Your code so far


// The global variable
var bookList = ["The Hound of the Baskervilles", "On The Electrodynamics of Moving Bodies", "Philosophiæ Naturalis Principia Mathematica", "Disquisitiones Arithmeticae"];

// Change code below this line
function add (bookName) {
console.log(bookList.length);
bookList.push(bookName);
return bookList;

// Change code above this line
}

// Change code below this line
function remove (bookName) {
var book_index = bookList.indexOf(bookName);
if (book_index >= 0) {

  bookList.splice(book_index, 1);
  return bookList;

  // Change code above this line
  }
}

var newBookList = add(bookList, 'A Brief History of Time');
var newerBookList = remove(bookList, 'On The Electrodynamics of Moving Bodies');
var newestBookList = remove(add(bookList, 'A Brief History of Time'), 'On The Electrodynamics of Moving Bodies');

console.log(bookList);

Your browser information:

User Agent is: Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/83.0.4103.116 Safari/537.36.

Challenge: Refactor Global Variables Out of Functions

Link to the challenge:

2

Take a look at the parameters going into your function. Your ad and remove functions should never be aware of a global bookList variable. Instead, the functions are passed both an array, and a title. Only use those!