Javascript и JQuery получают право это

Question

У меня есть пример кода, который выглядит следующим образом:

var myDrawingArea = new DrawingArea(document.getElementById("drawing_canvas"));

function DrawingArea(aCanvas) {
    this.brushSize = 2;

    this.buildToolbar = (function () {
         $("#brush-size")
            .slider({
                value: this.brushSize, // this is DrawingArea instance
                slide: function (event, ui) {
                     //*************** PROBLEM ***************
                     // this is referring to the slider DOM element not my DrawingArea instance
                     // how can I access both the outer "this" and the inner one?
                     this.brushSize =  ui.value;
                     $(this).find(".ui-slider-handle").text(this.brushSize);
                }
            })
            .find(".ui-slider-handle").text(this.brushSize);
    });
}

Как сказано в комментарии "как я могу получить доступ как к внешнему" this ", так и к внутреннему?"

Answer 1

Вы можете сохранить ссылку на нее, например так:

function DrawingArea(aCanvas) {
    var self = this;
    self.brushSize = 2;    
    self.buildToolbar = (function () {
         $("#brush-size")
            .slider({
                value: self.brushSize,
                slide: function (event, ui) {
                     self.brushSize = ui.value;
                     $(this).find(".ui-slider-handle").text(self.brushSize);
                }
            })
            .find(".ui-slider-handle").text(this.brushSize);
    });
}

Вы могли бы использовать this или self вне обратного вызова slide, но я думаю, что яснее быть последовательным.