javascript 严格模式下的全局变量

Question

我一直收到错误消息：

"Uncaught TypeError: Cannot read property 'hasClass' of undefined"

我知道它与全局变量和范围有关，但我无法弄清楚。任何帮助将不胜感激。

jQuery(function($) {
"use strict";

var global = this;
var carousel = null;

function mobileOnlySlider(carousel) {

    carousel = $('.woocommerce-product-gallery__wrapper').slick({

        // normal options...
        infinite: false,
        adaptiveHeight: true,
        dots: true,

    });//slick slider init
}//mobileOnlySlider function


mobileOnlySlider(global.carousel);

    function resetSlick(carousel) {
        $(window).on('resize', function() {
            if ($(window).width() > 768 ) {
                if (carousel.hasClass('slick-initialized')) {
                    carousel.slick('unslick');
                }
                else{
                    console.log("returned nothing.");
                    return;
                }
            }
            else {  
                if (carousel.hasClass('slick-initialized')) {
                    //do nothing
                    return;
                }
                else{
                    mobileOnlySlider(global.carousel);
                }
            }
        });//window resize
    }//function resetclick

resetSlick(global.carousel);


})();//plain js version of $window ready

Answer 1

您正在局部范围内重新定义一个全局变量

var carousel = null;

function mobileOnlySlider(carousel) {

    carousel = $('.woocommerce-product-gallery__wrapper').slick({

        // normal options...
        infinite: false,
        adaptiveHeight: true,
        dots: true,

    });//slick slider init
}//mobileOnlySlider function

在此方法中，carousel 是一个局部变量，而不是您期望的全局变量 - 当您这样调用它时：

mobileOnlySlider(global.carousel);

全局变量未更新。

一个选项是 return 来自该方法的值，并相应地更新变量

var carousel = null;

function mobileOnlySlider() {

    return $('.woocommerce-product-gallery__wrapper').slick({

        // normal options...
        infinite: false,
        adaptiveHeight: true,
        dots: true,

    });//slick slider init
}//mobileOnlySlider function

// elsewhere
carousel = mobileOnlySlider();

javascript 严格模式下的全局变量

global variable in javascript strict mode

javascript

global

this