使用数据初始化observableArray

Question

通过这种方式，我试图在声明时使用数据初始化observableArray，但是给出了错误TypeError: this.Book is not a function。

这里是jsFiddle链接http://jsfiddle.net/jVQY8/11/

var Books = [{Book:"Harry Potter",Author:"J.K rowling"},{Book:"5 Point Someone",Author:"Chetan Bhagat"},{Book:"I too had a love story",Author:"Ravinder Singh"}];

var appViewModel = function() {
            this.firstName = ko.observable("Amit");
            this.Books = ko.observableArray(Books);
            this.updateBook = function() {
                this.Book("Harry Potter and Prisoner of Azkaban");
            }
        };

当我试图以这种方式初始化可观测数组时，this.Books = ko.observableArray(Books);抛出错误TypeError: this.Book is not a function

但是，当我以这种方式初始化可观测数组的时候，this.Books = ko.mapping.fromJS(Books);就可以正常工作了。

所以任何人都可以告诉我这是怎么回事初始化代码this.Books = ko.observableArray(Books);

有人能帮我解答一下这个问题吗?这样我就能理解下面这两种方法的区别了。

1) this.Books = ko.mapping.fromJS(Books);

2) this.Books = ko.observableArray(Books);

告诉我当这行执行this.Books = ko.mapping.fromJS(Books);时内部会发生什么

以及当这一行执行this.Books = ko.observableArray(Books);时内部发生了什么？

Answer 1

当您使用this.Books = ko.observableArray(Books)时，唯一可以观察到的就是数组本身，因此试图设置一个属性(如Book)，就像它是可观察的一样，自然会失败。

当使用this.Books = ko.mapping.fromJS(Books)时，数组中的每个对象和每个字段都会变成一个可观察的对象，这就是this.Book('New title')工作的原因。