Welcome to Software Development on Codidact!

Will you help us build our independent community of developers helping developers? We're small and trying to grow. We welcome questions about all aspects of software development, from design to code to QA and more. Got questions? Got answers? Got code you'd like someone to review? Please join us.

Post History

81%

+7 −0

Q&A Function call; `this` gets bound to unexpected value

I recently encountered a strange situation in javascript; if I have: let obj = { a: function() { return (this === obj) ? this.b : 'bye'; }, b: 'hello' }; I can call obj.a with this bound...

2 answers · posted 3y ago by Gershy‭ · last activity 3y ago by Alexei‭

Question javascript function this

#2: Post edited by

Alexei‭ · 2020-10-25T06:38:54Z (over 3 years ago)
added tag

Copy Link

Raw

Markdown

I recently encountered a strange situation in javascript; if I have:
```
let obj = {
a: function() {
return (this === obj) ? this.b : 'bye';
},
b: 'hello'
};
```
I can call `obj.a` with `this` bound to `obj` by simply calling `obj.a()` (producing `"hello"`).
The following allows me to call `obj.a` with `this` bound to the global object (and the result is `"bye"`):
```
let a = obj.a;
console.log(a());
```
I assumed that I could shorten my code to call `obj.a`, with `this` unbound from `obj`, using:
```
console.log((obj.a)())
```
I was surprised to find that when the above function is called, `this` is *still* bound to `obj`! It seems that here, `(obj.a)` resolves to not just the function, but also holds information about the "boundedness" of the function!
I was especially surprised since I had assumed that any code which declares `let v = <some code>;` and then goes on to use `v` was always interchangeable with using `<some code>` inline, so long as it is wrapped in parentheses.
- Is this intentional functionality? (I assume so)
- What technical vocabulary can be used to describe this situation? (E.g. "boundedness" is my own invention)
~~- Where in the spec is this behaviour outlined?~~

I recently encountered a strange situation in javascript; if I have:
```
let obj = {
a: function() {
return (this === obj) ? this.b : 'bye';
},
b: 'hello'
};
```
I can call `obj.a` with `this` bound to `obj` by simply calling `obj.a()` (producing `"hello"`).
The following allows me to call `obj.a` with `this` bound to the global object (and the result is `"bye"`):
```
let a = obj.a;
console.log(a());
```
I assumed that I could shorten my code to call `obj.a`, with `this` unbound from `obj`, using:
```
console.log((obj.a)())
```
I was surprised to find that when the above function is called, `this` is *still* bound to `obj`! It seems that here, `(obj.a)` resolves to not just the function, but also holds information about the "boundedness" of the function!
I was especially surprised since I had assumed that any code which declares `let v = <some code>;` and then goes on to use `v` was always interchangeable with using `<some code>` inline, so long as it is wrapped in parentheses.
- Is this intentional functionality? (I assume so)
- What technical vocabulary can be used to describe this situation? (E.g. "boundedness" is my own invention)
- Where in the spec is this behaviour outlined?

#1: Initial revision by

Gershy‭ · 2020-09-01T15:52:19Z (over 3 years ago)

Copy Link

Raw

Markdown

Function call; `this` gets bound to unexpected value

I recently encountered a strange situation in javascript; if I have:

```
let obj = {
  a: function() {
    return (this === obj) ? this.b : 'bye';
  },
  b: 'hello'
};
```

I can call `obj.a` with `this` bound to `obj` by simply calling `obj.a()` (producing `"hello"`).

The following allows me to call `obj.a` with `this` bound to the global object (and the result is `"bye"`):

```
let a = obj.a;
console.log(a());
```

I assumed that I could shorten my code to call `obj.a`, with `this` unbound from `obj`, using:

```
console.log((obj.a)())
```

I was surprised to find that when the above function is called, `this` is *still* bound to `obj`! It seems that here, `(obj.a)` resolves to not just the function, but also holds information about the "boundedness" of the function!

I was especially surprised since I had assumed that any code which declares `let v = <some code>;` and then goes on to use `v` was always interchangeable with using `<some code>` inline, so long as it is wrapped in parentheses.

- Is this intentional functionality? (I assume so)
- What technical vocabulary can be used to describe this situation? (E.g. "boundedness" is my own invention)
- Where in the spec is this behaviour outlined?

javascript function

Communities

Post History