D3 Examples - Practice Problems Matt Klug

xxxxxxxxxx
 
<!DOCTYPE html>
<head>
  <meta charset="utf-8">
  <script src="https://d3js.org/d3.v4.min.js"></script>
  <style>
    body { margin:0;position:fixed;top:0;right:0;bottom:0;left:0; }
  </style>
</head>
​
<body>
  <h1>Please look in the code below for 5 JavaScript practice problems.</h1>
  <p>(These problems don't include any SVG manipulation, so you will need to open the developer console in order to see the output of your code)</p>
  <script>
  // Problem 1: modify array1 so that each object it contains includes the 2 letter state "id"
​
  array1 = [
                    {name: "Arizona",  location: "Southwest"},
            {name: "Virginia", location: "East"},
            {name: "Florida",  location: "Southeast"}
           ];
    
  array2 = [
            {name: "Virginia", id: "VA"},
                    {name: "Arizona", id: "AZ"},
            {name: "Florida", id: "FL"}
                 ];
  
  array1.forEach(function(a){array2.forEach(function(b){if (a.name == b.name){a.id = b.id;}})});
​
  console.log(array1);
    
  // Problem 2: print all items that are in both array3 
  // and array4 to the console.
  
  array3 = ['a','b','c','d'];
  array4 = ['a','c','e','f','g'];
  
  array3.forEach(function(a){array4.forEach(function(b){if (a==b){console.log(a)}})})
  
  // Problem 3: 'states' is an array of objects. Sort the array in ascending order by population
  
  states = [{name: "Alaska", id: "AK", population: 741894},
            {name: "Virginia", id: "VA", population: 8411808},
                    {name: "Arizona", id: "AZ", population: 6931071},
            {name: "Florida", id: "FL", population: 20984400}]
      
  states.sort(function(a,b){a.population-b.population});
  
  // Problem 4: using console.log() and the appropriate index on the sorted 'states' array, print the state with the smallest population.
​
  console.log(states[0]);
  
  // someNumbers is an array containing all integers from 1-10 inclusively
  
  someNumbers = d3.range(1,11)
  
  // Problem 5: using console.log(), a loop,and the modulus operator, print those members of someNumbers that are NOT multiples of 3.
    
  someNumbers.forEach(function(v){if(v%3!=0){console.log(v)}});
  
​
  </script>
</body>
    