Interview Questions Flashcards

1
Q

Explain the differences between var, const and let.

A

The weakest signal available in ES6 is var.

‘Let’ signals that a variable might be reassigned, and can be used for example in loops, for counting.

‘Const’ signals that that identifier will not be reassigned.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
2
Q

What is the difference between == and ===?

A

The == operator compares two values, without taking into account their types. === compares the values, but also makes their types into account. So 3==’3’ evaluates to True, but 3===’3’ evaluates to False.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
3
Q

What is the difference between textContent and innerHTML?

A

textContent is a concatenation of the text content of a node and its descendant. It is the fastest of the two.

innerHTML returns the HTML. It parses the text into HTML, which makes it slower.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
4
Q

What is a node?

A

TBD

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
5
Q

What is the DOM?

A

DOM stands for the Documentation Object Models, and it is a World Wide Web Consortium standard.It defines a standard for accessing documents, and it can be used to access and change the content of the HTML.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
6
Q

What are the JavaScript data types?

A

There are seven data types: Boolean, Null, Undefined, Number, String, Symbol, Object. The first six are primitives, meaning data types that aren’t objects and do not have any methods.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
7
Q

What are the pop-up boxes types available in JavaScript?

A

There are 3 pop up boxes: Alert, Confirm and Prompt.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
8
Q

What do the break and the continue statements do?

A

The break statement is used to exit a current loop. On the other hand, the continue statement continues with the next announcement in the loop.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
9
Q

What is negative infinity in JavaScript?

A

The result of a negative number divided by 0.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
10
Q

Give us an example of an object declaration.

A

Var person = {

fullName: ‘Andrew Smith’,

Age: 34,

Email: ‘andrew.smith@gmail.com’

}

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
11
Q

Explain the difference between null, undefined or undeclared variables.

A

Undefined variables have been declared, but no value exists for them. Null is a value of variables, as well as a type of object. Undeclared variables are those declared without the var, const or let keyword.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
12
Q

How do objects, classes, inheritance work in JavaScript?

A

ES6, introduced classes. A class is a type of function, but instead of using the keyword function to initiate it, we use the keyword class, and the properties are assigned (initialized) inside a constructor() method.

class Car {
  constructor(brand) {
    this.carname = brand;
  }
}
An object is an instance of the class.
mycar = new Car("Ford");

Inheritance is a mechanism in which one (child) class/object acquires all the properties and behaviors of another (parent) class/object

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
13
Q

Classical Inheritance vs Prototypal Inheritance?

A

Javascript is not a class-based language. JavaScript works on prototype chain.

Classical inheritance creates a copy of the behavior from parent class/object into the child. And after that parent and child class are separate entity.

Prototypal Inheritance (also called called Behavior Delegation Pattern), In JavaScript, when we create the object it does not copy the properties or behavior, it creates a link. (a prototype chain)

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
14
Q

Syntax keyword for creating instances of subclass?

A

“new”

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
15
Q

What is the syntax to create a method?

A
class Car {
  constructor(brand) {
    this.carname = brand;
  }
  present() {
    return "I have a " + this.carname;
  }
}
mycar = new Car("Ford");
document.getElementById("demo").innerHTML = mycar.present();
How well did you know this?
1
Not at all
2
3
4
5
Perfectly
16
Q

What are static methods?

A

Static methods are defined on the class itself, not the prototype. So you can only call it on the class.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
17
Q

How do you create a class inheritance?

A

To create a class inheritance, use the extends keyword.

A class created with a class inheritance inherits all the methods from another class:

class Car {
  constructor(brand) {
    this.carname = brand;
  }
  present() {
    return 'I have a ' + this.carname;
  }
}
class Model extends Car {
  constructor(brand, mod) {
    super(brand);
    this.model = mod;
  }
  show() {
    return this.present() + ', it is a ' + this.model;
  }
}
How well did you know this?
1
Not at all
2
3
4
5
Perfectly
18
Q

What is hoisting?

A

The default behavior of JavaScript declarations, moving a function declaration to the top. So for declarations, like functions, you will NOT get an error when you try to use it before it is declared.

However class declarations are not hoisted. That means that you must declare a class before you can use it.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
19
Q

What is strict mode?

A

In “strict mode” you will get an error if you use a variable without declaring it:

class Car {
  constructor(brand) {
    i = 0;
    this.carname = brand;
  }
}
var mycar = new Car("Ford");
How well did you know this?
1
Not at all
2
3
4
5
Perfectly
20
Q

What are some Javascript frameworks?

A

React, Angular, Vue, opeFramework, Cinder

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
21
Q

What is WebGL?

A

WebGL: is the Javascript API that allows you to create 3D graphics in the browser.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
22
Q

What is Three.js?

A

Three.js a 3D javascript library: A framework build on top of WebGL which makes it easier to create 3D graphics in the browser, it uses a canvas + WebGL to display the 3D scene.

23
Q

Math.floor()

A

returns the largest number less than or equal to the given number

console.log(Math.floor(5.95));
// expected output: 5
console.log(Math.floor(5.05));
// expected output: 5
console.log(Math.floor(5));
// expected output: 5
console.log(Math.floor(-5.05));
// expected output: -6
24
Q

What is JAMStack?

A

sites and dynamic apps with JavaScript, APIs, and prerendered Markup, served without web servers.

All server-side processes or database actions are abstracted into reusable APIs, accessed over HTTPS with JavaScript.

25
Q

What is Serverless?

A

running your application on a cloud service rather than your own server

communicate with servers with Javascript API’s (url)

26
Q

What is FaaS

A

Functions as a server

27
Q

Which browsers don’t support CSS Grid?

A

IE11 and below

28
Q

JavaScript Map Method for adding +1 to an array [1, 2, 3, 4, 5]?

A

const originalArray = [1, 2, 3, 4, 5];

const newArray = originalArray.map(function addOne(number) {
  return number + 1;
});

console. log(originalArray); // [1, 2, 3, 4, 5]
console. log(newArray); // [2, 3, 4, 5, 6]

29
Q

JavaScript For Loop for adding +1 to an array [1, 2, 3, 4, 5]?

A

const originalArray = [1, 2, 3, 4, 5];

const newArray = [];
for (let i = 0; i < originalArray.length; i++) {
  newArray[i] = originalArray[i] + 1;
}

console. log(originalArray); // [1, 2, 3, 4, 5]
console. log(newArray); // [2, 3, 4, 5, 6]

30
Q

JavaScript Map Method with Arrow function for adding +1 to an array [1, 2, 3, 4, 5]?

A

const originalArray = [1, 2, 3, 4, 5];

const newArray = originalArray.map(number => number + 1);

console. log(originalArray); // [1, 2, 3, 4, 5]
console. log(newArray); // [2, 3, 4, 5, 6]

31
Q

JavaScript Map Method with Arrow function for adding +1 to an array [1, 2, 3, 4, 5]?

A

const originalArray = [1, 2, 3, 4, 5];

const newArray = originalArray.map(number => number + 1);

console. log(originalArray); // [1, 2, 3, 4, 5]
console. log(newArray); // [2, 3, 4, 5, 6]

32
Q

In JS, diff between .map and .forEach?

A

forEach doesn’t return anything. In the case of map, the return value of the callback function is used as the transformed value in our new array.

33
Q

What is jQuery?

A

jQuery is a fast and concise JavaScript Library that simplifies HTML document traversing, event handling, animating, and Ajax interactions for rapid web development.

jQuery is not a programming language instead it is a cross-platform JavaScript library.

Lets you write JavaScript quicker and easier.

Browser compatibility – you can write code which runs across browsers without having to know the various browser intricacies and won’t break.

34
Q

What is your CSS Processing tool of choice?

A

Sass

35
Q

Which CSS framework do you use most frequently on your projects?

A

Bootstrap

36
Q

BEM naming convention?

A
Block = .stick-man
Element = .stickman_ _head
Modifier = .stickman--blue
37
Q

What are js- class names for css?

A

use a js-* class name to denote a relationship with the DOM element in question.

<div></div>

38
Q

What is CSS Lint?

A

a tool to help point out problems with your CSS code. It does basic syntax checking as well as applying a set of rules to the code that look for problematic patterns or signs of inefficiency.

39
Q

What is webpack?

A

A module bundler

40
Q

What is AJAX?

A

With Ajax, web applications can send and retrieve data from a server asynchronously without interfering with the display and behavior of the existing page.

41
Q

What are the 5 most common web browsers?

A
Chrome
Safari
Internet Explorer (Note: not Edge, referring to IE 9 to IE 11)
Firefox
Edge
42
Q

What are WebViews?

A

Webviews web pages embedded in a native application running on a device (e.g., iOS, android, windows).

43
Q

What is a web based platform?

A

any platform that enables you to deliver content, services and applications over the HTTP protocol

44
Q

What is SEO?

A

Search Engine Optimization

45
Q

7 steps to successful SEO?

A

Crawl accessibility so engines can read your website

Compelling content that answers the searcher’s query

Keyword optimized to attract searchers & engines

Great user experience including a fast load speed and compelling UX

Share-worthy content that earns links, citations, and amplification

Title, URL, & description to draw high CTR in the rankings

Snippet/schema markup to stand out in SERPs

46
Q

Max columns in CSS Grid?

A

12

47
Q

What is HTTP?

A

Hypertext Transfer Protocol. defines a language for clients and servers to speak to each other

A client sends a HTTP request to a server, and the server responds with content/data/webpage

48
Q

Two most common package managers?

A

npm

yarn

49
Q

What is DNS?

A

Domain Name Servers are like an address book for websites. When you type a web address in your browser, the browser looks at the DNS to find the website’s real address before it can retrieve the website.

50
Q

HTML?

A

Hypertext Markup Language (HTML) is the code that you use to structure your web content and give it meaning and purpose.

51
Q

HTML head vs body

A

The HTML head is the contents of the element — unlike the contents of the element (which are displayed on the page when loaded in a browser), the head’s content is not displayed on the page. Instead, the head’s job is to contain metadata about the document.

52
Q

What is ES6?

A

ES6 is next gen JavaScript syntax and nothing else. There are also some added features in the ES6 version of JavaScript such as arrow functions , rest and spread operator, destructuring , promises etc.

53
Q

Px vs rem vs em for font sizes?

A

pixel values overrides browser default settings

rem sets the font relative to the root/html document

em set the font relative to the parent element

54
Q

relative vs absolute vs fixed

A

Relative - the element is positioned relative to its normal position.

Absolute - the element is positioned absolutely to its first positioned parent.

Fixed - the element is positioned related to the browser window.

Sticky - the element is positioned based on the user’s scroll position.