Javascript 函数赋值后未定义

Question

So I was reading the book Professional Javascript for Web developers and came across the following examples.

var object = {
  name: "my Object",
  getName: function() {
    return this.name;
  }
}

The author then shows the following results:

object.getName(); // "my Object"
(object.getName)(); // "my Object"
(object.getName = object.getName)() // "undefined"

I understand the first case but have the following questions for case 2 and case 3.

Case 2: What does putting a parentheses around object.getName do? So far I only know that you can put parentheses around anonymous function to call it immediately (Immediately-invoked function expression). But what if the function is not anonymous?

Case 3: Why is this not maintained after the assignment?

Answer 1

The issue here really doesn't have anything to do with this changing . What's different about the third case is that the value used as the function reference has lost its relationship to the context object.

When a function reference is obtained by evaluating an object property reference, and then that function is invoked, JavaScript makes sure that this in the function is set to the object involved. That's how the first two cases work.

In the third case, the function reference is originally obtained from the object, but the overall value of

(object.getName = object.getName)

is the value of that = assignment. Because of that, the relationship to the object is broken, and all you've got is a reference to a function. The invocation therefore won't set this . It's as if you'd written:

var something = object.getName;
something();

That also won't set this to object . Only when the function reference comes straight from a . or [ ] operation will the object involved end up as this in the call. The parentheses in case 2 are sort-of a special case; in JavaScript, parentheses do not evaluate to anything; they affect the way the expression is parsed but they don't actively do anything.