Objects and Functions Flashcards
What are the 3 things an Object can have attached to it?
Objects have properties and methods and properties can be either a primitive value or another object.
What is a namespace?
A container for variables and functions. Typically to keep variables and functions with the same name separate. Javascript does not have namespaces due to the nature of objects.
What is faking a namespace and what is it used for?
Other languages have namespaces, which basically define a space for sets of variables and functions. JS does not have this so we can fake a namespace by setting up an object to perform the same function as a namespace. This is done in both cases to prevent variables and functions with the same from overriding each other. See below.
What will this code output and why?
Since dot operators are still operators they also must obey the rules of associativity, which is left-to-right.
So, first it would look for english.greetings and wouldn’t find anything. So, english.greetings is undefined and so it wouldn’t be able to find greet because it would be looking for undefined.greet then.
This is why these can’t be created on the fly. It must be set by declaring english.greetings = {}; or just by initializing english like this:
var english = { greetings: { greet: ‘Hello!’ } };
How is JSON different than Object literal syntax?
JSON is technically a subset of the Object syntax, but has stricter rules. It is technically not a part of JS, but JS does come with some built-in functionality to work back and forth with it, like JSON.stringify or JSON.parse
In JSON all properties have to be wrapped in quotes, which is also valid for Object literal syntax in JS, but not required in JS. So, anything that is JSON valid is going to be valid in JS Object literal syntax, but not everything that is valid Object literal syntax is valid JSON.
JSON was created as a replacement for XML, which was the initial method for sending information across the internet.
How do you convert a JS object to JSON?
JSON.stringify will convert a JS Object to a JSON string. In the image below, line 6 results in line 8.
How do you convert a JSON object into a JS object?
JSON.parse will convert a JSON object into a JS object.
What is a function?
A function is actually just an object, but it’s a special object. So, in addition to the properties and methods that a normal object can have, it also has name and code values attached to it. Importantly, the code value is invokable.
What are first class functions?
First class functions can do everything you can do with other types (strings, objects, numbers, etc.) - assign them to variables, pass them around or create them on the fly. JS isn’t the only language that has first class functions, btw.
First class functions change the way you can program and open up completely different approaches.
What’s the difference between a statement and an expression?
A statement just does work but an expression returns value.
An if statement, for example, does not return anything. The expression placed inside of it for evaluation does return a value, but the if statement just does work and doesn’t return anything.
You can’t set a statement as a variable like var a = if( b > c){…};
What’s an anonymous function?
A function that doesn’t have a name. Example below:
function (){
console.log(‘hi’);
}
What will this code output and why?
greet is a function(function statement) and so it is hoisted in its entirety and is available for invocation during the execution phase. But, anonymousGreet is set to a variable(function expression), which is only set to undefined in memory and so cannot be invoked during execution phase since we’re invoking it before we’ve defined the function below it in the code.
What does this code return?
8
What does this code return?
3
What does this code return?
3
What does this code return?
[Type Error: bar is not a function]
How is a function statement different from a function expression?
The main difference between a function expression and a function statement is the function name, which can be omitted in function expressions to create anonymous functions. A function expression can be used as a IIFE (Immediately Invoked Function Expression) which runs as soon as it is defined.
What will this code output and why?
This happens because primitive values are stored by variables by value. So, each time a reference is made to a value, it is a new reference or a copy. Changing the initial value will not affect other references because they are separate copies - it would be like making a copy of a document and then making edits to the first one: the second copy remains intact without the edits.
How does a variable store primitive values(bool, number, string, etc) in memory?
Variables store primitive values by value, which means that each variable points to its own copy of the value. So, if a variable is set equal to another variable or passed to a function, it will then be pointing to a new copy of that primitive value. These copies are not linked to the original value, so if one changes it does not affect the other value.
How do variables store objects(including functions) in memory?
All objects are stored by reference. This means that if one variable is set equal to another, they are both pointing to the same place in memory, the same exact object.
What will this code output?
You see the same result for both logs because they’re both pointing to the same place in memory. The mutation on line 16 is changing the value which is pointed to by both variables - it wouldn’t matter if d was mutated instead of c.
If var c is assigned to an object { greeting = ‘Hola’ } and var d is set equal to c. What will the result of this code be?
c = { greeting: ‘howdy’ };
console. log(c);
console. log(d);
The result would be two different logs. The reason for this is that even though initially both variables were pointing to the same object in memory by reference, the assignment operator recognized that { greeting: ‘Howdy’} did not exist in memory yet and so was assigning new memory space for this. It checks the value before creating the reference - if the value exists it will simply refer to the pre-existing value, if it doesn’t exist then it will set up the memory space for the new location for the new value.
What will this code output?
The this keyword still points to the global object if you’re simply invoking the function.
What will this code output and why?
Even though the setname function expression sits inside of the c object, its this keyword actually belongs to the Window object. It would seem that it should point to c considering the this keyword of the log method, which setname is inside of, points to c.
Many people consider this a bug of JS, but it just is the way JS works.
What will be logged if c.log() is called using the following code?
Since we’ve set self to this, which is referring to the c object, the log should return the info related to the c object - including the mutated name variable.
Setting a variable to this gets around the problem caused by the this keyword of nested methods referring to the global object. Since objects are stored by reference, we know that we can use the self variable and know that it’s referring to c.
What will this code output and why?
You can actually invoke functions stored in an array just by accessing them from the array and even pass them parameters.
What will this code output and why?
It will return undefined for all three logs. In other languages this might return an error, but in JS these variables are hoisted, given memory space and set to undefined, so we can access them even if no arguments are passed in.
What will this output and why?
It will return undefined.
This happens because of automatic semicolon insertion. Because there is a carriage return after return, no semi-colon or other further characters, the JS engine automatically inserts a semicolon for us.
This can be avoided by making sure you don’t simply press return after a return, keep the object name or bracket on the same line as the return statement.
What are closures and how do they work?
Closures are a feature of the JS programming language that ensure any function contained in another function maintain connection, or scope, to its parents’ variables even if its execution context is no longer active.
What will this code output and why?
They all return 3. There’s two important things to note.
- Each function pushed to arr is the same. They’re just objects and not being executed at this point - the value of i still hasn’t been passed in.
- The for loop finishes when i becomes 3 - that’s why it doesn’t run again.
When fs[0], fs[1] and fs[2] are invoked each gets an execution context that looks for i. Because of closure, i=3 is still available to these functions because it was in its parents variable environment, which persists even after buildFunctions execution context is popped off.
What would this code output and why?
It would return 0, 1, 2.
Because we’re using let , the increasing value of i is being saved to a new version of j each loop. let is scoped to the for block, rather than to the whole function object, so every time it’s run it’s pointing to a new value in memory.
It will return 0, 1, 2
- Each push is pushing in the result of executing function(j) - the result is the function containing the console log that hasn’t run yet.
- When fs[0] is then executed and it looks for j, it only needs to go out to the execution context of its parent, not all the way out the for loop. j has stored the value of i at the moment it was executed in the loop.
Step through how the code below would be executed by the JS engine line by line via the execution stack to explain how closure allows these functions to execute successfully.
- It starts with the Global Execution Context, which has the greetEnglish and greetSpanish expressions and their parent, the makeGreeting function.
- Then it hits greetEnglish declaration, so it sets up an execution context for its value, makeGreeting(). Now greetEnglish is that returned function and can be invoked as such. makeGreeting context is then popped off the stack, but the memory space for that makeGreeting execution context, including its language parameter, en, is still hanging around.
- When it hits the greetSpanish declaration, it repeats the process of step 2 again. However, even though it’s evaluating the same function, makeGreeting, for a second time, it’s creating a totally new execution context and memory space. So, greetEnglish and greetSpanish store the same function, but create their own contexts and spaces.
- Lastly, greetEnglish and greetSpanish are invoked and for each one an execution context is made. The JS engine knows in each case which of the two makeGreeting execution contexts it was created in. So, each then has access to their respective language parameter and can execute accordingly.
What does this code output and why?
Because logPersonName has passed person into its bind method, it is now able to use this to access that person object AND the arguments passed to its own logName function.
What does this code output and why?
It will return 8. This practice is called function currying.
What’s happening here is that bind creates a copy of the multiply function and then is passing 2 in as the permanent value for a. It’s equivalent to declaring a=2; on line 44, inside multiply.
