jqueryfunctionundefineduse-strict

use strict leads to undefined function


I am trying to organize my js file and followed a suggested module pattern. When I use "use-strict" in this pattern a function is declared as undefined, without the "use-strict" method the function just works fine. Is the strict-mode recommended and when yes, why does the function not work with the use of it?

var envy = (function( $ ) {
   'use strict';

   /**
    * Viewport adjusments.
    *
    * @since 1.0.0
    */
   irp_viewportadjst = function() {
      $('meta[name="viewport"]').attr('content', 'width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0');
   },

   /**
    * Fire events on document ready, and bind other events.
    *
    * @since 1.0.0
    */
   ready = function() {
       irp_viewportadjst();
   };

   // Only expose the ready function to the world
   return {
       ready: ready
    };

   })( jQuery );
jQuery( envy.ready );

Solution

  • Variable declaration hoisting is required in your code. Strict mode declaration demands your function name to be defined earlier. Either define your function name var irp_viewportadjst, ready; or Change the code as below

    var envy = (function( $ ) {
       'use strict';
    
       /**
        * Viewport adjusments.
        *
        * @since 1.0.0
        */
       var irp_viewportadjst = function() {
          $('meta[name="viewport"]').attr('content', 'width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0');
       };
    
       /**
        * Fire events on document ready, and bind other events.
        *
        * @since 1.0.0
        */
       var ready = function() {
           irp_viewportadjst();
       };
    
       // Only expose the ready function to the world
       return {
           ready: ready
        };
    
       })( jQuery );
    jQuery( envy.ready );