关于JS对象及类内部this指向问题

Question

var obj = {
  a:4,
  b:this.a+1,
  f: function(){
    console.log(this.a)   //4
    console.log(this)     //{ a: 4, b: NaN, f: [Function: f] }
    console.log(this.b)   //NaN
    console.log(a)        //a is not defined
  }
}

为什么在对象内部定义的函数中不使用this就取不到对象内部的属性呢，它无法根据作用域链取得a的值吗？为什么对象内部的this有时指向obj，有时指向window？能具体讲讲四个结果出现的原因吗？谢谢大神

Answer 1

我猜你的函数是这样调用的：

obj.f();
那么，函数调用时候，它前面有个【点】，一般情况下，点前面是谁，被调用的这个函数里面的this就是谁。

好啦，这里【点】前面是obj，调用函数时候，就替换一下吧
obj.fn()
=> this:obj
=> console.log(this.a) :console.log(obj.a) 找到obj上有属性a，输出：4
=> console.log(this) : console.log(obj); 输出的就是obj这个对象
=> console.log(this.b) : console.log(obj.b); 输出的是obj上的属性b的值
=> console.log(a); 根据作用域链查找：先找自己作用域下的变量a，没找到；那就去上级作用域查找，一直找到全局作用域下，都没有找到变量a：那么会报错 a is not defined

这里面 obj.b 的值是NaN ，因为给他赋值是 this.a + 1 ，要找到此处的this：全局window
好啦，替换一下吧，this.a=>window.a=>在window对象上没有找到a这个属性=>undefined
好啦，计算一下吧 undefined+1 => NaN

---

可以参考这个：https://segmentfault.com/a/11...

Answer 2

新人必须搞懂的问题！！下面是我的笔记 ... 如果还是不懂赶快去查

作用域：
1.全局作用域
每个JS文件就是一个全局的作用域，它有且只有一个

2.局部作用域
每个独立的函数就是：局部作用域，平级的局部作用域不可相互访问

3.词法作用域
在函数内部可以访问的上级的作用域就是：词法作用域


闭包：
闭包是有权访问另一个函数作用域中变量的函数，举个栗子
function robot() {
    var name = '小仙女' 
    return function() { console.log(`我是${name}，喵 ~`)}
}
var kitty = robot()
注意！突出的是内部函数（匿名函数）能够访问外部函数中的变量


this：
在 JavaScript 中的 this 总是指向调用它所在的的对象，并且 this 是在函数运行时自动生成的内部对象，因此只能在函数内部使用

有以下几个栗子：
1.全局的函数调用的时候，this 指向 window 对象，或者说函数定义时所在的作用域
var name = "global this";
function globalTest() {
    this.name = "rename global this"
    console.log(this.name);
}
globalTest();             // rename global this
console.log(name);  // rename global this


2.如果函数作为对象的方法调用，this指向的是这个上级对象，即调用方法的对象
function showName() { console.log(this.name); }
var obj = {};
obj.name = "ooo";
obj.show = showName;
obj.show(); //ooo


3.构造函数中的this指向新创建的对象本身
function showName() { this.name = "showName function"; }
var obj = new showName();
console.log(obj.name); //showName function

Answer 3

建议仔细看下js中this指向问题https://bingxl.cn/js中的this.html

Answer 4

1、当前this指向obj不是window
2、作用域，a,b,f是相互独立的，三者没有任何关系，作用域链是怎么找的你回忆一下
3、你这段代码的所有this都是指向obj,(具体情况要具体分析)

var obj = {
  a:4,
  b:this.a+1,
  f: function(){
    console.log(this.a)   //4
    console.log(this)     //{ a: 4, b: NaN, f: [Function: f] }
    console.log(this.b)   //NaN（keyVALU不支持运算）
    console.log(a)        //a is not defined（a在F里并没有定义，所以defined）
  }
}