learn-co-curriculum / js-advanced-functions-context-and-implicit-setting

Other
1 stars 71 forks source link

Possible out of date information in the README #2

Open Sdcrouse opened 4 years ago

Sdcrouse commented 4 years ago

In the Access Implicitly-Set Global Object in a Function Expression section of the README, they give us this function:

let contextReturner = function() {
  return this
}

contextReturner() //=> window
contextReturner() === window //=> true

So far, so good. That works in the console. But then the README says this:

When no object is to the left of the function, JavaScript invisibly adds the global object. Thus contextReturner is, from JavaScript's point of view, the same as window.contextReturner. You can check for yourself in the console: window.contextReturner === contextReturner //=> true.

Strangely enough, when I tried this out in the Chrome console, this was the output:

window.contextReturner
undefined

window.contextReturner()
Uncaught TypeError: window.contextReturner is not a function

window.contextReturner === contextReturner;
false

In the Microsoft Edge console, this was the output:

window.contextReturner;
undefined

window.contextReturner()
Object doesn't support property or method 'contextReturner'

window.contextReturner === contextReturner
false

I don't know why this is, though. If the value of this returned by contextReturner is the window object, then why doesn't the console recognize that the contextReturner function was defined on the window object?

One thing that I will also point out is that if you define a similar function without setting it to a variable like this:

function test() {
    return this
}

Then, it behaves as expected in the Chrome console (and similarly in Edge):

test();
Window {parent: Window, opener: null, top: Window, length: 1, frames: Window, …}

window.test()
Window {parent: Window, opener: null, top: Window, length: 1, frames: Window, …}

window.test === test;
true

I encountered a similar issue with the locationReturner function further down in the README.

I'm not entirely sure what's going on here. Somehow, a function only gets defined on the window object if you don't store that function in a variable. It may be that the browser consoles have changed since the last commit was made on this lesson.

Sdcrouse commented 4 years ago

Just to be absolutely clear, the strange thing is that regardless of whether you write this:

let contextReturner = function() {
  return this
}

Or this:

function contextRunner() {
  return this
}

contextRunner() always returns the window object. But window.contextRunner() only works in the latter case.

Sdcrouse commented 4 years ago

I also tried this out in NodeJS. This was the output:

> let contextReturner = function() {
...   return this
... }

> contextReturner()
//=> global

> contextReturner() === global
true
> global.contextReturner
undefined
> global.contextReturner();
Uncaught TypeError: global.contextReturner is not a function

> function test() {
... return this
... }

> test()
//=> global
> global.test()
//=> global

Evidently, NodeJS has been changed since this lesson's last commit as well.