Last active
August 29, 2015 14:24
-
-
Save bdfinlayson/27d9e15e82e978a83b3b to your computer and use it in GitHub Desktop.
Follow Up Answers: Javascript Closure, Stateless HTTP Protocol, and Hoisting
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| // QUESTION: What is a closure in Javascript? | |
| // ANSWER: Javascript closures are inner functions | |
| // that refer to variables in their outer function | |
| // EXAMPLE: | |
| function whatNum () { | |
| var outerNum = 10; | |
| console.log('I am the outer function and I returned ' + outerNum) | |
| function sayNum () { | |
| console.log('I am the inner function and I returned ' + outerNum + ' because I can see my outer scope'); | |
| } | |
| return sayNum (); | |
| } | |
| console.log(whatNum()); // outputs the value of outerNum in both the outer and inner functions, which is 10 | |
| // Closures can also remember changes made to a variable's value in the closure's outer function. | |
| // This functionality will override the variable's initial value (in this case, 'Bryan'). | |
| // But this functionality lets you retrieve the new value of the variable. | |
| // You can do this after it has been changed (in this case, it's changed to 'John'). | |
| // EXAMPLE: | |
| function whatIsMyName() { | |
| var myName = 'Bryan'; | |
| return { | |
| getName: function() { | |
| return myName; | |
| }, | |
| setName: function(newName) { | |
| myName = newName; | |
| } | |
| } | |
| } | |
| var whatName = whatIsMyName(); | |
| console.log('This is my old name ' + whatName.getName()) // myName at this point is Bryan | |
| whatName.setName('John') | |
| console.log('And this is my new name ' + whatName.getName() + ' and it reflects the earlier change I made to my outer variable.') // myName at this point is John | |
| // QUESTION: What does stateless HTTP protocol mean? What are cookies? | |
| // ANSWER: I wasn't sure what was meant by 'stateless' in this context, so I wanted to look it up after the interview. | |
| // According to this StackOverflow article (http://stackoverflow.com/questions/13200152/why-say-that-http-is-a-stateless-protocol), | |
| // 'stateless' refers to the fact that a server does not hold the 'state' of a user. Rather, servers require certain information, | |
| // such as a user's cookie, before fulfilling a request, such as GET or POST. In this context, a server might store a session cookie's | |
| // key for that user, and destroy it when the user logs out. About this last point, I got exposure to creating cookies | |
| // for authentication purposes while doing Hartl Rails Tutorial Ed 2. A link to the repo on Github is here: | |
| // https://github.com/bdfinlayson/Hartl_Rails_Tutorial_Microblog_App | |
| // QUESTION: Give an example of hoisting in Javascript | |
| // ANSWER: I could have explained this a bit better by discussing the role of scope. When I have a method in the global scope, such as: | |
| var dayOfWeek = 'Tuesday' | |
| // I can access it within a function, like so: | |
| function whatDayIsIt1 () { | |
| console.log(dayOfWeek) | |
| } | |
| whatDayIsIt1() // outputs 'Tuesday' | |
| // But if I redefine the variable at the bottom of the function, it will hoist the variable declaration to the top of the function's scope | |
| // this leaves our console.log to output a value of 'undefined', as shown below: | |
| function whatDayIsIt2 () { | |
| // the output is undefined because dayOfWeek is hoisted and implicitly declared at the top of the function as an undefined variable | |
| console.log(dayOfWeek) | |
| var dayOfWeek = 'Wednesday' | |
| } | |
| whatDayIsIt2() // outputs 'undefined' | |
| // This unusual behavior is why it is always good to define your variables at the top of your functions: | |
| function whatDayIsIt3 () { | |
| var dayOfWeek = 'Wednesday' | |
| console.log(dayOfWeek) | |
| } | |
| whatDayIsIt3() // outputs 'Wednesday' | |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment