これは、ES5ではデフォルトでウィンドウオブジェクトを指し、 ES6のVueではデフォルトでVueインスタンスを指します。基本的に違いはなく、最上位のオブジェクトを指します。
ES5グローバル環境では、これは常にグローバルオブジェクト（ウィンドウ）を指します
console.log(this.document=== document); // true
// 在浏览器中，全局对象为 window 对象：
console.log(this === window); // true
this.name = 'zhangsan';
console.log(window.name); // zhangsan
これが関数内にある場合は、この関数のスコープを指します。関数内にコールバックがある場合、コールバック関数内のこのスコープは、コールバック関数を指すように変更されるため、varは通常関数で使用されます。 that = thisを保存します。
例：
searchMusic: function () {
// 存数据，this在axios请求后会变
var that = this;
axios.get("https://autumnfish.cn/search?keywords=" + this.query).then(
function (res) {
// console.log(res.data.result.songs);
that.musicList = res.data.result.songs;
console.log(that.musicList);
},
function (err) {
console.log(err);
}
);
},
別の例は、ES5でのこれのポイントです。varthat= thisはこれを保存するために使用されないため、スコープが変更されます。これのポイントは、関数が呼び出されるオブジェクト、つまりthis.c {}です。 this.aは、this.c {}のaの値を取得します。
var factory = function(){
this.a = 'a';
this.b = 'b';
this.c = {
a:'1',
b:function(){
return this.a}
}
};
console.log(new factory().c.b());
//结果：1
次に、この例では、事前にvar that = thisを定義します。これは、thisをその変数に格納することと同じです。現時点では、コールバック関数でthat.aを使用することは、関数でthisを使用することと同じです。
var factory = function(){
this.a = 'a';
this.b = 'b';
var that = this;
this.c = {
a:'1',
b:function(){
return that.a}
}
};
console.log(new factory().c.b());
//结果：a
ES6では新たにarrow関数が導入されました。arrow関数では、これはコンテキストオブジェクトを指すため、var that = thisを記述する必要はありません。
es6矢印関数には独自のthisがありません
。es6矢印関数のthisは、外部コードブロックのthisです。