code

JavaScript developer - the most popular interview questions and answers!

javascript interview questions and answers

Interview for a developer position - what does it look like?

Everyone knows that interviews are not always easy. Especially in the IT industry, the requirements for a potential employee are usually strictly defined. Of course, you can avoid the stress associated with it, if you properly prepare yourself. Therefore, I am here to help!

If you have successfully passed the first stage of the interview - the easier one, where you talk about yourself, the conversation revolves around questions such as "why do you want to work with us" etc., the second stage of recruitment is way more specific and demanding.

Most often, the second stage of recruitment is the so-called "technical interview", checking the candidate's knowledge. In this article, I have presented 10 JavaScript recruitment questions (and a bonus!) along with the answers. For each of the questions, I added code examples to make it easier for you to understand and remember the issues - which may turn out to be very useful in a stressful situation, which is undoubtedly an interview. In the end, I also included a few tips that I would like to hear myself while preparing for the first job interviews in a software company.

Top 10 JavaScript interview questions:

javascript interview questions

1. What is var, let, and const and how are they different?

In JavaScript, var, let, and const are the three ways to declare variables.

Before the ES6 standard, there was only one way to declare variables - var.

  • Var is a variable declaration for the entire function, i.e. it has a function scope;

Var allows you to re-declare a variable, i.e. another declaration of the same variable overwrites it.

let language = 'Polish';
language = 'English';
language = 'Spanish';

console.log(language);

The last assigned value, which is 'Spanish', will be displayed in the console.

Var is hoisted, so all variable declarations are moved to the beginning of the function, and this declaration will be assigned the value "undefined".

console.log(quote);

var quote = "Programming isn't about what you know; it's about what you can figure out. - Chris Pine"

By hoisting in the console, instead of a Reference Error see 'undefined'.

  • Let

As already mentioned, the declaration of the let variable was introduced in ES6. The scope of the variable declared by the word let is block scope.

let today = ‘Monday’
{
let today = ‘Wednesday’
}
console.log(today);

The console will return 'Monday' because the let declaration is limited within the scope of the block in which it was defined. If we wanted to see 'Wednesday' in the console, we would have to move console.log (today) higher - to the block where we have this declaration.

A variable declared by let cannot be re-declared. If we changed var to let in the example of the language, you would get an error. To get the same result as with var, we would have to modify the function this way:

let language = 'Polish';
language = 'English';
language = 'Spanish';

console.log(language);

A variable is declared once and then its value is changed.

  • Const

Like let, this variable declaration was introduced in ES6, and like let has block scope. As in the case of let, we cannot declare variables with the same name in the same block.

So what's the difference between let and const? A variable declared with const cannot change its value.

const weather = 'Sunny day'
weather = 'Rainy day'

We get "typeError - invalid assignment"

2. What is hoisting?

The answer to the previous question partially answers this as well, because the phenomenon of hoisting is closely related to the declaration of variables.

The declarations of functions and variables are placed at the beginning of the function, i.e. variable declarations are performed first before the rest of the code. It should be remembered that this is only a variable declaration without assigning a value and the fact that this mechanism occurs only when declaring a variable var.

console.log(color);
var color = ' blue'

In the console, we will see 'undefined'.

3. What are closures?

It is creating one function inside another, where the inner function has access to eigenvariables and parent variables, and if there are global variables, to them as well. The external function cannot access the variables of the internal function. This is best illustrated by an example:

var global = "I’m global"

function parent() {
var parent_variable = "I’m parent"
console.log(global);
console.log(child_variable);

function child() {
var child_variable = "I’m child"
}
child();
}
parent();

The console will first print "I'm global" and then the error "ReferenceError: child_variable is not defined".

Let's modify the code a bit.

var global = "I’m global"

function parent() {
var parent_variable = "I’m parent"

function child() {
var child_variable = "I’m child";
console.log(global);
console.log(parent_variable);
}
child();
}
parent();

This time we won't get an error because the child function has access to both global and parent variables. So in the console, we get "I'm global" and "I'm parent".

4. What is an IIFE (Immediately Invoked Function Expression)?

This is a function that will be executed immediately when it appears in your code. What does this feature look like? This function is wrapped in additional parentheses followed by another pair of parentheses.

(function () {
console.log("Immediately Invoked Function Expression");
})();

(function (name) {
console.log(name);
})("I’m IIFE!");

This is an anonymous function and is not stored in any variable - it will run and will not exist in any further parts of the code.

5. What is the arrow function?

This is the way of declaring a function introduced in ES6. The arrow function captures the value of this at the time it is declared, not the function call. This is the same as using the prototype function Function.prototype.bind. To use the arrow function we use the sign, => which is the so-called thick arrow.

const greeting = (name) => {
return 'Good morning ' + name;
}

6. What is a pure function?

This is a function that must meet these two conditions:

1.It must always return the same result for the same input.

2. It cannot modify external values.

function sum(a,b) {
return a + b;
}

For a better illustration, two examples of impure functions:

let drawer = ['book', 'notebook', 'pen', 'ruler'];

function addItem() {
drawer.push('pencil');
}

This is not a pure function as it modifies an external variable.

Let's stick with the drawer variable and try to get a random item from it.

let drawer = ['book', 'notebook', 'pen', 'ruler'];

function getRandomItem() {
return drawer[Math.floor(Math.random() * drawer.length)]
}

This is not a pure function as the result will not be the same every time.

7. What is the difference between the operator == and ===?

A double equal sign compares values, and a triple equal sign additionally checks for type compatibility.

1 == '1' //true
1 === '1' //false

8. What is the difference between undefined and null?

  • Undefined means that the variable has been declared but not yet assigned a value.
  • Null is the assigned value and means blank.

Null must be assigned to the variable as a value, and undefined is the default value when nothing has been assigned.

9. What is a ternary operator?

It is a conditional operator, often used as a shorthand for if functions.

It consists of three parts separated by a question mark and a colon.

condition ? - what will be returned when the condition is

true: what will be returned otherwise (false)

userType === 'premium' ? 'Welcome to our platform' : 'Content avialable for Premium users'

10. What are falsy values? What falsy values ​​do you know?

Falsy value - a value considered to be false when used in a boolean context.

Examples:

false, null, undefined, 0, NaN, '' (empty string)

We've covered the basics, so now I suggest having some fun.

Bonus! Decipher the secret word.

let mysteryWord = 'TinobraQ';

Perhaps you should read the word from right to left. Let's try!

function solution(str) {
return str.split('').reverse().join('');
}

Let's look at what happens inside the function: split () splits our string into an array containing an ordered list of substrings, that is:

['T','I','n','o','b','r','a','Q']

then reverse the order of the elements in the array with the function:

reverse()
['Q','a','r','b','o','n','I','T']

to get the string again use function:

join()
‘QarbonIT’

A handful of tips at the end

Perhaps when the recruiter sees that you are trying to answer and you are going in the right direction, he will suggest it, drop a keyword that will help you develop your thoughts.

The questions are usually not just about cramming a definition, but about understanding the topic. Often right after the question "what is it?" there is another one that makes use of the issue in practice.

When the question is what the result of a function will be, or when we are asked to write a function, it sometimes happens that at first, we have no idea what to do. In this case, it is good to "think out loud", describe what variables we have, tell what next steps should be taken to get the expected result. Perhaps the recruiter, hearing your idea, will reassure you that you are going in the right direction, or point out that some property could be used, or point out a small thing that we have omitted.

Good luck with the interview! software developer job offers
avatar
Anna Borowska
23/11/2021
ebook