5 classic front-end interview questions

JavaScript developers are always in high demand in the IT world. If you are very proficient in the language of God, you will have many opportunities to change jobs and increase your salary. But before a company can hire you, you must successfully pass an interview and prove your skills. In this article, I will show you 5 front-end related questions to test the candidates’ JavaScript skills and their problem-solving abilities. It's going to be a lot of fun!

Question1: ScopeScope

Consider the following code:

(function() {

var a = b = 5;

})();

console.log(b);

What will be printed on the console?

Answer

The above code will print 5.

The trick to this problem is that there are two variable declarations here, but a is declared using the keyword var. Indicates that it is a local variable of a function. In contrast, b becomes a global variable.

Another trick to this problem is that it does not use strict mode ('use strict';) . If strict mode is enabled, the code will raise a ReferenceError error: B is not defined (b is not defined). Remember that strict mode requires explicit specification in order to implement global variable declarations. For example, you should write:

(function() {

'use strict';

var a = window.b = 5;

})();

console.log(b);

Question2: Create a "native" (native) method

define a repeatify for a string object Function . When passed an integer n, it returns the result of repeating the string n times. For example:

console.log('hello'.repeatify(3));

should print hellohellohello.

Answer

A possible implementation looks like this:

String.prototype.repeatify = String.prototype.repeatify || function(times) {

var str = '';

for (var i = 0; i

str += this;

}

return str;

};

Now The questions test developers’ knowledge about JavaScriptinheritance and prototype. This also verifies that the developer knows how to extend built-in objects (even though this should not be done).

Another important point here is that you need to know how not to override functions that may already be defined. Test if the function definition does not exist before:

String.prototype.repeatify = String.prototype.repeatify || function(times) {/* code here */};

When you are asked to do This technique is especially useful when good JavaScript functions are compatible.

Question3: Statement Hoisting (Hoisting)

Execute this code and what will be the output? OnFunction test () {

console.log (a);

console.log (foo ());

var a = 1;

function foo () {

Return 2;

}

}

test();

Answer

The result of this code is

undefined

and 2. The reason is that the declarations of variables and functions are brought forward (moved to the top of the function), but the variables are not assigned any value. So, when printing the variable, it exists in the function (it is declared), but it is still

undefined

. In other words, the above code is equivalent to the following: function test() {

var a;

function foo() {

return 2;

}

console.log(a);

console.log(foo());

a = 1;

}

test ();

Question

4

: How does this work in JavaScriptWhat will the following code output? Give your answer.

var fullname = 'John Doe';

var obj = {

fullname: 'Colin Ihrig',

prop: {

fullname: Aurelio De Rosa', ​​​

console.log(obj.prop .getFullname());

var test = obj.prop.getFullname;

console.log(test());

answer

Answer It’s

Aurelio De Rosa

and

John Doe

. The reason is that in a function, the behavior of

this

depends on how the

JavaScript

function is called and defined, not just how it is defined.

In the first

console.log()

call, getFullname() is called as a function of the obj.prop object. So, the context refers to the latter, and the function returns the fullname of the object. In contrast, when getFullname() is assigned to the

test

variable, the context refers to the global object (window). This is because test is implicitly set as a property of the global object. For this reason, the function returns the fullname of window, which is the value defined in the first line. Question 5: call() and apply()

Now lets you solve the previous problem and make the final console.log() print Aurelio De Rosa.

Answer

This question can be changed by forcing the use of call() or apply() . Below I will use call(), but in this case apply() will output the same result:

console.log(test.call(obj.prop)) ;

Conclusion

In this article, we have discussed five classic questions used to test JavaScript developers. The concepts and topics covered in interviews are usually very similar. If you don't know the answers to some questions, don't worry: learning and experience can come slowly.

If you have some other interesting questions, don’t hesitate to share them with us. It will help a lot of developers.

Get it for freeLAMPBand of BrothersOriginalPHPVideo TutorialCD/《 DetailsPHP》Concise version , please consult the official website customer service for details:

http://www.lampbrother.net

PHPCMSSecondary developmenthttp://yun.itxdl.cn/online/phpcms/index.php? u=5

WeChat developmenthttp://yun.itxdl.cn/online/weixin/index.php?u=5

Mobile Internet server-side development http://yun.itxdl.cn/online/server/index.php?u=5

JavascriptCoursehttp://yun.itxdl.cn/online/js/ index.php?u=5

CTOTraining Camphttp://yun.itxdl.cn/online/cto/index.php?u=5

The above introduces 5 classic front-end interview questions, including relevant content. I hope it will be helpful to friends who are interested in PHP tutorials.