Object defineProperty 混淆了我对 hoisting / sync 和 async js 的思考方式

Question

当谈到浏览器如何加载数据并将其呈现给用户时，我认为我对异步/同步/提升有很好的理解。然而下面这个例子让我陷入了循环，让我 post 这个例子然后解释问题：

var obj = {
  counter: 0,
};

Object.defineProperty(obj, 'reset', {
  get: function() {
    return this.counter = 2;
  }
});

Object.defineProperty(obj, "increment", {
  get: function() {
    return this.counter++;
  }
});

Object.defineProperty(obj, "decrement", {
  get: function() {
    return this.counter--;
  }
});

console.log(obj.reset) //2
console.log(obj.increment + ' ' + "incremented") // "2 incremented"
console.log(obj.decrement + ' ' + "decremented") // "3 decremented"

我认为浏览器解释的方式是运行同步每一行代码，这应该生产：

//2
//2 incremented
//2 decremented

因为如果您一直跟踪对 'counter' 的更改，直到调用控制台日志，计数器将从 0 变为 2 再变为 3 回到 2。

然后我想等一下；如果返回的值不全是 2，那么调用这些控制台日志可能是一种获取数据的异步方式，这在逻辑上会让我认为结果应该是：

//2
//3
//2

因为如果您在运行控制台日志时访问 'counter' 属性，那么逻辑上计数器值将从 0 变为 2 在 (obj.reset) 之后 3 在 (obj.increment) 然后 2 在 (obj.decrement)

我对浏览器如何解释这个的方式显然是错误的，并且想要一个明确的逐步解释为什么返回的值是：

//2
//2 incremented
//3 decremented

如果可能的话，谢谢。

Answer 1

你注意到了吗？

var cpt_A = 5;
var cpt_B = 5;

function func_A(){ return cpt_A-- } 
function func_B(){ return --cpt_B } 

console.log ( func_A() )   //  return 5.
console.log ( func_B() )   //  return 4.

是C语言的编程基础，在func_A的情况下returns是cpt_A的值，然后进行自减运算。在 func_B 的情况下，它对 cpt_B 进行递减操作，然后 returns 结果。

Answer 2

这与异步无关。 console.log 正在接收表达式并打印该值。 obj.increment returns 2 因为这就是 postfix ++ 运算符的工作方式。它在递增之前递增数字和 returns 值。所以，它最终是

console.log(2 + ' ' + "incremented")

console.log() 方法最终得到字符串 2 incremented。同样的逻辑适用于 decrement。表达式变为 console.log(3 + ' ' + "decremented")

Object defineProperty 混淆了我对 hoisting / sync 和 async js 的思考方式

Object defineProperty confuses the way I think about hoisting / sync and async js

javascript

increment

getter-setter