Checking if undefined in jQuery/Javascript

Question

I have the following:

var currentQuestion = $(this).closest(".question")

I have tried everything suggested in this , this and this question:

if(currentQuestion !== undefined)
if(currentQuestion !== "undefined")
if(typeof currentQuestion !== undefined)
if(typeof currentQuestion !== "undefined")
if(currentQuestion !== null)
if(currentQuestion != undefined)
if(currentQuestion != "undefined")
if(currentQuestion.data("index") !== null)
if(currentQuestion.data("index") !== undefined)
if(typeof currentQuestion.data("index") !== undefined)

But it keeps going inside the if statement...

I have this inside the if:

console.log("nextQ: " + currentQuestion.data("index"));

and nextQ: undefined is getting print out

any other ideas?

EDIT:

currentQuestion.data("index") != null

worked out. If you check all the options I tried before, the one similar to this one had this comparison element: !== and not != . That change made the difference. If someone can explain why, I'll grant him/her the correct answer.

Answer 1

The result will never be undefined, it's always a jQuery object. If the operation didn't find any elements, the jQuery object will be empty, so you check how many element there are in it to see if found anything:

if (currentQuestion.length > 0)

---

After you have checked that there is actually any element in the jQuery object, you can check if there is any data associated to the element.

If no data is associated with an element, the data method will return undefined when you try to read the value. So, to check if there is no data, you should check the type of the value that the data method returns:

if (typeof currentQuestion.data("index") != "undefined")

Answer 2

What you want is currentQuestion.length .

jQuery selectors return an array of elements matching the selector. To test for values in an array, you should use length :

Boolean([].length); //false

Because 0 evaluates to false, you can just use if (currentQuestion.length) .

If you're trying to check for it when it is false, use ! :

if (!currentQuestion.length)

For your question of why != worked but not !== , I would suggest this question: Difference between == and === in JavaScript

Basically, currentQuestion.data('index') is not strictly equal to null , but it could evaluate to null : same as [] == 0 evaluates to true , but [] === 0 evaluates to false .

Answer 3

If you want to check any elements exist, then check the length.

var currentQuestion = $(this).closest(".question");
if (currentQuestion.length > 0) {
    console.log("nextQ: " + currentQuestion.data("index"));
}

Answer 4

if (currentQuestion.length) {

Should work fine. If it goes in there, it found something. And instead of looking at the if statement you need to look at your html and see what it found.

Answer 5

It is probably not the most elegant solution. But somehow

currentQuestion.data("index") != null

worked out. If you check all the options I tried before, the most similar to this one had this comparison element: !== and not != . That change made the difference. If someone can explain why, I'll grant him/her the correct answer.