Javascript: Self и это

может кто-нибудь объяснить, почему я получаю разные значения и это? Где ссылка на это.

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();

Я использую self в проекте, и это мой первый раз, чтобы иметь эту проблему.

7
javascript prototype self this

4 ответов

это так self относится к экземпляру Parent, но только экземпляры Child есть a собственность.

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

поэтому, когда вы называете func на примере Child, this относится к этому экземпляру. Вот почему this.a дает вам правильное значение внутри func.

9

внутри func, this относится к экземпляру Child.

Child.prototype.__proto__ = new Parent;

прототип Child устанавливается в экземпляр Parent. Так когда ch.func() вызывается, func() на цепи прототипов Child, но вызывается в контексте ch который является экземпляром Child

self по-прежнему ссылается на экземпляр Parent который не имеет атрибута a

для дальнейшей иллюстрации:

var p = new Parent();

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

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();
0

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>
0