title: How to convert AngularJS scope object into simple JS array?
body: <p>How  to convert AngularJS scope object into simple JS array?</p>
  
  <p>This function checks if any checkbox is checked and adds corresponding  value to an object.
  Now I want to transfer the object values to an array and alert it after press the button. But the result is undefined, why?</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>var formApp = angular.module('formApp', [])
  
      .controller('formController', function($scope) {
  
          // we will store our form data in this object
          $scope.formData = {};
          
  
      });
  
  var array = Object.keys(formData).map(function(k) { return obj[k] });
  
  function test(){
  
  alert(array);
  }</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;-- index.html --&gt;
  &lt;!DOCTYPE html&gt;
  &lt;html&gt;
  &lt;head&gt;
  
      &lt;!-- CSS --&gt;
      &lt;!-- load up bootstrap and add some spacing --&gt;
      &lt;link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css"&gt;
      &lt;style&gt;
          body         { padding-top:50px; }
          form         { margin-bottom:50px; }
      &lt;/style&gt;
  
      &lt;!-- JS --&gt;
      &lt;!-- load up angular and our custom script --&gt;
      &lt;script src="http://code.angularjs.org/1.2.13/angular.js"&gt;&lt;/script&gt;
      &lt;script src="app.js"&gt;&lt;/script&gt;
  &lt;/head&gt;
  
  &lt;!-- apply our angular app and controller --&gt;
  &lt;body ng-app="formApp" ng-controller="formController"&gt;
  &lt;div class="col-xs-12 col-sm-10 col-sm-offset-1"&gt;
  
      &lt;h2&gt;Angular Checkboxes &lt;/h2&gt;
  
    
  ...
  
      &lt;!-- MULTIPLE CHECKBOXES --&gt;
      &lt;label&gt;Favorite Colors&lt;/label&gt;
      &lt;div class="form-group"&gt;
          &lt;label class="checkbox-inline"&gt;
              &lt;input type="checkbox" name="favoriteColors" ng-model="formData.favoriteColors.red"&gt; Red
          &lt;/label&gt;&lt;br&gt;
          &lt;label class="checkbox-inline"&gt;
              &lt;input type="checkbox" name="favoriteColors" ng-model="formData.favoriteColors.blue"&gt; Blue
          &lt;/label&gt; &lt;br&gt;
          &lt;label class="checkbox-inline"&gt;
              &lt;input type="checkbox" name="favoriteColors" ng-model="formData.favoriteColors.green"&gt; Green
          &lt;/label&gt;
      &lt;/div&gt;
  
  ...
      
      &lt;!-- SHOW OFF OUR FORMDATA OBJECT --&gt;
      &lt;h2&gt;formData_object_is_not_empty-test&lt;/h2&gt;
      &lt;pre&gt;
         {{formData}}
      &lt;/pre&gt;
       &lt;button onclick="test()"&gt;Click me&lt;/button&gt; 
  &lt;/div&gt;
  &lt;/body&gt;
  &lt;/html&gt;</code></pre>
  </div>
  </div>
  </p>