O que é knockout.js?
O Knockout é uma excelente biblioteca JavaScript que ajuda a criar um texto rico em interface do usuário com boas funções de exibição e edição usando apenas um modelo de dados limpo e arrumado. A qualquer momento, o conteúdo da interface do usuário local precisa ser atualizado automaticamente (por exemplo, dependendo das alterações no comportamento do usuário ou alterações nas fontes de dados externas), o KO pode ser facilmente implementado para você e é muito fácil de manter.
1. Diagrama de relacionamento da categoria principal
Ii. Responsabilidades de classe
2.1. Observável (classe de objeto de monitoramento normal)
A implementação interna do observável (outras é uma função):
1. Declare primeiro um FN chamado Observable (pode ser considerado uma aula)
2. Adicione uma propriedade Ko Única LattValue para armazenar o valor passado pelo parâmetro
3. Se o atributo __proto__ nativo for suportado, use o HasownProperty para determinar se o atributo existe para herdar e julgar o código __proto__ (na classe Utils)
var canetProType = ({__proto__: []} instayof Array);
4. O método init do atributo FN de Ko.SubScribeable inicializa o observável (adiciona principalmente a assinatura e publica atributos relacionados)
5. Os observáveis herdam os atributos e métodos relacionados à observação do observável (Observablefn contém as estratégias de execução antes que as mudanças de valor e após a mudança do valor)
// Defina protótipo para observablesvar observablefn = {'EqualityComparer': valoresePrimitiveAndEqual, Peek: function () {retorna este [obserableLatestValue]; }, valueHasmutated: function () {this ['notifysubSubscripters'] (este [obserableLatestValue]); }, valueWillMutate: function () {this ['notifySubSccripters'] (this [ObservableLatestValue], 'beforeChange'); }};6. Retorne a implementação do método observável (se os parâmetros de entrada for definidos e se não houver parâmetro, ele está obtendo)
7. Esta classe também fornece hasprototipo (para determinar se a instância especificada possui essa propriedade), ISOBServable (para determinar se a instância especificada é um objeto de monitoramento), éWritableObservable (para determinar se é um objeto de monitoramento gravável).
2.2. ObservableArray (classe de monitoramento de matriz)
1. Primeiro, execute o método Ko.Observable para tornar seu objeto uma classe monitorável (resultado nomeado);
2. Em seguida, expanda o objeto FN em Ko.observableArray (FN da KO.OBSERVABLEARRAY reescreve os métodos de operação relacionados à matriz, como remover, empurrar etc.)
3. Estenda um método através do Extends (TrackArrayChanages, consulte 2.5 para obter detalhes)
4. Retorne o objeto de resultado estendido.
ko.observableArray = function (InitialValues) {InitialValues = InitialValues || []; if (typeof InitialValues! = 'Object' ||! ('Comprimento' em Values Inicial)) lançar um novo erro ("O argumento aprovado ao inicializar uma matriz observável deve ser uma matriz, ou nulo ou indefinido."); var result = Ko.Observable (InitialValues); KooB.Utils.SetProTypeOnExtendENDENDENDENDENDENDENDENDENDENDENDENHO (resultado); resultado.extend ({'trackArrayChanges': true});};2.3. Inscreva -se (assinando a classe de objeto)
1. Os módulos funcionais para assinatura e publicação são classes básicas essenciais para observável e obserablearray.
2. Existe um método subcribível aqui, que é usado para se inscrever no monitoramento de alterações de objetos. Para o desenvolvimento, você pode usar esse ponto de herança para entrar.
Inscreva -se: function (retorno de chamada, chamada de boneca, evento) {var self = this; event = event || defaultEvent; var boundCallback = callbackTarget? callback.bind (callbackTarget): retorno de chamada; var subcription = new ko.subscription (self, boundCallback, function () {ko.utils.arrayRemoveItem (self._subScriptions [event], assinatura); if (self.AfterSubScriptionRema). (Self.BeforesubScriptionAdd) self.beforesubScriptionAdd (Event); if (! self._subscriptions [event]) self._subscriptions [event] = []; self._subscriptions [Event] .push (assinatura); Return Subscription;}3.Extend: Este método é usado para adicionar a classe de extensão adicionada pelo método Extends (como a classe de extensão ObservableArray.CangeTracking)
4. O método da extensão da extensão será executado imediatamente após o registro do objeto de monitoramento. Os parâmetros passados são alvos (objeto atual) e opções (parâmetros passados quando a extensão é chamada)
5.Extend é o método para instalar a extensão e executará imediatamente o código na extensão.
2.4. estende (classe de objeto de monitoramento estendido)
1. Coleção de extensão padrão de KO
2. Forneça um método ApplyExtenders para instalar a extensão
função applyextenders (requestedextenders) {var destino = this; if (requestedextenders) {ko.utils.ObjectForEach (requestedextenders, function (key, value) {var extenderHandler = ko.Extenderler [key]; if (typeof extenderHandler == ';2.5. ObservableArray.CangeTracking (uma implementação específica do objeto de monitoramento estendido)
1. Essa extensão implementa principalmente o monitoramento das alterações da matriz e calcula as diferenças na matriz e desencadeia eventos de assinatura relacionados
2.CacheDifffForkNowoPeation: operações de cache em matrizes para comparação de diferenças
3. BEFORESUBCCRIÇÃOADD e AfterSubscriptionRemove As assinaturas relacionadas (ainda não são totalmente compreendidas).
O acima exposto é uma análise aprofundada da análise de código-fonte knockout introduzida pelo editor para você. Espero que seja útil para você. Se você tiver alguma dúvida, deixe -me uma mensagem e o editor responderá a você a tempo. Muito obrigado pelo seu apoio ao site wulin.com!