screening.js

// 1: how could you rewrite the following to make it shorter?
if (foo) {
  bar.doSomething(el);
} else {
  bar.doSomethingElse(el);
}


//  Rick says: There is more then one way to optimize this
foo ? bar.doSomething(el) : bar.doSomethingElse(el);

//  Peter Higgins' solution was neat.



// 2: what is the faulty logic in the following code?
var foo = 'hello';

(function() {
  var foo = foo || 'world';
  console.log(foo);
})();

// Rick says: It's faulty all around. If you wanted to use the global `foo`
//  you should've passed into the closure. Additionally, using `var` (inside) will 
//  make foo a brand new variable with the closure as it's scope

var foo = 'hello';

(function() {
  var bar = foo || 'world';
  console.log(bar);
})();



// 3: given the following code, how would you override the value of the bar
// property for the variable foo without affecting the value of the bar
// property for the variable bim? how would you affect the value of the bar
// property for both foo and bim? how would you add a method to foo and bim to
// console.log the value of each object's bar property? how would you tell if
// the object's bar property had been overridden for the particular object?
var Thinger = function() {
  return this;
};

Thinger.prototype = {
  bar : 'baz'
};

var foo = new Thinger(),
    bim = new Thinger();

// A)
foo.bar = 'quux';

// B)
Thinger.prototype.bar = 'quux'

// C)
Thinger.prototype.log = function () {
  console.log(this.bar);
} 
  
// D) (the most obnoxious answer i could come up with :D )
Thinger.prototype = {
  _bar: 0,
  isRedefined: false, 
  get bar() { 
    return this._bar; 
  },
  set bar(x) { 
    this._bar = x; 
    this.isRedefined = true;
  }
};

var foo = new Thinger();

foo.bar = 10;

if ( foo.isRedefined ) {
  // foo.bar has been overridden
}





// 4: given the following code, and assuming that each defined object has a
// 'destroy' method, how would you destroy all of the objects contained in the
// myObjects object?
var myObjects = {
  thinger : new myApp.Thinger(),
  gizmo : new myApp.Gizmo(),
  widget : new myApp.Widget()
};

// Eh... 
for( var prop in myObjects ) { 
  var obj = myObjects[prop];
  obj && typeof obj.destroy === 'function' && obj.destroy(); 
}





// 5: given the following array, create an array that contains the contents of
// each array item repeated three times, with a space between each item. so,
// for example, if an array item is 'foo' then the new array should contain an
// array item 'foo foo foo'. (you can assume jQuery, dojo, or underscore is 
// available)
var myArray   = [ 'foo', 'bar', 'baz' ], 
    triplets  =  $.map(myArray, function ( str ) {
                    var a = []; a.length = 4;
                    return $.trim( a.join(str + ' ') );
                  });






// 6: how could you improve the following code?
$(document).ready(function() {
  $('.foo #bar').css('color', 'red');
  $('.foo #bar').css('border', '1px solid blue');
  $('.foo #bar').text('new text!');
  $('.foo #bar').click(function() {
    $(this).attr('title', 'new title');
    $(this).width('100px');
  });
  
  $('.foo #bar').click();
});


//  Eh...
$(function() {
  $('.foo #bar')
    .text('new text!')
    .css({ color: 'red', border: '1px solid blue' })
    .bind('click', function () {
      $(this).attr('title', 'new title')
              .css('width': '100px');
    })
    .trigger('click');
});




// 7: what issues do you see with the following code? how would you fix it?
(function() {
  var foo;

  dojo.xhrGet({
    url : 'foo.php',
    load : function(resp) {
      foo = resp.foo;
    }
  });

  if (foo) {
    // run this important code
  }
})();


// if (foo) >> `foo` is undefined.
// Asynchronous-city
(function() {
  var fooNasty  = function (data) {
        //  do some stuff
      };
  
  dojo.xhrGet({
    url : 'foo.php',
    load : function(resp) {
      if ( resp.foo ) {
        fooNasty(resp.foo);
      } 
    }
  });
})();




// 8: how could you rewrite the following code to make it shorter?
(function(d, $) {
  $('li.foo a').attr('title', 'i am foo');
  $('li.bar a').attr('title', 'i am bar');
  $('li.baz a').attr('title', 'i am baz');
  $('li.bop a').attr('title', 'i am bop');
})(dojo, dojo.query);


//  shorter, but maybe not the best or most performant
(function(d, $) {
  dojo.forEach($('li a'), function (a) {
    $(a).attr('title', 'i am ' + $(li.parentNode).attr('class'));
  })
})(dojo, dojo.query);





//  I'll get back to this later...



// 9: how would you improve the following code?
for (i = 0; i <= 100; i++) {
  $('#thinger').append('<p><span class="thinger">i am thinger ' + i + '</span></p>');
  $('#gizmo').append('<p><span class="gizmo">i am gizmo ' + i + '</span></p>');
}


for ( var i = 100; i > 0; i--) {
  $('#thinger').append('<p><span class="thinger">i am thinger ' + i + '</span></p>');
  $('#gizmo').append('<p><span class="gizmo">i am gizmo ' + i + '</span></p>');
}




// 10: a user enters their desired tip into a text box; the baseTotal, tax,
// and fee values are provided by the application. what are the potential
// issues with the following function for calculating the total?
function calculateTotal(baseTotal, tip, tax, fee) {
  return baseTotal + tip + tax + fee;
}


function calculateTotal() {
  var fees  = Array.prototype.slice.call(arguments), 
      total = 0;
  
  for ( var i = 0; i < fees.length; i++ ) {
    // this will omit all NaNs
    //if ( !!+fees[i] ) {
      total += +fees[i]; 
    //}
  } 
  return total.toFixed(2);
}



console.log(calculateTotal(5.00, .25, .05, 2.48))
console.log(calculateTotal('5.00', .25, .05, '2.48'))

// uncomment the NaN filter in the function for this to work
console.log(calculateTotal('5.00', .25, .05, 'words'))




//  Are we certain these are all ints?


// 11: given the following data structure, write code that returns an array 
// containing the name of each item, followed by a comma-separated list of
// the item's extras, if it has any. e.g. 
//
//    [ "Salad (Chicken, Steak, Shrimp)", ... ]
//
// (you can assume the library of your choice is available)
var menuItems = [
  {
    id : 1,
    name : 'Salad',
    extras : [
      'Chicken', 'Steak', 'Shrimp'
    ]
  },
  
  {
    id : 2,
    name : 'Potato',
    extras : [
      'Bacon', 'Sour Cream', 'Shrimp'
    ]
  },
  
  {
    id : 3,
    name : 'Sandwich',
    extras : [
      'Turkey', 'Bacon'
    ]
  },
  
  {
    id : 4,
    name : 'Bread'
  }
];

var lists = [];

for ( var item in menuItems ) {
  var listItem = menuItems[item];
  lists.push( listItem.name + ( listItem.extras ? ' ('+ listItem.extras.join(', ') + ')' : '')  );
}
console.log(lists);

// or...

var lists = $.map(menuItems, function (item) {
              return item.name + ( item.extras ? ' ('+ item.extras.join(', ') + ')' : '')
            });


console.log(lists);




// BONUS: write code such that the following alerts "Hello World"
say('Hello')('World');


function say(a) {
  return function (b) {
    alert(a + ' ' + b)
  }
}


// BONUS: what is the faulty logic in the following code? how would you fix it?
var date = new Date(),
    day = date.getDate(),
    month = date.getMonth(),
    dates = [];
    
for (var i = 0; i <= 5; i++) {
  dates.push(month + '/' + (day + i))
}


// getMonth() reminds me of that song... one of these things is not like the other

var date = new Date(), dates = [], i = 0;
for ( ; i <= 5; i++ ) {
  var d = new Date(date.getTime() + i * 86400000);
  dates.push( (d.getMonth() + 1) +'/'+ d.getDate() );
}

console.log('The next five days are ', dates.join(', '));