JavaScript Interview Questions

The encodeURI() function is used to encode complete URI which has special characters except (, / ? : @ & = + $ #) characters.

var uri = "https://mozilla.org/?x=шеллы";
var encoded = encodeURI(uri);
console.log(encoded); // https://mozilla.org/?x=%D1%88%D0%B5%D0%BB%D0%BB%D1%8B

The decodeURI() function is used to decode a Uniform Resource Identifier (URI) previously created by encodeURI().

var uri = "https://mozilla.org/?x=шеллы";
var encoded = encodeURI(uri);
console.log(encoded); // https://mozilla.org/?x=%D1%88%D0%B5%D0%BB%D0%BB%D1%8B
try {
console.log(decodeURI(encoded)); // "https://mozilla.org/?x=шеллы"
} catch (e) {
// catches a malformed URI
console.error(e);
}

The window object provides a print() method which is used to print the contents of the current window. It opens a Print dialog box which lets you choose between various printing options. Let's see the usage of print method in an example,

<input type="button" value="Print" onclick="window.print()" />

Note: In most browsers, it will block while the print dialog is open.

The uneval function returns the source of a given object; whereas the eval function does the opposite, by evaluating that source code in a different memory area. Let's see an example to clarify the difference,

var msg = uneval(function greeting() {
return "Hello, Good morning";
});
var greeting = eval(msg);
greeting(); // returns "Hello, Good morning"

An anonymous function is a function without a name! Anonymous functions are commonly assigned to a variable name or used as a callback function. The syntax would be as below,

function (optionalParameters) {
//do something
}

const myFunction = function(){ //Anonymous function assigned to a variable
//do something
};

[1, 2, 3].map(function(element){ //Anonymous function used as a callback function
//do something
});

Let's see the above anonymous function in an example,

var x = function (a, b) {
return a * b;
};
var z = x(5, 10);
console.log(z); // 50

A local variable takes precedence over a global variable with the same name. Let's see this behavior in an example.

var msg = "Good morning";
function greeting() {
msg = "Good Evening";
console.log(msg); // Good Evening
}
greeting();

ECMAScript 5 introduced javascript object accessors or computed properties through getters and setters. Getters uses the get keyword whereas Setters uses the set keyword.

var user = {
firstName: "John",
lastName: "Abraham",
language: "en",
get lang() {
return this.language;
},
set lang(lang) {
this.language = lang;
},
};
console.log(user.lang); // getter access lang as en
user.lang = "fr";
console.log(user.lang); // setter used to set lang as fr

The Object.defineProperty() static method is used to define a new property directly on an object, or modify an existing property on an object, and returns the object. Let's see an example to know how to define property,

const newObject = {};

Object.defineProperty(newObject, "newProperty", {
value: 100,
writable: false,
});

console.log(newObject.newProperty); // 100

newObject.newProperty = 200; // It throws an error in strict mode due to writable setting

Both have similar results unless you use classes. If you use get the property will be defined on the prototype of the object whereas using Object.defineProperty() the property will be defined on the instance it is applied to.

Below are the list of benefits of Getters and Setters,

1. They provide simpler syntax
2. They are used for defining computed properties, or accessors in JS.
3. Useful to provide equivalence relation between properties and methods
4. They can provide better data quality
5. Useful for doing things behind the scenes with the encapsulated logic.

Yes, You can use the Object.defineProperty() method to add Getters and Setters. For example, the below counter object uses increment, decrement, add and subtract properties,

var obj = { counter: 0 };

// Define getters
Object.defineProperty(obj, "increment", {
get: function () {
this.counter++;
return this.counter;
},
});
Object.defineProperty(obj, "decrement", {
get: function () {
this.counter--;
return this.counter;
},
});

// Define setters
Object.defineProperty(obj, "add", {
set: function (value) {
this.counter += value;
},
});
Object.defineProperty(obj, "subtract", {
set: function (value) {
this.counter -= value;
},
});

obj.add = 10;
obj.subtract = 5;
console.log(obj.increment); //6
console.log(obj.decrement); //5

The switch case statement in JavaScript is used for decision making purposes. In a few cases, using the switch case statement is going to be more convenient than if-else statements. The syntax would be as below,

switch (expression)
{
case value1:
statement1;
break;
case value2:
statement2;
break;
.
.
case valueN:
statementN;
break;
default:
statementDefault;
}

The above multi-way branch statement provides an easy way to dispatch execution to different parts of code based on the value of the expression.

Below are the list of conventions should be taken care,

1. The expression can be of type either number or string.
2. Duplicate values are not allowed for the expression.
3. The default statement is optional. If the expression passed to switch does not match with any case value then the statement within default case will be executed.
4. The break statement is used inside the switch to terminate a statement sequence.
5. The break statement is optional. But if it is omitted, the execution will continue on into the next case.

A primitive data type is data that has a primitive value (which has no properties or methods). There are 7 types of primitive data types.

1. string
2. number
3. boolean
4. null
5. undefined
6. bigint
7. symbol

There are 3 possible ways for accessing the property of an object.

1. Dot notation: It uses dot for accessing the properties

objectName.property;

2. Square brackets notation: It uses square brackets for property access

objectName["property"];

3. Expression notation: It uses expression in the square brackets

objectName[expression];