使用严格会导致未定义的功能

Posted 2023-02-22

【中文标题】使用严格会导致未定义的功能

【英文标题】：use strict leads to undefined function

【发布时间】：2017-12-04 11:00:35

【问题描述】：

我正在尝试组织我的 js 文件并遵循建议的模块模式。当我在这种模式中使用“use-strict”时，一个函数被声明为未定义，没有“use-strict”方法，该函数就可以正常工作。是否推荐使用严格模式，如果是，为什么使用它时该功能不起作用？

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 );

【问题讨论】：

推荐使用严格模式，因为它可以捕捉错误。该函数无法使用它，因为它包含错误，例如未声明的变量和无意的逗号。看起来它最初在 irp_viewportadjst 上方有一个 var 丢失了。

【参考方案1】：

您的代码中需要变量声明提升。严格模式声明要求您的函数名称在前面定义。 定义您的函数名称 var irp_viewportadjst, ready; 或 修改代码如下

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 );

【讨论】：

是的，这行得通。但是，您能否解释一下，为什么教程 (gamajo.com/javascript-module-pattern-example) 似乎可以在每个函数上不使用 var 的情况下工作？我想像教程一样构建自定义文件，所以我需要将每个函数都设为变量吗？