Question

我很困惑为什么这段代码是这样编写的，但我确信理解这一点非常重要：

$.fn.mapImage = function(options){
    //Set user input options and defaults
    var optionConfig = $.extend({}, $.fn.mapImage.defaults, options);

    image=this;
    this.image = this;

    // Assign defaults
    this.getUrl = optionConfig.getUrl;
    this.saveUrl = optionConfig.saveUrl;
    this.deleteUrl = optionConfig.deleteUrl;
    this.editable = optionConfig.editable;
    this.pinpoints = optionConfig.pinpoints;
    image.pinpoints = optionConfig.pinpoints;
    image.pinpointCount = 0;


    this.canvas = $('<div class="canvas"><div class="create-mode"></div><div class="edit-mode"></div></div>');
    this.image.after(this.canvas);
    this.canvas.height(this.height());
    this.canvas.width(this.width());
    this.canvas.css('background-image', 'url("' + this.attr('src') + '")');
    this.canvas.children('.create-mode').css('cursor', 'crosshair');
    this.canvas.children('.create-mode, .edit-mode').height(this.height());
    this.canvas.children('.create-mode, .edit-mode').width(this.width());
    this.canvas.children('.edit-mode').show();
    this.canvas.children('.create-mode').hide();
    $(this).hide();


}

我不明白为什么代码有image=this和this.image=this，这是一回事吗？为什么不做像image.after(this.canvas)这样的事情this是否引用当前通过函数传递的对象？

Answer 1

之所以令人困惑（没有双关语）是因为你错过了上面例子中的一些代码才有意义：

var image; // necessary otherwise you'll get a runtime exception.

$.fn.mapImage = function(options){
    //Set user input options and defaults
    var optionConfig = $.extend({}, $.fn.mapImage.defaults, options);

    image=this;
    this.image = this
    ...

现在，当你看看：

image=this;
this.image = this

它更有意义不是吗？第一个赋值是局部变量“var image”。这样，即使函数执行完毕，也会保留引用。

第二个作业是针对当前对象的属性，由“this”命名。

以下是您的解释，但对我来说，代码中无需使用this.image和image。只需使用image即可。

Answer 2

我不明白为什么代码有image=this和 this.image=this，这是一回事吗？

不，他们不是......

image = this;
this.image = this;

我们可以说image和this.image指的是同一件事this，对吗？

image = this;
// ^      ^----- current object
// | --- this image is a variable
this.image = this;
//     ^--- this image is a property of current object, this 
// because of image = this;, we can also say that
image.image = this;
// ^    ^      ^----- current object
// |    |------------ property
// |----------------- variable

您还可以获得一些idea here

在jQuery中，在这种情况下如何正确使用“this”？

2 个答案: