JavaScript, được tạo bởi Brendan Eich vào năm 1995, là một trong những ngôn
ngữ phát triển web được sử dụng rộng rãi nhất. Ban đầu nó được thiết kế để
xây dựng các trang web động. Tập lệnh là một chương trình JS có thể được
thêm vào HTML của bất kỳ trang web nào. Khi trang tải, các tập lệnh này sẽ
tự động thực thi.
Một ngôn ngữ ban đầu được thiết kế để xây dựng các trang web động giờ đây có
thể chạy trên máy chủ và trên hầu hết mọi thiết bị đã cài đặt Công cụ
JavaScript.
Sau HTML và CSS, JavaScript là công nghệ web lớn thứ ba. JavaScript là một
ngôn ngữ kịch bản có thể được sử dụng để xây dựng các ứng dụng trực tuyến và
di động, máy chủ web, trò chơi, v.v. JavaScript là ngôn ngữ lập trình hướng
đối tượng được sử dụng để tạo các trang web và ứng dụng. Nó được tạo ra với
mục đích được sử dụng trong trình duyệt. Thậm chí ngày nay, phiên bản
JavaScript phía máy chủ được gọi là Node.js có thể được sử dụng để tạo ứng
dụng trực tuyến và ứng dụng dành cho thiết bị di động, ứng dụng thời gian
thực, ứng dụng phát trực tuyến và trò chơi điện tử. Các khung Javascript,
thường được gọi là thư viện sẵn có, có thể được sử dụng để xây dựng các
chương trình dành cho máy tính để bàn và thiết bị di động. Các nhà phát
triển có thể tiết kiệm rất nhiều thời gian cho các công việc lập trình đơn
điệu bằng cách sử dụng các thư viện mã này, cho phép họ tập trung vào công
việc phát triển sản xuất.
Những phần trước:
Các bài viết liên quan:
Top những câu hỏi phỏng vấn React thường gặp - Phần 1
Top những câu hỏi phỏng vấn React thường gặp - Phần 2
Top những câu hỏi phỏng vấn React thường gặp - Phần 3
Top những câu hỏi phỏng vấn React thường gặp - Phần 4
Top những câu hỏi phỏng vấn React thường gặp - Phần 5
Top những câu hỏi phỏng vấn React thường gặp - Phần 6
Top những câu hỏi phỏng vấn React thường gặp - Phần 7
1. Explain “this” keyword.
The “this” keyword refers to the object that the function is a property
of.
The value of the “this” keyword will always depend on the object that
is invoking the function.
Confused? Let’s understand the above statements by examples:
function doSomething() {
console.log(this);
}
doSomething();
What do you think the output of the above code will be?
Note - Observe the line where we are invoking the function.
Check the definition again:
The “this” keyword refers to the object that the function is a property
of.
In the above code, the function is a property of which object?
Since the function is invoked in the global context,
the function is a property of the global object.
Therefore, the output of the above code will be the global object.
Since we ran the above code inside the browser, the global object is
the window object.
Example 2:
var obj = {
name: "vivek",
getName: function(){
console.log(this.name);
}
}
obj.getName();
In the above code, at the time of invocation, the getName function is a
property of the object obj , therefore, this keyword will refer to the
object obj, and hence the output will be “vivek”.
Example 3:
var obj = {
name: "vivek",
getName: function(){
console.log(this.name);
}
}
var getName = obj.getName;
var obj2 = {name:"akshay", getName };
obj2.getName();
Can you guess the output here?
The output will be “akshay”.
Although the getName function is declared inside the object obj, at the
time of invocation, getName() is a property of obj2, therefore the “this”
keyword will refer to obj2.
The silly way to understand the “this” keyword is, whenever the function
is invoked, check the object before the dot. The value of this . keyword
will always be the object before the dot.
If there is no object before the dot-like in example1, the value of this
keyword will be the global object.
Example 4:
var obj1 = {
address : "Mumbai,India",
getAddress: function(){
console.log(this.address);
}
}
var getAddress = obj1.getAddress;
var obj2 = {name:"akshay"};
obj2.getAddress();
Can you guess the output?
The output will be an error.
Although in the code above, this keyword refers to the object obj2, obj2
does not have the property “address”‘, hence the getAddress function
throws an error.
2. Explain call(), apply() and, bind() methods.
1. call():
- It’s a predefined method in javascript.
This method invokes a method (function) by specifying the owner
object.
Example 1:
function sayHello(){
return "Hello " + this.name;
}
var obj = {name: "Sandy"};
sayHello.call(obj);
// Returns "Hello Sandy"
call() method allows an object to use the method (function) of another
object.
Example 2:
var person = {
age: 23,
getAge: function(){
return this.age;
}
}
var person2 = {age: 54};
person.getAge.call(person2);
// Returns 54
- call() accepts arguments:
function saySomething(message){
return this.name + " is " + message;
}
var person4 = {name: "John"};
saySomething.call(person4, "awesome");
// Returns "John is awesome"
2. apply()
The apply method is similar to the call() method. The only difference is
that,
call() method takes arguments separately whereas, apply() method takes
arguments as an array.
function saySomething(message){
return this.name + " is " + message;
}
var person4 = {name: "John"};
saySomething.apply(person4, ["awesome"]);
3. bind():
This method returns a new function, where the value of “this” keyword
will be bound to the owner object, which is provided as a parameter.
Example with arguments:
var bikeDetails = {
displayDetails: function(registrationNumber,brandName){
return this.name+ " , "+ "bike details: "+ registrationNumber + " , " + brandName;
}
}
var person1 = {name: "Vivek"};
var detailsOfPerson1 = bikeDetails.displayDetails.bind(person1, "TS0122", "Bullet");
// Binds the displayDetails function to the person1 object
detailsOfPerson1();
//Returns Vivek, bike details: TS0122, Bullet
3. What are some advantages of using External JavaScript?
External JavaScript is the JavaScript Code (script) written in a separate
file with the extension.js, and then we link that file inside the
<head> or <body> element of the HTML file where the code is to
be placed.
Some advantages of external javascript are
It allows web designers and developers to collaborate on HTML and
javascript files.
- We can reuse the code.
- Code readability is simple in external javascript.
4. Explain Scope and Scope Chain in javascript.
Scope in JS determines the accessibility of variables and functions at
various parts of one’s code.
In general terms, the scope will let us know at a given part of code, what
are variables and functions we can or cannot access.
There are three types of scopes in JS:
- Global Scope
- Local or Function Scope
- Block Scope
Global Scope: Variables or functions declared in the global
namespace have global scope, which means all the variables and functions
having global scope can be accessed from anywhere inside the code.
var globalVariable = "Hello world";
function sendMessage(){
return globalVariable; // can access globalVariable since it's written in global space
}
function sendMessage2(){
return sendMessage(); // Can access sendMessage function since it's written in global space
}
sendMessage2(); // Returns “Hello world”
Function Scope: Any variables or functions declared inside a function
have local/function scope, which means that all the variables and functions
declared inside a function, can be accessed from within the function and not
outside of it.
function awesomeFunction(){
var a = 2;
var multiplyBy2 = function(){
console.log(a*2); // Can access variable "a" since a and multiplyBy2 both are written inside the same function
}
}
console.log(a); // Throws reference error since a is written in local scope and cannot be accessed outside
multiplyBy2(); // Throws reference error since multiplyBy2 is written in local scope
Block Scope: Block scope is related to the variables declared using
let and const. Variables declared with var do not have block scope. Block
scope tells us that any variable declared inside a block { }, can be
accessed only inside that block and cannot be accessed outside of it.
{
let x = 45;
}
console.log(x); // Gives reference error since x cannot be accessed outside of the block
for(let i=0; i<2; i++){
// do something
}
console.log(i); // Gives reference error since i cannot be accessed outside of the for loop block
Scope Chain: JavaScript engine also uses Scope to find variables.
Let’s understand that using an example:
var y = 24;
function favFunction(){
var x = 667;
var anotherFavFunction = function(){
console.log(x); // Does not find x inside anotherFavFunction, so looks for variable inside favFunction, outputs 667
}
var yetAnotherFavFunction = function(){
console.log(y); // Does not find y inside yetAnotherFavFunction, so looks for variable inside favFunction and does not find it, so looks for variable in global scope, finds it and outputs 24
}
anotherFavFunction();
yetAnotherFavFunction();
}
favFunction();
As you can see in the code above, if the javascript engine does not
find the variable in local scope, it tries to check for the variable in
the outer scope. If the variable does not exist in the outer scope, it
tries to find the variable in the global scope.
If the variable is not found in the global space as well, a reference
error is thrown.
5. Explain Closures in JavaScript.
Closures are an ability of a function to remember the variables and
functions that are declared in its outer scope.
var Person = function(pName){
var name = pName;
this.getName = function(){
return name;
}
}
var person = new Person("Neelesh");
console.log(person.getName());
Let’s understand closures by example:
function randomFunc(){
var obj1 = {name:"Vivian", age:45};
return function(){
console.log(obj1.name + " is "+ "awesome"); // Has access to obj1 even when the randomFunc function is executed
}
}
var initialiseClosure = randomFunc(); // Returns a function
initialiseClosure();
Let’s understand the code above,
The function randomFunc() gets executed and returns a function when we
assign it to a variable:
var initialiseClosure = randomFunc();
The returned function is then executed when we invoke initialiseClosure:
initialiseClosure();
The line of code above outputs “Vivian is awesome” and this is possible
because of closure.
console.log(obj1.name + " is "+ "awesome");
When the function randomFunc() runs, it seems that the returning function
is using the variable obj1 inside it:
Therefore randomFunc(), instead of destroying the value of obj1 after
execution,
saves the value in the memory for further reference. This is the
reason why the returning function is able to use the variable declared in
the outer scope even after the function is already executed.
This ability of a function to store a variable for further reference
even after it is executed is called Closure.
6. What are object prototypes?
All javascript objects inherit properties from a prototype. For example,
- Date objects inherit properties from the Date prototype
- Math objects inherit properties from the Math prototype
- Array objects inherit properties from the Array prototype.
On top of the chain is Object.prototype. Every prototype inherits
properties and methods from the Object.prototype.
A prototype is a blueprint of an object. The prototype allows us to
use properties and methods on an object even if the properties and
methods do not exist on the current object.
Let’s see prototypes help us use methods and properties:
var arr = [];
arr.push(2);
console.log(arr); // Outputs [2]
In the code above, as one can see, we have not defined any property or
method called push on the array “arr” but the javascript engine does not
throw an error.
The reason is the use of prototypes. As we discussed before, Array objects
inherit properties from the Array prototype.
The javascript engine sees that the method push does not exist on the
current array object and therefore, looks for the method push inside the
Array prototype and it finds the method.
Whenever the property or method is not found on the current object, the
javascript engine will always try to look in its prototype and if it still
does not exist, it looks inside the prototype's prototype and so on.
7. What are callbacks?
A callback is a function that will be executed after another function gets
executed. In javascript, functions are treated as first-class citizens,
they can be used as an argument of another function, can be returned by
another function, and can be used as a property of an object.
Functions that are used as an argument to another function are called
callback functions. Example:
function divideByHalf(sum){
console.log(Math.floor(sum / 2));
}
function multiplyBy2(sum){
console.log(sum * 2);
}
function operationOnSum(num1,num2,operation){
var sum = num1 + num2;
operation(sum);
}
operationOnSum(3, 3, divideByHalf); // Outputs 3
operationOnSum(5, 5, multiplyBy2); // Outputs 20
In the code above, we are performing mathematical operations on the
sum of two numbers. The operationOnSum function takes 3 arguments, the
first number, the second number, and the operation that is to be
performed on their sum (callback).
Both divideByHalf and multiplyBy2 functions are used as callback
functions in the code above.
These callback functions will be executed only after the function
operationOnSum is executed.
Therefore, a callback is a function that will be executed after
another function gets executed.
8. What are the types of errors in javascript?
There are two types of errors in javascript.
Syntax error: Syntax errors are mistakes or spelling problems
in the code that cause the program to not execute at all or to stop
running halfway through. Error messages are usually supplied as well.
Logical error: Reasoning mistakes occur when the syntax is
proper but the logic or program is incorrect. The application executes
without problems in this case. However, the output findings are
inaccurate. These are sometimes more difficult to correct than syntax
issues since these applications do not display error signals for logic
faults.
9. What is recursion in a programming language?
Recursion is a technique to iterate over an operation by having a function
call itself repeatedly until it arrives at a result.
function add(number) {
if (number <= 0) {
return 0;
} else {
return number + add(number - 1);
}
}
add(3) => 3 + add(2)
3 + 2 + add(1)
3 + 2 + 1 + add(0)
3 + 2 + 1 + 0 = 6
Example of a recursive function:
The following function calculates the sum of all the elements in an array
by using recursion:
function computeSum(arr){
if(arr.length === 1){
return arr[0];
}
else{
return arr.pop() + computeSum(arr);
}
}
computeSum([7, 8, 9, 99]); // Returns 123
10. What is the use of a constructor function in javascript?
Constructor functions are used to create objects in javascript.
When do we use constructor functions?
If we want to create multiple objects having similar properties and
methods, constructor functions are used.
Note- The name of a constructor function should always be written in
Pascal Notation: every word should start with a capital letter.
Example:
function Person(name,age,gender){
this.name = name;
this.age = age;
this.gender = gender;
}
var person1 = new Person("Vivek", 76, "male");
console.log(person1);
var person2 = new Person("Courtney", 34, "female");
console.log(person2);
In the code above, we have created a constructor function named Person.
Whenever we want to create a new object of the type Person, We need to
create it using the new keyword:
var person3 = new Person("Lilly", 17, "female");
The above line of code will create a new object of the type Person.
Constructor functions allow us to group similar objects.
Kết thúc
Tất cả những câu hỏi trên đều do mình thu nhặt được ở những nơi mà có
những người có kinh nghiệm truyền lại. Mong là sẽ có ích cho bạn!
Mình sẽ cố gắng tìm thêm những câu hỏi phổ biến hơn nữa và ra tiếp phần 3
cho mọi người nhé!
Chúc các bạn thành công!