如何在自身内部使用变量答案

【问题标题】：How to use a variable inside itself如何在自身内部使用变量
【发布时间】：2019-06-11 18:28:34
【问题描述】：

我想在内部使用变量，我看到其他人这样做，但为什么它对我不起作用？

这是我的 ES6 文件

// Setup module
// ------------------------------

var FullCalendarAdmin = function () {

    //
    // Setup module components
    //
    var _componentRender = function () {

    // Basic calendar
    var _componentFullCalendarAdmin = function (events) {

        // Define element
        var calendarAgendaViewElement = document.querySelector('.fullcalendar-agenda-admin');

        // Initialize
        if (calendarAgendaViewElement) {
            var calendarAgendaViewInit = new FullCalendar.Calendar(calendarAgendaViewElement, {
                plugins: ['dayGrid', 'timeGrid', 'interaction'],
                select: function (start, end) {
                    var title = prompt("Add event:");
                    var data;
                    if (title != '') {
                        data = {
                            title: title,
                            start: start,
                            end: end
                        };
                        calendarAgendaViewInit.addEvent(data);
                    }
            }).render();

        }
    };

    //
    // Return objects assigned to module
    //

    return {
        init: function () {
            _componentRender();
        }
    }
}();


// Initialize module
// ------------------------------

document.addEventListener('DOMContentLoaded', function () {
    FullCalendarAdmin.init();
});

如何使用calendarAgendaViewInit 调用addEvent 函数而不将函数视为未定义错误？

提前致谢！

【问题讨论】：

如果您在在函数内部声明“自身的函数”，那么您要编写的是一个对象类：write one of those instead。
谢谢！调查一下

标签： javascript ecmascript-6 fullcalendar-4

【解决方案1】：

问题是您立即调用.render。
所以你的calendarAgendaViewInit 不是FullCalendar.Calendar 的实例，而是render 方法的结果。
你可以做的是首先定义calendarAgendaViewInit变量

var calendarAgendaViewInit = new FullCalendar.Calendar(calendarAgendaViewElement, {
                plugins: ['dayGrid', 'timeGrid', 'interaction'],
                select: function (start, end) {
                    var title = prompt("Add event:");
                    var data;
                    if (title != '') {
                        data = {
                            title: title,
                            start: start,
                            end: end
                        };
                        calendarAgendaViewInit.addEvent(data);
                    }
            });

然后拨打calendarAgendaViewInit.render()。

【讨论】：

【解决方案2】：

这是对上述评论的一种扩展解释。看起来calendarAgendaViewElement 只是您找到并分配给变量的 DOM 元素。这里的问题是您只能在类实例上调用方法，这些实例现在是内部带有方法的对象。如果您看到其他人像这样调用addEvent，那么他们很可能在类的实例化上调用它，这意味着addEvent 之前已被声明为该类的一部分，而他们只是在调用该方法。

请看下面的例子，

如果我声明一个类如下：


class Sample {
   sayHello(){
      console.log('hello')
    }
 }

然后实例化一个'Sample'类的新对象：

var sampleClass = new Sample()

然后我可以通过引用对象内部的方法来调用'sayHello'

sampleClass.sayHello() // hello

希望有帮助

【讨论】：