如何避免在自定义JavaScript库中调用不存在的元素时发生冲突？

Question

比方说，我有一个文件mylib.js，在其中声明了一些要在我正在处理的项目上重复使用的函数。

var mylib = function(s) {
    var x;

    var obj = {

        myLibrary(s){
            if (x) return x;
            return document.querySelector(s);
        },

        hide(){
            x.style.display='none';
            return this;
        },

        show(a=''){
            x.style.display=a;
            return this;
        }

    };

    x = obj.myLibrary(s);
    return obj;
};

现在，如果我有另一个文件website.js，我正在使用自定义JS库。例如，我的某些页面包含在启动时应保持隐藏的部分，因此我为他们提供了类.hidden并将其应用于我的website.js文件：

mylib('.hidden').hide();

...只要.hidden -class有任何元素，它就可以正常工作，但是在包含此文件的某些页面上也没有此类，因此实际上会导致冲突，并且控制台告诉我：x is null

此冲突的确切原因是什么？我如何避免这种冲突？

Answer 1

尝试if(mylib('.hidden').length)mylib('.hidden').hide();希望我正确理解了这个问题。

Answer 2

如果x为空，则需要对函数进行空检查。