title: Knockout.js 2.0.0 - How is the Boolean being set in this example?
body: <p>I'm looking at the Task List example from Knockouts site and having a problem understanding how a particular value is being set.</p>
  
  <p>There is a javascript object created called Task.  It has a boolean property of 'isDone' that is assigned through <code>this.isDone = ko.observable(data.isDone);</code></p>
  
  <p>My problem is that I don't understand how the value of true or false is being passed to this property.  There is no sign that it is being passed in the initial creation of the object, and the only other place in the javascript file that is using the value is this:</p>
  
  <pre><code>self.incompleteTasks = ko.computed(function() {
          return ko.utils.arrayFilter(self.tasks(), function(task) { 
              return !task.isDone() 
          });
  </code></pre>
  
  <p>But this is only for the totals at the bottom of the task list - and this can be completely removed and the app still will work fine (except of course you won't have totals).</p>
  
  <p>In the markup, though, the 'isDone' value is being used by the checkbox input:</p>
  
  <pre><code>&lt;input type="checkbox" data-bind="checked: isDone" /&gt;
  </code></pre>
  
  <p><strong>Is it possible that when the checkbox is checked, the checkbox value itself - which would be true - is passed into 'isDone'?</strong></p>
  
  <p>Normally, I would expect that 'isDone' would need to already have a 'true' or 'false' value associated with it to be used in the markup, but I don't see how the value is being assigned.</p>
  
  <p>Here's the complete code for context:</p>
  
  <pre><code>function Task(data) {
          this.title = ko.observable(data.title);
          this.isDone = ko.observable(data.isDone);
  
  
      }
  
      function TaskListViewModel() {
          // Data
          var self = this;
          self.tasks = ko.observableArray([]);
          self.newTaskText = ko.observable();
          self.incompleteTasks = ko.computed(function() {
              return ko.utils.arrayFilter(self.tasks(), function(task) { 
                  return !task.isDone() 
              });
          });
  
          // Operations
          self.addTask = function() {
              self.tasks.push(new Task({ title: this.newTaskText() }));
              self.newTaskText("");
  
          };
          self.removeTask = function(task) { self.tasks.remove(task) };
      }
  
      ko.applyBindings(new TaskListViewModel());
  </code></pre>
  
  <p>... and here's the markup:</p>
  
  <pre><code>&lt;!DOCTYPE html&gt;
      &lt;html&gt;
      &lt;head&gt;
      &lt;title&gt;Knockout Practice&lt;/title&gt;
  
      &lt;/head&gt;
  
      &lt;body&gt; 
          &lt;h3&gt;Tasks&lt;/h3&gt;
  
      &lt;form data-bind="submit: addTask"&gt;
          Add task: &lt;input data-bind="value: newTaskText" placeholder="What needs to be done?" /&gt;
          &lt;button type="submit"&gt;Add&lt;/button&gt;
      &lt;/form&gt;
  
      &lt;ul data-bind="foreach: tasks, visible: tasks().length &gt; 0"&gt;
          &lt;li&gt;
              &lt;input type="checkbox" data-bind="checked: isDone" /&gt;
              &lt;input data-bind="value: title, disable: isDone" /&gt;
              &lt;a href="#" data-bind="click: $parent.removeTask"&gt;Delete&lt;/a&gt;
          &lt;/li&gt; 
      &lt;/ul&gt;
  
      You have &lt;b data-bind="text: incompleteTasks().length"&gt;&amp;nbsp;&lt;/b&gt; incomplete task(s)
      &lt;span data-bind="visible: incompleteTasks().length == 0"&gt; - it's beer time!&lt;/span&gt;
  
  
      &lt;script type='text/javascript' src='javascript/jquery-1.6.4.js'&gt;&lt;/script&gt;
      &lt;script type='text/javascript' src='javascript/jquery-tmpl.js'&gt;&lt;/script&gt;
      &lt;script type='text/javascript' src='javascript/knockout-2.0.0.js'&gt;&lt;/script&gt;
      &lt;script type='text/javascript' src='javascript/myKnockoutCode.js'&gt;&lt;/script&gt;
  
  
      &lt;/body&gt; 
  
      &lt;/html&gt;
  </code></pre>