{"id":18743,"date":"2022-11-01T20:28:01","date_gmt":"2022-11-01T14:58:01","guid":{"rendered":"https:\/\/jassweb.com\/solved\/solved-javascript-when-and-when-not-to-use-this\/"},"modified":"2022-11-01T20:28:01","modified_gmt":"2022-11-01T14:58:01","slug":"solved-javascript-when-and-when-not-to-use-this","status":"publish","type":"post","link":"https:\/\/jassweb.com\/solved\/solved-javascript-when-and-when-not-to-use-this\/","title":{"rendered":"[Solved] Javascript: When and when not to use “this”"},"content":{"rendered":"

[ad_1]
\n<\/p>\n

\n
\n
<\/div>\n
\n
\n
\n

when it is needed\/best practice to use the keyword this<\/p>\n<\/blockquote>\n

This is usually used when you want to access something in some. So for instance, if you have a custom object and want to use some property inside some method, you should use this<\/code>.<\/p>\n<\/p>\n

\n
\n
function Person(fname, lname){\r\n  this.fname = fname;\r\n  this.lname = lname;\r\n  this.fullName = function(){\r\n    return this.fname + ' ' + this.lname;\r\n  }\r\n}\r\n\r\nvar p = new Person('foo', 'bar');\r\nconsole.log(p.fullName())<\/code><\/pre>\n<\/div>\n<\/div>\n
If you see, in current constructor, I created a function(fullName<\/code>) which needs to access fname<\/code> and lname<\/code> properties of the object it is part of. This is a place this<\/code> must be used.<\/p>\n
\n
\n
Now while declaration, when to use this<\/code>?<\/p>\n<\/blockquote>\n
Any property in a constructor that is a part of this<\/code> will be a part of the object. So if you need something that is only accessible to you but not outside, you can use function<\/code> instead of this<\/code>.<\/p>\n<\/p>\n
\n
\n
function Person(fname, lname){\r\n  var self = this;\r\n  self.fname = fname;\r\n  self.lname = lname;\r\n  \r\n  \/\/ This function is private\r\n  function getFullName() {\r\n    var name=\"\";\r\n    var seperator=\"\";\r\n    if (fname) {\r\n      name += self.fname;\r\n      seperator=\" \";\r\n    }\r\n    if (lname) {\r\n      name += seperator + self.lname;\r\n    }\r\n    return name;\r\n  }\r\n  this.fullName = function(){\r\n    return getFullName();\r\n  }\r\n}\r\n\r\nvar p = new Person('foo', 'bar');\r\nconsole.log(p.fullName())<\/code><\/pre>\n<\/div>\n<\/div>\n
\n
As for your code, I have already explained in comment why it works:<\/p>\n
\n
In non-strict mode, this<\/code> will point to window<\/code> and any declaration not in a function will be a part of global scope.<\/p>\n<\/blockquote>\n
But as rightly pointer by @Jonas W its a bad practice. Why it is bad?<\/p>\n