2015-07-07 18:54:27 -07:00
{
2015-08-13 00:21:52 +01:00
"name" : "Object Oriented and Functional Programming" ,
2015-08-15 14:23:10 -07:00
"order" : 0.010 ,
2015-08-11 15:39:07 +01:00
"note" : [
2015-08-16 05:25:10 -07:00
"Methods" ,
2015-08-16 04:05:15 -07:00
"Closures" ,
"Factories" ,
"Pure Functions" ,
"Currying Functions" ,
"Functors" ,
"Currying Functions"
2015-08-11 15:39:07 +01:00
] ,
2015-07-07 18:54:27 -07:00
"challenges" : [
2015-08-11 15:39:07 +01:00
{
"id" : "cf1111c1c15feddfaeb1bdef" ,
2015-08-16 08:03:34 -07:00
"title" : "Declare JavaScript Objects as Variables" ,
2015-08-11 15:39:07 +01:00
"difficulty" : 0 ,
"description" : [
2015-08-15 13:57:44 -07:00
"Before we dive into Object Oriented Programming, let's revisit JavaScript objects." ,
2015-08-18 02:05:53 -04:00
"Give your <code>motorBike</code> object a <code>wheels</code>, <code>engines</code> and <code>seats</code> attribute and set them to numbers."
2015-08-11 15:39:07 +01:00
] ,
"tests" : [
2015-08-16 04:05:15 -07:00
"assert(typeof(motorBike.engines) === 'number', '<code>engines</code> should be have a <code>engines</code> attribute set to a number.');" ,
"assert(typeof(motorBike.wheels) === 'number', '<code>wheels</code> should be have a <code>engines</code> attribute set to a number.');" ,
"assert(typeof(motorBike.seats) === 'number', '<code>seats</code> should be have a <code>engines</code> attribute set to a number.');"
2015-08-11 15:39:07 +01:00
] ,
"challengeSeed" : [
"//Here is a sample Object" ,
"var car = {" ,
2015-08-16 04:05:15 -07:00
" \"wheels\":4," ,
" \"engines\":1," ,
" \"seats\":5" ,
2015-08-11 15:39:07 +01:00
"};" ,
"" ,
"//Now Let's make a similar Object called motorBike" ,
"//Give it two wheels, one engine and one seat" ,
"var motorBike = {" ,
2015-08-16 04:05:15 -07:00
" // Only change code below this line." ,
"" ,
"" ,
"" ,
" // Only change code above this line." ,
2015-08-11 15:39:07 +01:00
"};" ,
"" ,
2015-08-16 05:25:10 -07:00
"(function() {return(JSON.stringify(motorBike));})();"
2015-08-11 15:39:07 +01:00
] ,
2015-08-16 04:05:15 -07:00
"challengeType" : 1 ,
"type" : "waypoint" ,
"type" : "waypoint"
2015-08-11 15:39:07 +01:00
} ,
{
"id" : "cf1111c1c15feddfaeb2bdef" ,
2015-08-16 08:03:34 -07:00
"title" : "Construct JavaScript Objects with Functions" ,
2015-08-11 15:39:07 +01:00
"difficulty" : 0 ,
"description" : [
2015-08-16 04:05:15 -07:00
"We are also able to create objects using <code>constructor</code> functions." ,
2015-08-18 02:05:53 -04:00
"Give your <code>motorBike</code> object a <code>wheels</code>, <code>engines</code> and <code>seats</code> attribute and set them to numbers."
2015-08-11 15:39:07 +01:00
] ,
"tests" : [
2015-08-16 05:25:10 -07:00
"assert(typeof((new MotorBike()).engines) === 'number', '<code>engines</code> should be have a <code>engines</code> attribute set to a number.');" ,
"assert(typeof((new MotorBike()).wheels) === 'number', '<code>wheels</code> should be have a <code>engines</code> attribute set to a number.');" ,
"assert(typeof((new MotorBike()).seats) === 'number', '<code>seats</code> should be have a <code>engines</code> attribute set to a number.');"
2015-08-11 15:39:07 +01:00
] ,
"challengeSeed" : [
2015-08-18 02:05:53 -04:00
"// Let's add the properties engines and seats to the car in the same way that the property wheels has been added below. They should both be numbers." ,
2015-08-16 05:25:10 -07:00
"var Car = function() {" ,
2015-08-16 04:05:15 -07:00
" this.wheels = 4;" ,
" this.engines = 1;" ,
" this.seats = 1;" ,
2015-08-11 15:39:07 +01:00
"};" ,
"" ,
2015-08-16 05:25:10 -07:00
"var myCar = new Car();" ,
"" ,
"// Only change code below this line." ,
"var MotorBike = function() {" ,
"" ,
"" ,
"" ,
"};" ,
"" ,
"var myMotorBike = new MotorBike();" ,
2015-08-16 04:05:15 -07:00
"// Only change code above this line." ,
2015-08-11 15:39:07 +01:00
"" ,
2015-08-16 05:25:10 -07:00
"(function() {return(JSON.stringify(myMotorBike));})();"
2015-08-11 15:39:07 +01:00
] ,
2015-08-16 04:05:15 -07:00
"challengeType" : 1 ,
"type" : "waypoint"
2015-08-11 15:39:07 +01:00
} ,
{
"id" : "cf1111c1c15feddfaeb3bdef" ,
2015-08-16 08:03:34 -07:00
"title" : "Make Object Properties Private" ,
2015-08-11 15:39:07 +01:00
"difficulty" : 0 ,
"description" : [
2015-08-16 05:25:10 -07:00
"Objects have their own attributes, called <code>properties</code>, and their own functions, called <code>methods</code>." ,
"In the previous challenge, we used the <code>this</code> keyword to reference <code>public properties</code> and <code>public methods</code> of the current object." ,
"We can also create <code>private properties</code> and <code>private methods</code>, which aren't accessible from outside the object." ,
"To do this, we omit the word <code>this</code> from the <code>property</code> or <code>method</code> declaration." ,
"See if you can keep <code>myBike.speed</code> and <code>myBike.addUnit</code> private, while making <code>myBike.getSpeed</code> publicly accessible."
2015-08-11 15:39:07 +01:00
] ,
"tests" : [
2015-08-16 04:05:15 -07:00
"assert(typeof(myBike.getSpeed)!=='undefined' && typeof(myBike.getSpeed) === 'function', 'The method getSpeed of myBike should be accessible outside the object');" ,
"assert(typeof(myBike.speed) === 'undefined', '<code>myBike.speed</code> should remain undefined.');" ,
2015-08-16 05:25:10 -07:00
"assert(typeof(myBike.addUnit) === 'undefined', '<code>myBike.addUnit</code> should remain undefined.');"
2015-08-11 15:39:07 +01:00
] ,
"challengeSeed" : [
"//Let's create an object with a two functions. One attached as a property and one not." ,
2015-08-16 05:25:10 -07:00
"var Car = function() {" ,
" this.gear = 1;" ,
" function addStyle(styleMe){" ,
" return('The Current Gear Is: ' + styleMe);" ,
" }" ,
" this.getGear = function() {" ,
" return(addStyle(this.gear));" ,
" };" ,
2015-08-11 15:39:07 +01:00
"};" ,
"" ,
2015-08-16 05:25:10 -07:00
"var Bike = function() {" ,
2015-08-16 19:34:11 -07:00
" // Only change code below this line." ,
2015-08-16 05:25:10 -07:00
" this.speed = 100;" ,
" function addUnit(value) {" ,
" return(value + \"KM/H\");" ,
" }" ,
" " ,
" getSpeed = function () {" ,
" return(addUnit(speed));" ,
" };" ,
" " ,
2015-08-11 15:39:07 +01:00
"};" ,
"" ,
2015-08-16 19:34:11 -07:00
"// Only change code above this line." ,
2015-08-11 15:39:07 +01:00
"var myCar = new Car();" ,
2015-08-12 00:11:56 +01:00
"var myBike = new Bike();" ,
2015-08-11 15:39:07 +01:00
"" ,
2015-08-16 05:25:10 -07:00
"if(myBike.hasOwnProperty('getSpeed')){(function() {return(JSON.stringify(myBike.getSpeed()));})();};"
2015-08-11 15:39:07 +01:00
] ,
2015-08-16 04:05:15 -07:00
"challengeType" : 1 ,
"type" : "waypoint"
2015-08-11 15:39:07 +01:00
} ,
{
2015-08-12 00:11:56 +01:00
"id" : "cf1111c1c15feddfaeb4bdef" ,
2015-08-16 19:34:11 -07:00
"title" : "Make Instances of Objects with a Constructor Function" ,
2015-08-11 15:39:07 +01:00
"difficulty" : 0 ,
"description" : [
2015-08-16 05:25:10 -07:00
"Sometimes you'll want to be able to easily create similar objects." ,
"Objects have their own attributes, called <code>properties</code>, and their own functions, called <code>methods</code>." ,
"A function that creates objects is called a <code>constructor</code>." ,
"You can create <code>instances</code> of an object using a <code>constructor</code>." ,
"Each new <code>instance</code> of this object <code>inherits</code> all the <code>properties</code> and <code>methods</code> of your original object." ,
"Then you can give the instance new properties."
2015-08-11 15:39:07 +01:00
] ,
"tests" : [
2015-08-16 05:25:10 -07:00
"assert((new Car()).wheels === 4, 'The property <code>wheels</code> should still be 4 like in the object constructor');" ,
"assert(typeof((new Car()).engines) === 'undefined', 'There should not be a property engine in the object constructor');" ,
2015-08-14 14:48:59 -07:00
"assert(myCar.wheels === 4, 'The property wheels of myCar should be four');" ,
2015-08-16 05:25:10 -07:00
"assert(typeof(myCar.engines) === 'number', 'The property engine of myCar should be a number');"
2015-08-11 15:39:07 +01:00
] ,
"challengeSeed" : [
2015-08-16 05:25:10 -07:00
"var Car = function() {" ,
2015-08-11 15:39:07 +01:00
" this.wheels = 4;" ,
"};" ,
"" ,
2015-08-16 19:34:11 -07:00
"// Only change code below this line." ,
2015-08-11 15:39:07 +01:00
"var myCar = new Car();" ,
"" ,
2015-08-16 05:25:10 -07:00
"//Add the property \"engines\" to myCar, and make it a number." ,
2015-08-11 15:39:07 +01:00
"" ,
"" ,
2015-08-16 19:34:11 -07:00
"// Only change code above this line." ,
2015-08-16 05:25:10 -07:00
"(function() {return(JSON.stringify(myCar));})();"
2015-08-11 15:39:07 +01:00
] ,
2015-08-16 04:05:15 -07:00
"challengeType" : 1 ,
"type" : "waypoint"
2015-08-11 15:39:07 +01:00
} ,
{
2015-08-12 00:11:56 +01:00
"id" : "cf1111c1c15feddfaeb7bdef" ,
2015-08-16 19:34:11 -07:00
"title" : "Iterate over Arrays with .map" ,
2015-08-11 15:39:07 +01:00
"difficulty" : 0 ,
"description" : [
2015-08-16 04:05:15 -07:00
"<code>array = array.map(function(val){</code>" ,
2015-08-16 09:12:54 -07:00
"<code>  return(val+1);</code>" ,
2015-08-16 04:05:15 -07:00
"<code>});</code>" ,
2015-08-13 00:20:15 +01:00
"" ,
2015-08-23 03:42:42 -04:00
"The map method is one of the easiest ways to iterate through an array or object there is. Let's use it now." ,
2015-08-23 03:47:13 -04:00
"Use the map function to add 3 to every value in the variable `array`"
2015-08-11 15:39:07 +01:00
] ,
"tests" : [
2015-08-14 14:48:59 -07:00
"assert.deepEqual(array, [4,5,6,7,8], 'You should have added three to each value in the array');" ,
"assert(editor.getValue().match(/\\.map\\(/gi), 'You should be making use of the map method');" ,
"assert(editor.getValue().match(/\\[1\\,2\\,3\\,4\\,5\\]/gi), 'You should only modify the array with .map');"
2015-08-11 15:39:07 +01:00
] ,
"challengeSeed" : [
2015-08-13 00:20:15 +01:00
"//Use map to add three to each value in the array" ,
"var array = [1,2,3,4,5];" ,
2015-08-16 19:34:11 -07:00
"// Only change code below this line." ,
2015-08-13 00:20:15 +01:00
"" ,
"" ,
"" ,
2015-08-16 19:34:11 -07:00
"// Only change code above this line." ,
2015-08-16 05:25:10 -07:00
"(function() {return(array);})();"
2015-08-11 15:39:07 +01:00
] ,
2015-08-16 04:05:15 -07:00
"challengeType" : 1 ,
"type" : "waypoint"
2015-08-11 15:39:07 +01:00
} ,
{
2015-08-12 00:11:56 +01:00
"id" : "cf1111c1c15feddfaeb8bdef" ,
2015-08-16 19:34:11 -07:00
"title" : "Condense arrays with .reduce" ,
2015-08-11 15:39:07 +01:00
"difficulty" : 0 ,
"description" : [
2015-08-13 00:20:15 +01:00
"Reduce can be useful for condensing and array or numbers into one value." ,
2015-08-16 04:05:15 -07:00
"<code>var singleVal = array.reduce(function(previousVal, currentVal){</code>" ,
2015-08-16 09:12:54 -07:00
"<code>  return(previousVal+currentVal);</code>" ,
"<code>});</code>"
2015-08-11 15:39:07 +01:00
] ,
"tests" : [
2015-08-14 14:48:59 -07:00
"assert(singleVal == 30, 'singleVal should have been set to the result of you reduce operation');" ,
"assert(editor.getValue().match(/\\.reduce\\(/gi), 'You should have made use of the reduce method');"
2015-08-11 15:39:07 +01:00
] ,
"challengeSeed" : [
2015-08-13 00:20:15 +01:00
"var array = [4,5,6,7,8];" ,
"var singleVal = 0;" ,
2015-08-16 19:34:11 -07:00
"// Only change code below this line." ,
2015-08-13 00:20:15 +01:00
"" ,
"" ,
"" ,
2015-08-16 19:34:11 -07:00
"// Only change code above this line." ,
"(function() {return(singleVal);})();"
2015-08-11 15:39:07 +01:00
] ,
2015-08-16 04:05:15 -07:00
"challengeType" : 1 ,
"type" : "waypoint"
2015-08-11 15:39:07 +01:00
} ,
{
2015-08-12 00:11:56 +01:00
"id" : "cf1111c1c15feddfaeb9bdef" ,
2015-08-16 19:34:11 -07:00
"title" : "Filter Arrays with .filter" ,
2015-08-11 15:39:07 +01:00
"difficulty" : 0 ,
"description" : [
2015-08-13 00:20:15 +01:00
"filter is a useful method that can filter out values that don't match a certain criteria" ,
2015-08-17 14:11:49 +01:00
"Let's remove all the values greater than five" ,
2015-08-16 04:05:15 -07:00
"<code>array = array.filter(function(val) {</code>" ,
2015-08-16 09:12:54 -07:00
"<code>  return(val<4);</code>" ,
2015-08-16 04:05:15 -07:00
"<code>});</code>"
2015-08-11 15:39:07 +01:00
] ,
"tests" : [
2015-08-17 14:11:49 +01:00
"assert.deepEqual(array, [1,2,3,4,5], 'You should have removed all the values from the array that are greater than five');" ,
2015-08-14 14:48:59 -07:00
"assert(editor.getValue().match(/array\\.filter\\(/gi), 'You should be using the filter method to remove the values from the array');" ,
2015-08-16 18:26:11 +01:00
"assert(editor.getValue().match(/\\[1\\,2\\,3\\,4\\,5\\,6\\,7\\,8\\,9\\,10\\]/gi), 'You should only be using .filter to modify the contents of the array');"
2015-08-11 15:39:07 +01:00
] ,
"challengeSeed" : [
2015-08-13 00:20:15 +01:00
"var array = [1,2,3,4,5,6,7,8,9,10];" ,
2015-08-16 19:34:11 -07:00
" // Only change code below this line." ,
2015-08-13 00:20:15 +01:00
"" ,
"" ,
"" ,
2015-08-16 19:34:11 -07:00
" // Only change code above this line." ,
2015-08-16 05:25:10 -07:00
"(function() {return(array);})();"
2015-08-11 15:39:07 +01:00
] ,
2015-08-16 04:05:15 -07:00
"challengeType" : 1 ,
"type" : "waypoint"
2015-08-11 15:39:07 +01:00
} ,
{
2015-08-12 00:11:56 +01:00
"id" : "cf1111c1c16feddfaeb1bdef" ,
2015-08-16 19:34:11 -07:00
"title" : "Sort Arrays with .sort" ,
2015-08-11 15:39:07 +01:00
"difficulty" : 0 ,
"description" : [
2015-08-13 00:20:15 +01:00
"You can use the method sort to easily sort the values in the array alphabetically or numerically" ,
2015-08-16 04:05:15 -07:00
"<code>var array = [1,3,2];</code>" ,
"<code>array = array.sort();</code>" ,
"This will return <code>[1, 2, 3]</code>"
2015-08-11 15:39:07 +01:00
] ,
"tests" : [
2015-08-14 14:48:59 -07:00
"assert.deepEqual(array, ['alpha', 'beta', 'charlie'], 'You should have sorted the array alphabetically');" ,
"assert(editor.getValue().match(/\\[\\'beta\\'\\,\\s\\'alpha\\'\\,\\s'charlie\\'\\];/gi), 'You should be sorting the array using sort');" ,
"assert(editor.getValue().match(/\\.sort\\(\\)/gi), 'You should have made use of the sort method');"
2015-08-11 15:39:07 +01:00
] ,
"challengeSeed" : [
2015-08-13 00:20:15 +01:00
"var array = ['beta', 'alpha', 'charlie'];" ,
2015-08-16 19:34:11 -07:00
"// Only change code below this line." ,
2015-08-13 00:20:15 +01:00
"" ,
"" ,
"" ,
2015-08-16 19:34:11 -07:00
" // Only change code above this line." ,
2015-08-16 05:25:10 -07:00
"(function() {return(array);})();"
2015-08-11 15:39:07 +01:00
] ,
2015-08-16 04:05:15 -07:00
"challengeType" : 1 ,
"type" : "waypoint"
2015-08-11 15:39:07 +01:00
} ,
{
2015-08-12 00:11:56 +01:00
"id" : "cf1111c1c16feddfaeb2bdef" ,
2015-08-16 19:34:11 -07:00
"title" : "Reverse Arrays with .reverse" ,
2015-08-12 00:11:56 +01:00
"difficulty" : 0 ,
"description" : [
2015-08-16 04:05:15 -07:00
"You can use the <code>.reverse()</code> function to reverse the contents of an array."
2015-08-11 15:39:07 +01:00
] ,
2015-08-12 00:11:56 +01:00
"tests" : [
2015-08-14 14:48:59 -07:00
"assert.deepEqual(array, [7,6,5,4,3,2,1], 'You should reverse the array');" ,
"assert(editor.getValue().match(/\\.reverse\\(\\)/gi), '');" ,
"assert(editor.getValue().match(/\\[1\\,2\\,3\\,4\\,5\\,6\\,7/gi), '');"
2015-08-11 15:39:07 +01:00
] ,
2015-08-12 00:11:56 +01:00
"challengeSeed" : [
2015-08-13 00:20:15 +01:00
"var array = [1,2,3,4,5,6,7];" ,
2015-08-16 19:34:11 -07:00
" // Only change code below this line." ,
2015-08-13 00:20:15 +01:00
"" ,
"" ,
"" ,
2015-08-16 19:34:11 -07:00
" // Only change code above this line." ,
2015-08-16 05:25:10 -07:00
"(function() {return(array);})();"
2015-08-11 15:39:07 +01:00
] ,
2015-08-16 04:05:15 -07:00
"challengeType" : 1 ,
"type" : "waypoint"
2015-08-11 15:39:07 +01:00
} ,
{
2015-08-12 00:11:56 +01:00
"id" : "cf1111c1c16feddfaeb3bdef" ,
2015-08-16 19:34:11 -07:00
"title" : "Concatenate Strings with .concat" ,
2015-08-12 00:11:56 +01:00
"difficulty" : 0 ,
"description" : [
2015-08-16 04:05:15 -07:00
"<code>.concat()</code> can be used to merge the contents of two arrays into one." ,
2015-08-13 00:20:15 +01:00
"<code>array = array.concat(otherArray);</code>"
2015-08-11 15:39:07 +01:00
] ,
2015-08-12 00:11:56 +01:00
"tests" : [
2015-08-14 14:48:59 -07:00
"assert.deepEqual(array, [1,2,3,4,5,6], 'You should concat the two arrays together');" ,
"assert(editor.getValue().match(/\\.concat\\(/gi), 'You should be using the concat method to merge the two arrays');" ,
"assert(editor.getValue().match(/\\[1\\,2\\,3\\]/gi) && editor.getValue().match(/\\[4\\,5\\,6\\]/gi), 'You should only modify the two arrays without changing the origional ones');"
2015-08-11 15:39:07 +01:00
] ,
2015-08-12 00:11:56 +01:00
"challengeSeed" : [
2015-08-13 00:20:15 +01:00
"var array = [1,2,3];" ,
"" ,
"var concatMe = [4,5,6];" ,
2015-08-16 19:34:11 -07:00
"// Only change code below this line." ,
2015-08-13 00:20:15 +01:00
"" ,
"" ,
"" ,
2015-08-16 19:34:11 -07:00
"// Only change code above this line." ,
"(function() {return(array);})();"
2015-08-11 15:39:07 +01:00
] ,
2015-08-16 04:05:15 -07:00
"challengeType" : 1 ,
"type" : "waypoint"
2015-08-13 00:20:15 +01:00
} ,
{
"id" : "cf1111c1c16feddfaeb4bdef" ,
2015-08-16 19:34:11 -07:00
"title" : "Split Strings with .split" ,
2015-08-13 00:20:15 +01:00
"difficulty" : 0 ,
"description" : [
2015-08-16 04:05:15 -07:00
"You can use the <code>.split()</code> method to split a string into an array." ,
"split uses the argument you give to to split the string." ,
2015-08-13 00:20:15 +01:00
"<code>array = string.split(' ');</code>"
] ,
"tests" : [
2015-08-14 14:48:59 -07:00
"assert(typeof(array) === 'object' && array.length === 5, 'You should have split the string by it\\'s spaces');" ,
"assert(/\\.split\\(/gi, 'You should have made use of the split method on the string');"
2015-08-13 00:20:15 +01:00
] ,
"challengeSeed" : [
"var string = \"Split me into an array\";" ,
2015-08-16 19:34:11 -07:00
"// Only change code below this line." ,
2015-08-13 00:20:15 +01:00
"" ,
"var array = string;" ,
"" ,
2015-08-16 19:34:11 -07:00
"// Only change code above this line." ,
2015-08-16 05:25:10 -07:00
"(function() {return(array);})();"
2015-08-13 00:20:15 +01:00
] ,
2015-08-16 04:05:15 -07:00
"challengeType" : 1 ,
"type" : "waypoint"
2015-08-13 00:20:15 +01:00
} ,
{
"id" : "cf1111c1c16feddfaeb5bdef" ,
2015-08-16 19:34:11 -07:00
"title" : "Join Strings with .join" ,
2015-08-13 00:20:15 +01:00
"difficulty" : 0 ,
"description" : [
2015-08-16 04:05:15 -07:00
"We can use the <code>.join()</code> method to join each element in an array into a string separated by whatever delimiter you provide as an argument to the join operation." ,
2015-08-13 00:20:15 +01:00
"<code>var joinMe = joinMe.join(\" \");</code>"
] ,
"tests" : [
2015-08-14 14:48:59 -07:00
"assert(typeof(joinMe) === 'string' && joinMe === \"Split me into an array\", 'You should have joined the arrays by it\\'s spaces');" ,
"assert(/\\.join\\(/gi, 'You should have made use of the join method on the array');"
2015-08-13 00:20:15 +01:00
] ,
"challengeSeed" : [
"var joinMe = [\"Split\",\"me\",\"into\",\"an\",\"array\"];" ,
2015-08-16 19:34:11 -07:00
"// Only change code below this line." ,
2015-08-13 00:20:15 +01:00
"" ,
"joinMe = joinMe;" ,
"" ,
2015-08-16 19:34:11 -07:00
"// Only change code above this line." ,
2015-08-16 05:25:10 -07:00
"(function() {return(joinMe);})();"
2015-08-13 00:20:15 +01:00
] ,
2015-08-16 04:05:15 -07:00
"challengeType" : 1 ,
"type" : "waypoint"
2015-08-11 15:39:07 +01:00
}
2015-07-07 18:54:27 -07:00
]
}