5 classic interview questions in JavaScript

  • 2020-03-30 04:04:52
  • OfStack

1: Scope


 (function() {
    var a = b = 5;
 })();
 console.log(b);

What will be printed on the console?

answer

The code above will print 5.

The trick here is that there are two variable declarations, but a is declared using the keyword var. That means it's a local variable of a function. Instead, b becomes a global variable.

Another trick to this problem is that it doesn't use strict mode (' use strict';). . If strict mode is enabled, the code throws the error of the ReferenceError: B is not defined. Remember that strict mode requires explicit specification to implement global variable declarations. For example, you should write:


 (function() {
    'use strict';
    var a = window.b = 5;
 })();  console.log(b);

2: create "native" methods

Define a repeatify function for a string object. When an integer n is passed in, it returns the result of repeating the string n times. Such as:


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

Hellohellohello should be printed.

answer

One possible implementation is as follows:


 String.prototype.repeatify = String.prototype.repeatify || function(times) {
    var str = '';
    for (var i = 0; i < times; i++) {
       str += this;
    }
    return str;
 };

Now, the questions test developers know about JavaScript inheritance and prototype. This also verifies that the developer knows how to extend the built-in object (although it shouldn't be done).

Another important point here is to know how not to overwrite functionality that might already be defined. By testing this function definition, it did not exist before:


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

This technique is especially useful when you are asked to do JavaScript function compatibility.

3: enhancing the statement (Hoisting)

Execute this code and output something.


 function test() {
    console.log(a);
    console.log(foo());
    var a = 1;
    function foo() {
       return 2;
    }
 } 10: test();

answer

The result of this code is undefined and 2.

The reason is that the declarations of the variables and functions are advanced (moved to the top of the function), but the variables are not assigned any values. Therefore, when a variable is printed, it exists in the function (it is declared), but it is still undefined. In other words, the code above is equivalent to the following:


 function test() {
    var a;
    function foo() {
       return 2;
    }     console.log(a);
    console.log(foo());     a = 1;
 }  test();

4: how does this work in JavaScript

What does the following code output? Give your answer.


 var fullname = 'John Doe';
 var obj = {
    fullname: 'Colin Ihrig',
    prop: {
       fullname: 'Aurelio De Rosa',
       getFullname: function() {
          return this.fullname;
       }
    }
 };  console.log(obj.prop.getFullname());  var test = obj.prop.getFullname;  console.log(test());

answer

The answer is 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 a global object. For this reason, the function returns the fullname of the window, the value defined on the first line.

5: call() and apply()

Now let's solve the previous problem by making the last console.log() print Aurelio De Rosa.

answer

This problem can be changed by forcing the function context to use call() or apply(). I'll use call() below, but in this case apply() will output the same result:


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


Related articles: