Javascript

Question 1

What is Node.js

Answer 1

Server-side JavaScript framework allowing programmers to run JavaScript from their terminals

Question 2

What is ECMAScript

Answer 2

Standardized specification for JavaScript, currently on ES6 (ES2015)

Question 3

Explain the difference between an expression and statement

Answer 3

Expressions return a value and need a semicolon. Statements are any line of code and generally don’t require semicolons

Question 4

Two looping keywords

Answer 4

continue - skips the current iteration

break - exits the loop

Question 5

What’s the difference between for loops and forEach

Answer 5

You can’t exit early from a forEach loop. for loops are less descriptive but have different forms

Question 6

Explain a for..in loop

Answer 6

for (key in object) - iterates through enumerable properties of an object (key and values for example). When used with an array/string, the keys are numerical indexes.

Note: not recommended when sequence matters as iteration is in arbitrary order

Question 7

Explain a for..of loop

Answer 7

Utilizes Symbol.iterator.next() from ES6 with a nice wrapper for (variable of iterable) - works for iterable things like Array/Strings but will not work on Objects.

Of note, we can use it with NodeLists (which normally don’t have access to Array iteration methods like foreach)

Question 8

How do switch statements differ in JS

Answer 8

Same setup as Ruby but we need to include a ‘break’ otherwise it’ll keep passing through cases

Question 9

Explain what a callback function is

Answer 9

A callback function is a function that is passed to another function as an argument and is executed after some operation has been completed

Question 10

How does prototype inheritance work in Javascript?

Answer 10

Each object has an internal property called prototype, which links to another object. The prototype object has a prototype object of its own, and so on - this is referred to as the prototype chain.

If you follow an object’s prototype chain, you will eventually reach the core Object prototype whose prototype is null, signalling the end of the chain. When you request a property which the object does not contain, JavaScript will look down the prototype chain until it either finds the requested property, or until it reaches the end of the chain.

This behaviour is what allows us to create “classes”, and implement inheritance.

An example of where the Prototype pattern is useful is the initialization of business objects with values that match the default values in the database. The prototype object holds the default values that are copied over into a newly created business object.

Question 11

Explain what Arrays are in JavaScript

Answer 11

An array is an object that holds values (of any type) not particularly in named properties/keys, but rather in numerically indexed positions

Question 12

What is THIS keyword in JavaScript

Answer 12

In JavaScript this always refers to the ‘owner’ of the function we’re executing, or rather, to the object that a function is a method of

Question 13

What is closure in Javascript

Answer 13

A closure is the combination of a function bundled together (enclosed) with references to its surrounding state (the lexical environment). In other words, a closure gives you access to an outer function’s scope from an inner function. In JavaScript, closures are created every time a function is created, at function creation time.

When the outer function exits, a reference to the inner function is returned so the inner function can be called

The inner function will have access to the variables in the outer function scope, even after the outer function has returned.

The closure has access to variable in three scopes:

• Variable declared in his own scope
• Variable declared in parent function scope
• Variable declared in global namespace

Use cases:

• DATA PRIVACY: data in parent function only available in parent function unless we define “privileged methods” to allow access (this would be the child function returned from the parent function, which has access to that data)
• STATEFUL FUNCTIONS: return values can be influenced by the internal state (recall those functions from Foundations that only run sometimes)
• PARTIAL APPLICATION/CURRYING

Question 14

What is transpiling

Answer 14

A process of transforming and compiling to convert newer code into older code equivalents

Typically you insert the transpiler into your build process, similar to your code linter or your minifier. There are quite a few great transpilers for you to choose from:

Babel: Transpiles ES6+ into ES5
Traceur: Transpiles ES6, ES7, and beyond into ES5

Question 15

Differences between ES5 and ES6

Answer 15

• arrow functions and string interpolation
• the const keyword (can mutate, but cannot reassign)
• block-scoped variables: the new ES6 keyword let allows developers to scope variables at the block level. Let doesn’t hoist in the same way var does.
• the new ES6 keyword let allows developers to scope variables at the block level. Let doesn’t hoist in the same way var does.
• class definition and inheritance: The new ES6 keyword let allows developers to scope variables at the block level. Let doesn’t hoist in the same way var does.
• for-of operator:The for…of statement creates a loop iterating over iterable objects.
• spread operator: for objects merging
• promises: promises provide a mechanism to handle the results and errors from asynchronous operations. You can accomplish the same thing with callbacks, but promises provide improved readability via method chaining and succinct error handling.
• modules “importing” and “exporting”

Question 16

Equality in JS (== vs ===)

Answer 16

• Strict comparison (e.g., ===) checks for value equality without allowing coercion
• Abstract comparison (e.g., ==) checks for value equality with coercion allowed (implicit type conversion)
• If either value (aka side) in a comparison could be the true or false value, avoid == and use ===
• If either value in a comparison could be of these specific values (0, “”, or [] – empty array), avoid == and use ===.

Question 17

What kind of scope do variables have?

Answer 17

Scope of variables depends on where they sit in nested functions. Each function creates a new scope that can only be seen by functions nested further within.

Question 18

What is hoisting?

Answer 18

Variable assignments are not hoisted to the top of the current scope ` let text = 1’

Variable declarations however are hoisted let text

Variable declarations in a function hoisted to the top of the function.

Prevented by creating a local variable set equal to a named function
const baz = function foo(){return x = 1}

Question 19

Function to raise a num to power (of 3 for example)

Answer 19

Math.pow(num, 3);

Question 20

What is the difference between .unshift() and .shift()

Answer 20

.unshift() adds a value to be beginning of an array and returns new length

.shift() removes the first element and returns it

Question 21

How would you check if a number is an integer

Answer 21

See if there is a remainder when dividing by 1

function isInt(num) {
  return num % 1 === 0;
}

console. log(isInt(4)); // true
console. log(isInt(12.2)); // false
console. log(isInt(0.3)); // false

Question 22

What will the following code output?

(function() {
  var a = b = 5;
})();

console.log(b);

Answer 22

5. Even thought it was declared within a function, var a = b and b = 5 but b wasn’t declared anywhere in the function so it’s set equal to 5 in the global scope.

Question 23

Use a closure to create a function for multiply(5)(6);

Answer 23

function multiply(a) {
  return function(b) {
    return a * b;
  }
}

Question 24

What does “use strict” do?

Answer 24

At the top of a JS program of top of a function it shows an error if a global variable is created by mistake.

Question 25

Compare, which might we prefer and why?
save()
  .then(handleSuccess)
  .catch(handleError)
;

and
save().then(
  handleSuccess,
  handleError
);

Answer 25

We would prefer the first because it would catch an error from the .save() and .handleSuccess() functions. In the second example, an error in .save() would be caught but an error from handleSuccess() would be swallowed as there’s nothing there to catch the rejection

Question 26

Explain the time complexity of accessing a value in an array. Does it matter if we know the index or not?

Answer 26

Known index: O(1) constant because we’re only grabbing the one, not continuing to search through the array. Indices are like addresses to these elements in memory. Editing that element at that address is also O(1).

Unknown: Using something like arr.indexOf(‘C’) we get O(n) Linear because in the worst case we’d have to traverse the entire length of the array to find out if the element exists.

Question 27

Explain the time complexity of adding or removing an element at the beginning and end of an array

Answer 27

.push() and .pop() are O(1) Constant because it’s simply adding or removing to the end of the array. That’s one index that’s being affected

.unshift() adding or .shift() removing from the front of an array is O(n) because every other element in the array will have a new index as a result of these operations.

.splice() would depend on where in the array we’re splicing from however in the worst case it would be from the start resulting in O(n) time.

Question 28

List some common array methods that have O(n) time complexity

Answer 28

Array.filter(), Array.map(), Array.find(), Array.findIndex(), Array.reduce(), Array.forEach().

These all go through the array so it’s O(n).

Array.concat() is actually O(n + m) where n is the original and m is the second array. We’re creating a new array and to do so we have to go through the length of both arrays which might not be equal

Question 29

Compare an Array and Set.

Answer 29

Searching in an Array is linear O(n), with some mixed complexities for adding and deleting while methods used in Sets to search, delete and insert items are O(1) so the size of the data has virtually no bearing on run-time.

Arrays are indexed meaning the value is ordered by the index. Sets are a keyed collection, ordering data using keys. They’re iterable in the order of insertion and cannot contain any duplicate data

Question 30

What does use strict at the top of our code accomplish?

Answer 30

Voluntarily enforce stricter parsing and error handling. Code errors that would otherwise have been ignored or would have failed silently will now generate errors or throw exceptions
It will throw a runtime error if we try to use undeclared variables which would stop us from accidentally creating global variables

Question 31

What is the browser event loop?

Answer 31

Checks the event queue and processes pending events.. If an event happens in the background (script onload event) while the browser is busy (processing an onclick), the event gets appended to the queue. When the onclick is complete, the queue is checked and the event is then handled (the onload script)

Question 32

How can we test if something is NaN?

Answer 32

Semi-reliable way is built in isNaN() or in ES6 Number.isNaN().

NaN is typeof ‘number’ and NaN === NaN is false so we’d run into issues trying to test that way.

Question 33

How can we test if something is an integer?

Answer 33

ES6 we’d use Number.isInteger().

Prior we’d use
function isInteger(x) { return (x ^ 0) === x; }
or
function isInteger(x) { return (typeof x === 'number') && (x % 1 === 0); }

Question 34

How would we clone an object?

Answer 34

let obj = {a: 1 ,b: 2}
let objclone = Object.assign({},obj);

NOTE that this will only be a shallow clone!