הלינקייה: מגזין חודשי למפתחים

רוצה לשמוע על כל האירועים, המדריכים, הקורסים והמאמרים שנכתבו החודש ?
הלינקייה הינו מגזין חופשי בעברית שמשאיר אותך בעניינים.
בלי ספאם. בלי שטויות. פעם בחודש אצלך בתיבה.

JavaScript Exercises

Objects and Arrays

Fill in the missing code


var Person = function(name) {
  var age = 1;
  var self = {
    name: name,
    hello: function() { console.log('My name is: ' + name + ' and I am ' + age + ' years old'); },
    grow_up: function() { age += 1; }
  };

  return self;
};

var p1 = Person('Mike');
var p2 = Person('Jim');

// print: My name is Mike and I am 1 years old
p1.hello();

// fill code here

// print: My name is Mike and I am 2 years old
p1.hello();

// print: My name is Jim and I am 1 years old
p2.hello();

Implement a Summer objects with two methods (functions): getCurrentSum() and add(number).
Run the following main code to make sure everything works:

(function () {

 // Insert Code Here

  var s1 = new Summer();
  var s2 = new Summer();
 
  s1.add(10);
  s1.add(20);
 
  s2.add(30);
 
  s2.add(5);
 
  // prints 30
  console.log(s1.getCurrentSum());
 
  // prints 35
  console.log(s2.getCurrentSum());
 
}());

Implement the following Bingo object. The Bingo object should randomize a number between 1 and 10 on creation and provide a single method guess(number). That method should return true if the argument was the secret number. Test your class using a main code.
Here's a sample for using Bingo:

// Your code goes here

var bingo1 = Bingo();
var bingo2 = Bingo();

if ( bingo1.guess(7) ) {
  console.log('The first winner is number: ... 7');
} 

if ( bingo2.guess(10)) {
  console.log('10 is a winner for bingo2');
}

Implement the following Todo list code:


// your code goes here

var tasks = Todos();

var t1 = Task('Feed the dog');
var t2 = Task('Clean up the house');
var t3 = Task('Write JavaScript');

tasks.addTask(t1);
tasks.addTask(t2);
tasks.addTask(t3);

// print: I need to do 3 things
console.log('I need to do ' + tasks.count() + ' things');

t1.done();
t2.done();

// print: I need to do 1 thing
console.log('I need to do ' + tasks.count() + ' thing');

// print: My task is: Write JavaScript
console.log('My task is: ' + tasks.get(0));

Implement a Music Box object that should make the following code work well:

(function() {
  // Insert Code Here

  var box = MusicBox(),
      a1 = Album("The Who", "Tommy"),
      a2 = Album("Tom Waits", "Closing Time"),
      a3 = Album("John Cale", "Paris 1919"),
      favorite;
 
  box.addAlbum(a1);
  box.addAlbum(a2);
  box.addAlbum(a3);
 
  a1.play() ; // prints "Playing The Who - Tommy"
  a2.play(); // prints "Playing John Cale - Paris 1919"  
  a1.play(); // prints "Playing The Who - Tommy"
 
  favorite = box.favoriteAlbum(); 
 
  // prints "favorite album is The Who - Tommy"
  console.log("favorite album is " + favorite); 
 
}());

Can you also write it so that box.addAlbum(a1, a2, a3) will work ? how ?

Write the functions that will make the following code work:

(function () {
  var album = PhotoAlbum(),
      p;
 
  p = Photo("Paris Trip 1");
  p.tag("Jimmy");
  p.tag("Jane");
  p.tag("Jeff");
 
  album.addPicture(p);
 
  p = Photo("Look the Eiffel");
  p.tag("Jimmy");
  p.tag("Max");
  album.addPicture(p);
 
  p = Photo("OMG it's so high");
  p.tag("Jimmy");
  p.tag("Jane");
 
  // prints "Jimmy, Jane"
  p.showTags();
 
  album.addPicture(p);
 
  // prints "Paris Trip 1, Look the Eiffel, OMG it's so high"
  album.showPictures("Jimmy");
 
  // prints "Paris Trip 1, OMG it's so high"
  album.showPictures("Jane");    
}());

Functions

  • Implement a mul function which takes a variable number of arguments and calculates their multiplication
  • Implement a function called seven which throws an exception if it got exactly 7 arguments
  • Implement a function called add_x which takes a number x and returns a function. That returned function should take a single argument and return it added with x. Example use:
      var add2 = add_x(2);
      console.log(add2(7)); // prints 7;
    
  • Implement a function map which takes a function and a list, and applies that function on every element of the list. Return value is a list of results
  • Implement a function filter which takes a function predicate and a list, and returns a new list of all the elements for which predicate(n) is true

Prototypes

  • Implement a Line object that can draw itself using a '*' symbol. Constructor takes length of the line
  • Implement a ThickLine object that extends Line and draws a thick line. Constructor takes line thickness. (A thick line is a line composed of multiple rows of normal lines)
  • Implement a Sale object that makes the following code work:
    var sale = new Sale(100);
    sale.decorate('tax');
    sale.decorate('USD');
    sale.decorate('coupon');
    
    sale.getPrice(); // returns the price after adding 16% VAT, minus 10% coupon discount, in $
    
    

DOM Manipulations

  • Implement a clock app with a single text paragraph and a button. Clicking on the button should update the text to the current time
  • Implement a "world clock" app. Player is presented with three city names. Tapping on a city changes background image of the app to the selected city, and shows the time at that location
  • Implement the "Red Spotter" game: The player is presented with four boxes and she must click on the red box. Every successful click rearranges the boxes
  • Use jQuery Mobile to write a Mobile Web App that converts time units.
    A user is presented with 3 fields: seconds, minutes and hours.
    After the user chooses and fills a field, the app calculates and fills the other two.
  • Implement a speed test detector. User is presented with a red light and a button. After a random number of seconds the red light is changed to green. Player must click the button as fast as possible after color is green. Present her score in a dialog box
course: