JS Interview Questions

question_angular.js

/*
 * The following code snippet runs in an angular controller body.
 * It tries to convert a blob object "data" into data URL and bind the result to the scope.
 * Fix it so that $scope.data will make UI change as expected.
 */

/* global angular, data, FileReader */

angular.module('xxx').controller('Ctrl', ['$scope', function ($scope) {
    var reader = new FileReader();
    reader.onload = function (event) {
        $scope.data = event.target.result;
    };
    reader.readAsDataURL(data);
}]);

question_bind.js

/*
 * Fix the following code snippet to make it work.
 * You can only modify line 7.
 * (Assume that <div id="page1"></div> exists)
 */

var g = document.getElementById;

g('page1').innerHTML = 'Hello World!';

question_callback.js

/*
 * Rewrite the following Node.js code snippet to flatten the so-called "callback hell".
 * Both "async" and "q" modules are available.
 * (Assume that no errors are generated)
 */

var fs = require('fs');

fs.readdir('tmp', function (err, files) {
    if (files.length > 2) {
        var file1, file2;
        fs.readFile(files[0], function (err, file) {
            file1 = file;
            fs.readFile(files[1], function (err, file) {
                file2 = file;
                fs.writeFile('tmp/concatfile', file1 + file2, function (err) {
                    console.log('done');
                });
            });
        });
    }
});

question_closure.js

/*
 * Fix this code snippet so that clicking buttons with ID 'btn-x' will print x in the console,
 * where x is an integer range from 1 to 5.
 */

/* global $ */

for (var i = 1; i < 6; i += 1) {
    $('#btn-' + i).click(function () {
        console.log(i);
    });
}

question_es6_arrow.js

/*
 * 1. Fix the following code snippet (line 8 ~ line 13)
 *    so that line 17 prints "John, hello"
 */

/* ES6 */

const Person = () => {
  this.greetings = 'hello';
  this.say = toName => {
    return '${toName}, ${this.greetings}';
  };
};

const p = new Person();

console.log(p.say('John'));

/*
 * 2. Fix the following code snippets so that wrap is a function like this (in ES5):
 * wrap = function(a, b, c) {
 *   return {x: a, y: b, z: c};
 * }
 * Note: you cannot use the "return" keyword
 */

const wrap = (a, b, c) => {
  x: a,
  y: b
  z: c
};

question_loop.js

/*
 * Assume that the code snippet runs in the browser, and the variable N is very large (say, 10^6).
 * Discuss about the possible pitfalls of the for loop,
 * and try to fix it.
 */

/* global $, N */

$('#btn').click(function () {
    for (var i = 0; i < N; i += 1) {
        $('#section').append('<h1>This is the number ' + i + ' heading.</h1>');
    }
});

question_timeout.js

/*
 * Discuss the possible console output results for this code snippet.
 * The "doSomething" function accepts a callback function as the input argument,
 * but whether it is synchronus or asynchronus remains unknown.
 */

/* global doSomething */

console.log('hello 1');

setTimeout(function () {
    console.log('hello 2');
}, 1);

console.log('hello 3');

doSomething(function (result) {
    console.log('doSomething done');
});

setTimeout(function () {
    console.log('hello 4');
}, 0);

console.log('hello 5');