Java Script / jQuery - простой оператор if, не работающий с предопределенной переменной

Question

Извините, я новичок в этом.

Есть ли конкретная причина, почему оператор if в этом фрагменте не работает? Если да, может ли кто-нибудь указать мне правильное направление?

var app = (function(){
   selector = {
       app: ".js-app",
       app__home: ".js-app__home"
   }

   foo();

   foo = function () {
     console.log(selector.app__home);
     if ($(selector.app).hasClass(selector.app__home)) {
        console.log("is home page")
     }
   }       
})();

$(document).on("ready", function() {
   app();
});

Первый вывод console.log () - выход за пределы оператора if работает корректно. Спасибо!

Answer 1

app не определяется как функция. Вы присвоили IIFE для app, чтобы IIFE ничего не возвращал явно, поэтому он возвращает undefined неявно. Затем, после того как документ готов, вы пытаетесь выполнить app, предполагая, что это функция. Это ошибка.

Должны работать следующие:

var app = function(){
   var selector = {
       app: ".js-app",
       app__home: "js-app__home"
   }

   foo();

   var foo = function () {
     console.log(selector.app__home);
     if ($(selector.app).hasClass(selector.app__home)) {
        console.log("is home page");
     }
   }       
};

$(document).on("ready", function() {
   app();
});

Пока вы это делаете, определите селектор и foo, используя var или let или const, иначе вы сделаете их глобальными.

Answer 2

Здесь вы найдете обновленный код ... функция 'foo', вызываемая до ее определения, поэтому переместите вызов функции 'foo' после определения функции 'foo' ... и не нужно использовать '.' в методе hasClass ... удалил '.' из app__home property ...

var app = (function(){
   selector = {
       app: ".js-app",
       app__home: "js-app__home"
   }

   foo = function () {
     console.log(selector.app__home);
     if ($(selector.app).hasClass(selector.app__home)) {
        console.log("is home page")
     }
   }      
   foo();
})();

$(document).on("ready", function() {
   app();
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="js-app js-app__home">

</div>