1

I was going through this code, and on this line I saw

(window).user = user;

I am wondering what is the importance of setting the user object as a value in the window object? I understand it may be for easier access in the future, but the user object is also stored in an observable and the get user() method retrieves it from the observable:

getUser(): Observable<any> {
    return this.$userSource.asObservable();
}

Also from this answer I understand that:

In JavaScript, any global variable is actually a property of the window object. Using one is equivalent to (and interchangeable with) using the other.

So my questions are:

  1. What is the importance of setting the user object as a value in the window object?
  2. Will the code still function well if we got rid of the line storing the code in the window object?
  3. Are the global variables in typescript classes the same as the property of the window object? For example: Is this value also a property of the window object?
YulePale
  • 6,688
  • 16
  • 46
  • 95

2 Answers2

3

There are few problems about using variables on global.

  1. window is global.

Here is an example why this is dangerous.

window.item = {
    name: 'Something great'
};
function selectItem() { //wrong line
    item.name = 'selected';
}
selectItem(event.target);

As you can see the developer forgot to add the argument item for the function selectItem. Expected to change the name of the clicked item, but the item which is global will be changed.

  1. this = window, this is equal to window if you are not using strict mode.

Let's go with the same example but we will be using context this time.

function selectItem() {
     this.name = 'selected'
}
const item = {
     name: 'An item'
}
selectItem.call(item); //Assume that item is somehow undefined or null.

Same result again, window.name will be changed.

  1. global is for global, encapsulate it.

I can easily access the window and its variables. I can also define the same variable you did. Or I may access to your variables and that will be a security issue.

  1. Testing

You can't test something which has a variable on global easily. Because it is not encapsulated to your scope.

  1. On the global scope, there is no garbage collection. I guess the danger is clear enough.

To answer your questions:

  1. Read above
  2. Read above
  3. That line has a public property. It is not global. It is not defined on window. It will be a property of the instance.
Ahmet Can Güven
  • 5,392
  • 4
  • 38
  • 59
1

window object is global.

This means that if you write

window.user = null

You have erased the previous value set by the library.

It is usually considered a bad practice to store variables into the window object.

To answer you :

  1. Not important at all, even discouraged
  2. You'll have to check the library for that
  3. No they're not : there's no "global class variable". It's either a global variable or a class member. But global variables can be made in Typescript too.
  • about the last answer.. I was asking if the global variables made in typescript are the same as window properties because according to this answer it seems so. https://stackoverflow.com/questions/12393303/storing-a-variable-in-the-javascript-window-object-is-a-proper-way-to-use-that – YulePale Dec 19 '18 at 12:21
  • If it is(question 1) not important why is it done in the code cited? and for question 2 which library are you talking about? @trichetriche – YulePale Dec 19 '18 at 12:26
  • 1
    Your words are literally `Are the global variables in typescript classes the same as the property of the window object` : I'm telling you that global class variables don't exist. To create a typescript global variable, write them outside of a class, and then [they become members of the window object](http://www.typescriptlang.org/play/#src=enum%20Test%20%7B%0D%0A%20%20%20%20value1%20%3D%20'value1'%2C%0D%0A%20%20%20%20value2%20%3D%20'value2'%2C%0D%0A%20%20%20%20value3%20%3D%20'value3'%2C%0D%0A%7D%0D%0A%0D%0Avar%20x%20%3D%201%3B%0D%0A%0D%0Aconsole.log(window.x)%3B) –  Dec 19 '18 at 12:26
  • 1
    @YulePale they used a bad practice. Just because it's a widely used library (or not, I don't know it), doesn't mean it's always good practices. And I'm talking about the same library, see if they call `window.user` somewhere. If they do, because you remove the value from the window object, you will break their library. –  Dec 19 '18 at 12:28
  • I understand the answers 1 and 2 clearly. Thank you. But I still have an issue with three. Just one question is this a global value: https://github.com/linnovate/mean/blob/master/src/app/auth/auth.service.ts#L10. If mot what is it called? Thank you for being patient with me... – YulePale Dec 19 '18 at 12:32
  • 1
    No problem, I'm here for that. You mean if the class itself is a global value ? Yes, [as you can see](http://www.typescriptlang.org/play/#src=class%20MyClass%20%7B%0D%0A%20%20%20%20name%20%3D%20'My%20class'%3B%0D%0A%7D%0D%0A%0D%0Aconsole.log(window.MyClass)%3B). But that's wanted, otherwise you couldn't create class instances ! –  Dec 19 '18 at 12:37
  • not the class but the variables declared within the class. I read that Variables declared within the class not within any methods are member variables also known as global variables. And if so then are this global values the same as window properties? – YulePale Dec 19 '18 at 12:42
  • 1
    No, class members aren't global. They're bound to the class instance, and you can't access them unless you use the class instance itself. Maybe you understood wrong, or the guy that told you that meant that they're global in the class or something. So now, class members aren't part of the window object. –  Dec 19 '18 at 12:44
  • The last comment cleared the air for me.., thank you very much. I think the docs I read meant that they're global in the class. Cheers. – YulePale Dec 19 '18 at 12:46