Front End

Question 1

Name 3 ways to decrease page load speed

Answer 1

1. Reduce Image Size, 2. Minify and combine files, 3. Minimize HTTP requests

Question 2

What does Doctype do?

Answer 2

Informs the browser of the type and version of HTML

Question 3

What are data- attributes good for?

Answer 3

The data attribute allows us to store extra information on HTML elements eg the position of an element

Question 4

What is Javascript?

Answer 4

A client side and server side scripting language understood by web browsers

Question 5

Why would you use a srcset attribute in an image tag

Answer 5

To select which image source to used based on criteria such as page width or pixel density

Question 6

What is CSS selector specificity and how does it work?

Answer 6

Specificity is the means by which browsers decide which css rules to apply. Type < Class < Id

Question 7

Can you explain the difference between px, em and rem as they relate to font sizing

Answer 7

Px are pixels as on the screen, em is relative to the font size of the element, Rem is relative to the font size of the element

Question 8

Provide a use case for a pseudo class

Answer 8

:hover, :focus, to change styling on hover or focus

Question 9

Explain Event Delegation

Answer 9

Using event.target so that if we have a lot of elements handled in the same way we can put a single event handler on a shared ancestor

Question 10

Explain how this works in javascript

Answer 10

Refers to the context where it is revoked

Question 11

Explain how prototypal inheritance works

Answer 11

prototypical inheritance refers to the ability to access object properties from another object. We use a JavaScript prototype to add new properties and methods to an existing object constructor.

Question 12

Whats the difference between a variable that is null, undefined or undeclared?

Answer 12

null is a defined value, undefined means the variable had been declared and not given a value, undeclared means the variable has not been declared and will throw an error

Question 13

What is a closure

Answer 13

A function enclosed within another function thats revoked immediately within the function

Question 14

What language constructions do you use for iterating over object properties and array items?

Answer 14

While, for, do while, for in, for of

Question 15

Difference between forEach and .map

Answer 15

Map returns the altered array while foreach returns undefined, you can chain methods onto map

Question 16

What is a javascript method?

Answer 16

Actions that can be performed on objects

Question 17

What are the JS data types

Answer 17

String, number, boolean, object, undefined

Question 18

What’s the difference between var, let and const

Answer 18

Var declarations are globally scoped or function scoped while let and const are block scoped, bock scoped is typically wherever you see curly brackets {if, loops etc}. Var can be updated and redeclared, let can be updated but not redeclared, const variables can be neither updated or redeclared.

Question 19

Explain Hoisting

Answer 19

In Javascript, a variable can be used before it’s been declared

Question 20

Whats the difference between an attribute and a property?

Answer 20

Attributes are defined by HTMLand are constant. Properties are defined by Javascript and are variable

Question 21

What is the difference betwen “==” and “===”

Answer 21

== checks equality without taking type into account, === takes type into account

Question 22

Explain the difference between synchronous and asynchronous functions

Answer 22

Synchronous code is executed in sequence – each statement waits for the previous statement to finish before executing. Asynchronous code doesn’t have to wait – your program can continue to run.

Question 23

Can you offer a use case for the new arrow => function syntax? How does this new syntax differ from other functions?

Answer 23

An arrow function doesnt define its own this value, a regular functions this value is dependent on how it is invoked

Question 24

What is the definition of a higher-order function?

Answer 24

A function that accepts or returns another function

Question 25

What is spread syntax

Answer 25

Allows an iterable such as an array or object to be expanded
const numbers = [1, 2, 3];

console.log(sum(…numbers));

Question 26

What is a promise, how would you use one?

Answer 26

A promise represents the eventual completion or failure of an asynchronous behaviour. If fulfilled a then method can be called and if not fulfilled a catch method can be called.

let myPromise = new Promise(function(myResolve, myReject) {
// asynchronous request

myResolve(); // when successful
myReject(); // when error
});

Question 27

What is the difference between a while and a do-while loop?

Answer 27

A while loop checks the condition before an iteration of the loop, do while checks the condition at the end of an iteration

Question 28

Define an object

Answer 28

A data structure consisting of key value pairs and methods

Question 29

Define the DOM

Answer 29

The document object model is a cross-platform interface that treats HTML document as a tree structure where each node is an object representing part of the document

Question 30

What is HTML?

Answer 30

Standard markup language for web browsers

Question 31

What is CSS?

Answer 31

CSS is a style sheet language for describing the presentation of a document written in a markup language