2015-07-16 4 views
9

Я в настоящее время работаю через Отдельные веб-приложения от Mikowski и Powell. Проработав простой учебник в главе 1, я смущен тем, почему необходимо return true и return false в функциях toggleSlider(), onClickSlider() и initModule().Зачем возвращать true или false из функций?

Какая дополнительная польза от этого? Когда я запускал приведенный ниже код без return true и return false, он работал точно так же, как и с операторами возврата.

Какова подходящая ситуация, для которой наличие этих возвратных заявлений действительно полезно и необходимо?

var spa = (function($) { 
    var configMap = { 
     extended_height: 434, 
     extended_title: 'Click to retract', 
     retracted_height: 16, 
     retracted_title: 'Click to extend', 
     template_html: '<div class="spa-slider"><\/div>' 
    }, 
    $chatSlider, 
    toggleSlider, onClickSlider, initModule; 

    toggleSlider = function() { 
    var slider_height = $chatSlider.height(); 

    if (slider_height === configMap.retracted_height) { 

     $chatSlider 
     .animate({ 
      height: configMap.extended_height 
     }) 
     .attr('title', configMap.extended_title); 
     return true; 

    } else if (slider_height === configMap.extended_height) { 
     $chatSlider 
     .animate({ 
      height: configMap.retracted_height 
     }) 
     .attr('title', configMap.retracted_title); 
     return true; 

    } 

    console.log("Nothing to extend or retract. No events fired."); 
    return false; 
    }; 

    onClickSlider = function(event) { 
    console.log("Calling onClickSlider click event"); 
    toggleSlider(); 
    return false; 
    }; 

    initModule = function($container) { 
    $container.html(configMap.template_html); 

    $chatSlider = $container.find('.spa-slider'); 

    $chatSlider 
     .attr('title', configMap.retracted_title) 
     .click(onClickSlider); 

    return true; 
    }; 

    return { 
    initModule: initModule 
    }; 

}(jQuery)); 

jQuery(document).ready(
    function() { 
    spa.initModule(jQuery('#spa')); 
    } 
); 

body { 
    width: 100%; 
    height: 100%; 
    overflow: hidden; 
    background-color: #777; 
} 
#spa { 
    position: absolute; 
    top: 8px; 
    left: 8px; 
    bottom: 8px; 
    right: 8px; 
    border-radius: 8px 8px 0 8px; 
    background-color: #fff; 
} 
.spa-slider { 
    position: absolute; 
    bottom: 0; 
    right: 2px; 
    width: 300px; 
    height: 16px; 
    cursor: pointer; 
    border-radius: 8px 0 0 0; 
    background-color: #f00; 
} 

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> 
    <div id="spa"> 
     <div class="spa-slider"></div> 
    </div> 
</script> 
+0

Насколько я могу судить, эти возвращаемые значения не имеют никакой цели. Я подозреваю, что это всего лишь авторский стиль, он любит иметь явные возвращаемые значения. 'toggleSlider' использует возвращаемое значение, чтобы указать, было ли оно что-либо, что может быть полезно для отладки в консоли, хотя для этой же цели также используется' console.log() '. – Barmar

+0

@nhgrif Извиняюсь. Я отказываюсь от ссылки на обзор кода. Моя точка зрения по-прежнему стоит на том, что, похоже, это тоже не по теме, поскольку она не спрашивает о какой-то конкретной проблеме, на которой у постели проблемы с поиском разрешения. – Claies

+0

@Claies Затем я рекомендую найти близкую причину и проголосовать за нее и, возможно, снизить ее? Вы уверены, что этот вопрос вне темы для SO, но у него есть нулевые нисходящие и нулевые близкие голоса. Для меня этот вопрос кажется совершенно прекрасным для SO, действительно. – nhgrif

ответ

6

Часто в обработчиках событий возврат false - это способ сообщить об этом событию, чтобы оно не срабатывало. Так, например, в случае onsubmit это означает, что форма не отправляется.

В вашем примере return true; произойдет анимация, а return false; - нет.

В качестве альтернативы, вы можете сделать e.preventdefault() вместо return false;.

+1

Но большинство из этих функций не являются обработчиками событий. – Barmar

+0

Привет, Николас, спасибо за ответ. Это подтверждает мои опасения. Лучший! – abmantha

4

Возвращаемые значения, подобные этому, в функциях Javascript часто используются для указания успеха или неудачи. Вы можете создать простую структуру управления потоком, делая что-то вроде:

var doSomething = function() { 
    if (error) { 
     return false; 
    } else { 
     return true; 
    } 
}; 

if (doSomething()) { 
    doSomethingElse(); 
} else { 
    console.log("There was an error!"); 
} 

Тем не менее, это редко хорошая идея использовать это для чего-нибудь, кроме быстрой демонстрации. return false известен тем, что производит неожиданные результаты при использовании исключительно в этом виде - почти всегда есть лучший вариант для достижения вашей цели (если ваша цель не возвращает логическое значение!). Если вам просто нужно избежать активной функции, вы можете просто использовать return;.

В вашем конкретном коде, toggleSlider(), кажется, возвращаются эти значения для указания активности, в то время как onClickSlider() использует return false вместо e.preventDefault() как Николас упоминается в их ответе. Вы можете узнать больше о том, почему это часто бывает плохой идеей: http://fuelyourcoding.com/jquery-events-stop-misusing-return-false/

+0

Отличная ссылка на статью. Спасибо. Лучший! – abmantha

-1

Мне кажется, что вы ищете жесткое правило, где на самом деле его нет.

Вы спрашиваете: «Почему» это правило существует, когда это действительно не так.

Вы все еще читаете глава 1 из Mikowski и Пауэлл одной страницы веб-приложений, и я очень рад, что они получают, чтобы вы думали, и заметить, возвращаемое значение вашей функции.

Существует много возможных возвращенных значений - true и false - это всего лишь два очень распространенных и очень важных варианта.

В более сложных функциях вы можете найти self или object любого количества различных возвращаемых значений - все в соответствии с архитектурой приложения и то, что вам нужно.

Например, в объектно-ориентированном программировании для простых функций становится все более распространенным self. Это позволяет вам связывать разные функции в одной строке ... но что объектно-ориентированное программирование связано с главой 1?

Я рекомендую вам позволить себе больше времени и опыта. Пока я предлагаю вам доверять процессу. Миковски и Пауэлл делают все возможное, чтобы накормить вас большим количеством знаний ... но они должны разделить его на кусочки и кусочки меньшего размера.

Удачи!

+2

Downvote как это ни в коей мере не попытка ответить на вопрос. Это приятное настроение! Может быть, просто оставите обнадеживающий комментарий? – Alex

+1

Привет, Алекс, спасибо за отзыв. Однако это отвечает на вопрос, заявляя, что предпосылка вопроса неверна. Вопрос: «Почему X истинно», а ответ «X неправда». – Myst

+0

Hi @Alex - см. Мой комментарий и пересмотр. – Myst

Смежные вопросы