title: Unexpected behaviour of knockout computed and subscribe
body: <p>I have following data structure </p>
  
  <pre><code>[{
      "name": "root1",
      "ecomCategories": [{
        "name": "sub11"
      }, {
        "name": "sub12",
        "ecomCategories": null
      }, {
        "name": "sub13",
        "ecomCategories": null
      }]
    }, {
      "name": "root2",
      "ecomCategories": [{
        "name": "sub21",
        "ecomCategories": null
      }]
    }] 
  </code></pre>
  
  <p>Now i want to show drop downs which will change on selecting of root category:
  please see this fiddle -- <a href="https://jsfiddle.net/devrahul/y7497cbL/1/" rel="nofollow">jsfiddle</a></p>
  
  <p><strong>However if i am updating any observable in the subscribed function then its changes are reflected in the parent observable</strong></p>
  
  <p>Steps to reproduce this issue in fiddle:</p>
  
  <ol>
  <li><p>Select root category "root1" it will have 3 sub categories sub11, sub12, sub13</p></li>
  <li><p>Select any subcategory i.e. sub11</p></li>
  <li><p>select root category "root2"</p></li>
  <li><p>Again select root category "root1"
  <strong>Now you will see only one sub category in the Sub category drop down where as it should have 3 sub categories</strong></p></li>
  </ol>
  
  <p><div class="snippet" data-lang="js" data-hide="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>// Here's my data model
  var ViewModel = function() {
    this.rootCategory = ko.observableArray([{
      "name": "root1",
      "ecomCategories": [{
        "name": "sub11"
      }, {
        "name": "sub12",
        "ecomCategories": null
      }, {
        "name": "sub13",
        "ecomCategories": null
      }]
    }, {
      "name": "root2",
      "ecomCategories": [{
        "name": "sub21",
        "ecomCategories": null
      }]
    }]);
    this.newObjectToSave = ko.observable();
    this.selectedCategory = ko.observable();
    this.selectedSubCategory = ko.observable();
  
    var that = this;
    //subscribers  
    this.selectedCategory.extend({
      notify: 'always'
    });
    this.selectedCategory.subscribe(function(newVal) {
  
      if (newVal != undefined) {
        that.newObjectToSave(newVal);
        // newObjectToSave().ecomCategories = [];
      }
  
    });
  
    this.selectedSubCategory.extend({
      notify: 'always'
    });
    this.selectedSubCategory.subscribe(function(subCat) {
  
      if (subCat != undefined) {
        that.newObjectToSave().ecomCategories = [subCat];
        that.newObjectToSave(that.newObjectToSave().ecomCategories[0]);
      }
  
    });
  
  
  
  
  
    //computed 
    this.subCategories = ko.computed(function() {
      if (this.selectedCategory() != undefined) {
        return this.selectedCategory().ecomCategories;
      } else {
        return "";
      }
  
    }, this);
  
  
  
  
  
  };
  
  ko.applyBindings(new ViewModel()); // This makes Knockout get to work</code></pre>
  <pre class="snippet-code-css lang-css prettyprint-override"><code>.paddingTop15 {
    padding-top: 15px;
  }
  .browseCategory select {
    -webkit-appearance: none;
    /*Removes default chrome and safari style*/
    -moz-appearance: none;
    /* Removes Default Firefox style*/
  }</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;script src="https://cdnjs.cloudflare.com/ajax/libs/knockout/3.2.0/knockout-min.js"&gt;&lt;/script&gt;
  &lt;div class="container"&gt;
    &lt;div class="row paddingTop15"&gt;
      &lt;div class="col-lg-2"&gt;
        Select Root Category:
        &lt;br&gt;
        &lt;div class="btn-group btn-group-sm browseCategory"&gt;
          &lt;select class="btn btn-default" data-bind="options: rootCategory,
                          optionsText: 'name',
                          value: selectedCategory,
                          optionsCaption: 'Select Category'"&gt;&lt;/select&gt;
        &lt;/div&gt;
      &lt;/div&gt;
    &lt;/div&gt;
  
    &lt;div class="row paddingTop15"&gt;
  
      &lt;div class="col-lg-2"&gt;
        Select SubCategory:
        &lt;br&gt;
        &lt;div class="btn-group btn-group-sm browseCategory"&gt;
          &lt;select class="btn btn-default" data-bind="options: subCategories,
                          optionsText: 'name',
                          value: selectedSubCategory,
                          optionsCaption: 'Select Sub Category'"&gt;&lt;/select&gt;
        &lt;/div&gt;
      &lt;/div&gt;
  
  
  
    &lt;/div&gt;
  &lt;/div&gt;</code></pre>
  </div>
  </div>
  </p>
  
  <p>So why updating of "newObjectToSave" is updating "selectedCategory" value ???</p>