使用'；这'；在Javascript构造函数中访问属性

我正在使用HTML5从网络摄像头获取照片。然后我编写一个Camera对象来处理这个问题，如下所示：

function Camera(width) {
    this.video = $("video#videoInput");
    this.canvas= $("#editor");

    this.width = 0;
    this.height = 0;
    this.hasGetUserMedia = function() {/*check camera available*/};

    var errorCallback = function(e) {};
    this.turnOn = function() {
        if (this.hasGetUserMedia()) {
            // Good to go!      
            navigator.getUserMedia({video: true}, function(stream) {        
                this.video[0].src = window.URL.createObjectURL(stream);
                //this is video property of Camera
            }, errorCallback);
        } 
    }    
}
var cam = new Camera();
cam.turnOn()

但我可以通过一些方法访问摄影机属性，例如

Camera.turon（）

。当我使用

this.video

时，控制台输出

未定义错误

。我知道

这个

在这种情况下意味着

导航器对象

---

那么，如何在另一个对象的回调函数中访问摄影机属性呢？

保存一个对您自己的引用，您可以在闭包中访问该引用：

function Camera(width) {
    this.video = $("video#videoInput");
    this.canvas = $("#editor");

    this.width = 0;
    this.height = 0;
    this.hasGetUserMedia = function() {/*check camera available*/
    };

    var errorCallback = function(e) {
    };
    this.turnOn = function() {
        if (this.hasGetUserMedia()) {
            var self = this;
            navigator.getUserMedia({
                video: true
            }, function(stream) {
                self.video[0].src = window.URL.createObjectURL(stream);
                //this is video property of Camera
            }, errorCallback);
        }
    }
}

var cam = new Camera();
cam.turnOn()

---

保存对您自己的引用，您可以在闭包中访问该引用：

function Camera(width) {
    this.video = $("video#videoInput");
    this.canvas = $("#editor");

    this.width = 0;
    this.height = 0;
    this.hasGetUserMedia = function() {/*check camera available*/
    };

    var errorCallback = function(e) {
    };
    this.turnOn = function() {
        if (this.hasGetUserMedia()) {
            var self = this;
            navigator.getUserMedia({
                video: true
            }, function(stream) {
                self.video[0].src = window.URL.createObjectURL(stream);
                //this is video property of Camera
            }, errorCallback);
        }
    }
}

var cam = new Camera();
cam.turnOn()

---

您可以存储引用并将其传递到任何需要的地方（或者直接使用它，具体取决于范围）

或：

您可以调用另一个函数，就好像它是

this

someotherFunction.call(this);

我会继续在函数开头缓存引用：

function Camera(width) {
  var that = this;

---

然后，您可以在任何需要的地方使用它。

您可以存储引用并将其传递到任何需要它的地方（或者直接使用它，具体取决于范围）

或：

您可以调用另一个函数，就好像它是

this

someotherFunction.call(this);

我会继续在函数开头缓存引用：

function Camera(width) {
  var that = this;

---

然后，您可以在任何需要的地方使用它。

哦，解决方案很简单，但非常有效！谢谢大家!//我将接受@m59声誉：D，答案相同！与其说是self，不如说是self，我更喜欢用一些东西来表示它引用了一个实例，比如说，

var-cam=this

@RobG是的，

self

让我想到了

this

，所以我总是喜欢

this

，因为它很像

this

，但让我知道它是“其他的”

this

。哦，解决方案简单但非常有效！谢谢大家!//我将接受@m59声誉：D，答案相同！与其说是self，不如说是self，我更喜欢使用一些表示它引用了一个实例的东西，比如说

var-cam=this

@RobG是的，

self

让我想到

this

，所以我一直喜欢

this

，因为它非常像

this

，但让我知道这是“其他”

this

。谢谢！很简单。someotherFunction.call（此）对于重用函数非常有用。@Davuz

call（）

在您开始处理继承时非常有用。在询问之前，我尝试使用

navigator.getUserMedia.call（此，…）

但是我得到一个错误

未捕获类型错误：非法调用

@Davuz在这种情况下更改

这个

指针不是最安全的方法。我只需要缓存对

var的引用，并在回调函数中使用它。如果您正在调用的函数也需要引用自身，那么更改指针可能会把事情搞砸。当您需要更改此指针的位置时，请使用
call（）
，否则只需引用其他对象即可。谢谢！很简单。someotherFunction.call（此）对于重用函数非常有用。@Davuz
call（）
在您开始处理继承时非常有用。在询问之前，我尝试使用
navigator.getUserMedia.call（此，…）
但是我得到一个错误
未捕获类型错误：非法调用
@Davuz在这种情况下更改
这个
指针不是最安全的方法。我只需要缓存对
var的引用，并在回调函数中使用它。如果您正在调用的函数也需要引用自身，那么更改指针可能会把事情搞砸。当您需要更改此指针时，请使用
call（）
，否则只需使用对其他对象的引用。如果您的问题是，这将引用（浏览器中的别名），而不是“navigator对象”，后者是由引用的另一个对象。如果您的问题是，这将引用（浏览器中的别名），而不是“导航器对象”，它是由引用的不同对象。