javascriptのthis

1967 ワード

thisについて
実はthisは現在のバインディング方法の対象です.もし定義がないなら、globalです.厳格なモードであれば、undefinedです.
面接官がthisの問題を聞いても、できませんでした.
var a = {
    "course":"English",
    "teach":function () {
        function print() {
            return "teach " + this.course;
        }
        return print();
    }
}
console.log(a.teach())
a.teachの中にthisがあるということは、print自体にバインディング対象がないということです.globalかundefinedかは、厳格なモードかどうかによって決まります.この問題の答えは簡単ですが、当時はthisのこの穴に対して、踊りすぎました.簡単にまとめてみますと、thisは対象を指しています.
簡単な呼び出し
非厳格モードでは、簡単呼び出しはglobalオブジェクトです.
function f1(){
  return this;
}
f1() === window; // global object
厳格モードでは、undefinedです.
function f2(){
  "use strict"; // see strict mode
  return this;
}
f2() === undefined;
つまり、関数がメソッドやオブジェクトの属性として呼び出されないとundefinedとなります.
Arow functions[ES 6]

対象とする方法
var o = {
  prop: 37,
  f: function() {
    return this.prop;
  }
};
console.log(o.f()); // logs 37
もちろん動的バインディングとしても大丈夫です.
var o = {prop: 37};
function independent() {
  return this.prop;
}
o.f = independent;
console.log(o.f()); // logs 37
プロトタイプチェーンにおける役割
var o = {f:function(){ return this.a + this.b; }};
var p = Object.create(o);
p.a = 1;
p.b = 4;

console.log(p.f()); // 5
thisとは呼び出しのobjectのことです.
getterとsetter
function sum(){
  return this.a + this.b + this.c;
}

var o = {
  a: 1,
  b: 2,
  c: 3,
  get average(){
    return (this.a + this.b + this.c) / 3;
  }
};

Object.defineProperty(o, 'sum', {
    get: sum, enumerable:true, configurable:true});

console.log(o.average, o.sum); // logs 2, 6
これらは、関数実行時に結合されたオブジェクトとして理解できます.
コンストラクタとして
function C(){
  this.a = 37;
}

var o = new C();
console.log(o.a); // logs 37


function C2(){
  this.a = 37;
  return {a:38};
}

o = new C2();
console.log(o.a); // logs 38
newとも取れる過程は、元の形に戻るための一つの方法です.