Undefined is not an object (evaluating myArray.length)

javascript html safari quicksort

36,754

Solution 1

If you are calling the function with

quicksort()

you are not passing any arguments in. However, your function starts with

function quickSort(myArray)
{
  if (myArray.length === 0){
    return [];
  }

Since no arguments are passed to quicksort, myArray is left undefined. Undefined variables are not objects, and therefore can not have properties such as length.

EDIT:

In order to call your function when you click the button, it is best to set the event listener in javascript rather than putting it in your HTML.

Give you button an ID name and remove the onclick attribute:

<button id="sortButton">Quick Sort It!</button>

Then add the event listener in your JavaScript after your quickSort definition:

document.getElementById("sortButton").onclick = function(){quickSort(myArray);});

Solution 2

You dont pass the parameter to the function in your html onclick. So myArray ends up being undefined inside your func. Notice that myArray that u defined outside the function is not the same myArray inside of it defined as a parameter tp the function

36,754

Author by

Joshua Reddy

Updated on July 09, 2022

Comments

Joshua Reddy almost 2 years

I've been working on a program that uses a quick sort algorithm to sort an array of numbers. This is my code:

    var myArray=[8,2,5,6];

function quickSort(myArray)
{
    if (myArray.length === 0){
        return [];
    }

    var left=[];
    var right=[];
    var pivot= myArray[0];

    for (var i=1; i<myArray.length; i++){

        if (myArray[i]<pivot) {
            left.push(myArray[i]);

        }

        else {

            right.push(myArray[i]);
        }
    }

    return quickSort(left).concat(pivot, quickSort(right));
    document.getElementById().innerHTML = quickSort(left).concat(pivot, quickSort(right));
}

And here is my html

<html>
<h1>QuickSorter</h1>
<button onclick="quicksort()">Quick Sort It!</button>
<script src="quicksort.js"> </script>
</html>

The console in safari keeps showing me this :

TypeError: undefined is not an object (evaluating myArray.length)

I really don't understand at all why it isn't working. Any help would be appreciated.

Joshua Reddy over 9 years

Should I replace it with onclick="quickSort(myArray)"?
Joshua Reddy over 9 years

If I change my html button to onclick ="quickSort(myArray)" nothing happens. But if I type quickSort(myArray) in the console it returns a sorted array.
user2717954 over 9 years

Depends. If you only want to sort this specific array you can do something like that in the begining of the function: if (!myArray) myArray=[32,43,1]; etc and then do onclick="quicksort()" which btw is a bad habit by itself, binding events should be done in javascript
Warren R. over 9 years

Well, quickSort() returns before it actually does anything to the page (the last line with docuemnt.getElementById()... is never executed). Moreover, getElementById() does not have any element ID passed to it, so you will run into another undefined error.
Joshua Reddy over 9 years

The document.getElement part was a mistake that I removed but why isn't the sorted array being returned in the function after clicking the button?
Warren R. over 9 years

It is being returned. When you put onlick=quickSort(myArray) you are just returning the sorted array to the onclick event handler. If you want to see it in the console you could change your return statement to a console.log() statement.
Warren R. over 9 years

I guess you should elaborate on exactly what you are trying to achieve.
Joshua Reddy over 9 years

Exactly, for class we are learning about different types of sorts, and we are supposed to write a quicksort javascript program that sorts integers and either prints them to the console or displays the newly sorted array on the page.
Warren R. over 9 years

So you probably don't want to use a return statement at all for this. Either replace return with console.log(...) to display in console or use the document.getElementById(...).innerHTML = ... to cahnge an element on page (such as a div), or both.
Joshua Reddy over 9 years

I'm very new to html and javascript and I'm not sure what you mean. I replaced return with console.log(quickSort(left).concat(pivot, quickSort(right))) and nothing is printed in console.
Warren R. over 9 years

I think the issue is the function is being called as soon as the button is loaded. Using inline event handlers is not a great idea to begin with. I have updated my answer.
Joshua Reddy over 9 years

Do I just add the document.getElementById outside of the function at the bottom?
Warren R. over 9 years

Yeah, that should do it.