Javascript: Selbst und Dies

Question

Kann mir jemand erklären, warum ich unterschiedliche Werte für self und this erhalte? Wobei self ein Verweis auf this ist.

function Parent(){
   var self = this;
   this.func = function(){
      // self.a is undefined
      // this.a is 'Test'
      console.log(self.a, this.a);
   }
}

function Child(x){
   this.a = x;
}

Child.prototype.__proto__ = new Parent;
var ch = new Child('Test');
ch.func();

Ich habe self on project verwendet und habe dieses Problem zum ersten Mal.

Answer 1

Der Grund dafür ist self verweist auf eine Instanz von Parent sondern nur Instanzen von Child haben eine a Eigentum.

function Parent(){
   var self = this; // this is an instance of Parent
   this.func = function(){
      console.log(self.a, this.a);
   }
}

function Child(x){
    this.a = x; // Instances of Child have an `a` property
}

Child.prototype.__proto__ = new Parent;
var ch = new Child('Test');

ch.func(); // Method called in context of instance of Child

Wenn Sie also anrufen func auf eine Instanz von Child , this bezieht sich auf diese Instanz. Deshalb this.a gibt Ihnen den richtigen Wert in func .

Answer 2

Unter func , this verweist auf eine Instanz von Child .

Child.prototype.__proto__ = new Parent;

Der Prototyp von Child wird auf eine Instanz von Parent . Wenn also ch.func() aufgerufen wird, func() befindet sich auf der Prototypenkette von Child sondern wird im Kontext von ch die eine Instanz von Child

self bezieht sich immer noch auf die Instanz von Parent das kein Attribut hat a

Zur weiteren Veranschaulichung:

var p = new Parent();

// this.a is undefined because this is an instance of Parent
p.func(); // undefined undefined

Answer 3

var myObject = {
    foo: "bar",
    func: function() {
        var self = this;
        console.log("outer func1:  this.foo = " + this.foo); //bar
        console.log("outer func2:  self.foo = " + self.foo); //bar
        (function() {
            console.log("inner func3:  this.foo = " + this.foo); //undefind
            console.log("inner func4:  self.foo = " + self.foo);//bar
        }());
    }
};
myObject.func();

Answer 4

function Foo() {
  this.bar = 'bar';
  return this;
}
Foo.prototype.test = function(){return 1;}

function Bar() {
  this.bro = 'bro';
  return this;
}
Bar.prototype.test2 = function(){return 2;}

function Cool2() {
  Foo.call(this);
  Bar.call(this);

  return this;
}
//console.log(Object.create(Bar.prototype));
var combine = Object.create(Foo.prototype);
//console.log(combine);

$.extend(combine, Object.create(Bar.prototype));
$.extend(combine, Object.create(Foo.prototype));

Cool2.prototype = Object.create(combine);
//Cool2.prototype.constructor = Cool2;

var cool = new Cool2();

console.log(cool.test()); // 1
console.log(cool.test2()); //2
console.log(cool.brow) //bro
console.log(cool.bar) //bar
console.log(cool instanceof Foo); //true
console.log(cool instanceof Bar); //false

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.2.3/jquery.min.js"></script>