Функции-члены Javascript выходят за рамки

Question

У меня есть класс, который создает объект привязки. Когда пользователь нажимает на якорь, я хочу, чтобы он запускал функцию из родительского класса.

function n()
{
    var make = function()
    {
        ...

        var a = document.createElement('a');    
        a.innerHTML = 'Add';
        //this next line does not work, it returns the error: 
        //"this.add_button is not a function"
        a.onclick = function() { this.add_button(); }                                               

        ...
    }

    var add_button = function()
    {
        ...
    }

}

Как мне это сделать?

Answer 1

Похоже, вам просто нужно избавиться от "этого". перед add_button ()

Вы объявляете add_button как локальную переменную (или приватную в странной манере работы классов javascript), поэтому она на самом деле не является членом элемента this.

Просто используйте:

a.onclick = function(){add_button();}

Answer 2

Причина, по которой он не работает, состоит в том, что this в контексте функции onclick отличается от this в контексте n функции / "класса". Если вы хотите, чтобы this внутри функции было эквивалентно this из класса, вам необходимо связать this с функцией.

Привязка - это способ изменения области действия функции. По сути, если вы привязываетесь к функции, вы заменяете переменную this, чтобы указывать на что-то другое. Вы можете прочитать больше о связывании в Javascript в этой альтернативной статье .

Если вы используете, например, прототип , вы можете сделать что-то вроде:

function n()
{
    var make = function()
    {
        ...
        a.onclick = function() { this.add_button() }.bind(this);
        ...
    }
}

Который связал бы класс n this с функцией onclick, таким образом давая желаемый эффект.

Answer 3

«Это» в «this.add_button ();» фактически ссылается на сам элемент привязки, который не имеет функции add_button (), если я не ошибаюсь

Возможно, это сработает:

a.onclick = function() { n.add_button(); }