什么是淘汰赛。

淘汰赛是一个优秀的JavaScript库，只需要使用一个清晰整洁的底层数据模型，就可以帮助你创建一个具有丰富文本和良好显示编辑功能的用户界面。每当你的本地UI内容需要自动更新时(例如，取决于用户行为的变化或外部数据源的变化)，KO可以很容易地为你实现，并且非常容易维护。

一、主类图

二、班级职责

2.1、可观察(通用监控对象类)

可观察的内部实现(其他是功能):

1.首先声明一个称为可观察的fn(这可以说是一个类)

2.添加一个ko唯一的latestValue属性来存储参数传入的值

3.如果支持原生__proto__属性，则通过使用hasOwnProperty判断该属性是否存在来继承，并判断__proto__代码(在utils类中)

var canSetPrototype=({ _ _ proto _ _ :[]} instance of Array)；

4.ko的fn属性的初始化方法。subscribable初始化可观察的(主要添加订阅和发布相关的属性)

5 . observatory继承了observatolbenn的相关属性和方法(observatolbenn包括值变化前后的观察执行策略)

//为observable var observableFn={ ' equality comparer ' : values sareprimitiveandequl，peek: function() {返回此[observableatestvalue]；}，valueHasMutated:函数(){ this[' notifySubscribers '](this[observableatestvalue])；}，valueWillMutate:函数(){ this[' notifySubscribers '](this[observableLatestValue]，' before change ')；}};6.返回可观察方法的实现(如果设置了传入参数，如果没有获得参数)

7.这个类还提供了hasPrototype(判断指定的实例是否有这个属性)、isObservable(判断指定的实例是否是被监控对象)和isWriteableObservable(是否是可写的被监控对象)。

2.2，observableArray(阵列监控对象类)

1.首先执行ko.observable方法，使其对象成为一个可监控的类(命名结果)；

2.然后在ko.observableArray中扩展fn对象(ko . observablearray的fn会覆盖数组相关的操作方法，比如remove、push等。)

3.通过extends扩展方法(trackArrayChanages，详见2.5)

4.返回扩展结果对象。

ko . observablearray=function(initial values){ initial values=initial values | |[]；initialValues的类型！='object' ||！(“initialValues”中的“length”)引发新错误(‘初始化可观察数组时传递的参数必须是数组，或者为空，或者未定义。’);var结果=ko . observable(initial values)；ko . utils . set rototypeofrextend(结果，ko . observablearray[' fn '])；返回result . extend({ ' trackarrychanges ' : true })；};2.3.可订阅(订阅对象类)

1.实现订阅和发布的功能模块是可观察和可观察数组必不可少的基类

2.有一个subscribe方法，用来订阅监控对象变化的界面，开发可以以此为切入点

subscribe:函数(回调、callbackTarget、事件){ var self=thisevent=event | | defaultEventvar boundCallback=callbackTarget？callback . bind(callbackTarget):回调；var subscription=new ko . subscription(self，boundCallback，function(){ ko . utils . ArrayremoveItem(self。_ subscriptions[事件]，订阅)；if(self . after subscription remove)self . after subscription remove(event)；});if(self . BeforeSubscriptionAdd)self . BeforeSubscriptionAdd(event)；if(！自我。_subscriptions[event])。_ subscriptions[event]=[]；自我。_订阅[事件]。推送(订阅)；返回订阅；}3.extend:此方法用于添加extends方法添加的扩展类(如observableArray.changeTracking扩展类)

4.4.extend扩展方法将在被监控对象注册后立即执行，传入的参数是target(当前对象)和Options(调用扩展时传入的参数)

5.extend是安装扩展的方式，它会立即执行扩展中的代码。

2.4，扩展(扩展监控对象类)

1.ko默认扩展集

2.提供一个applyExtenders方法来安装扩展

函数applyExtenders(requestedExtenders){ var target=this；if(requestedExtenders){ ko . utils . objectforeach(requestedExtenders，function(key，value){ var extender handler=ko . extenders[key]；if(type of extender handler==' function '){ target=extender handler(target，value)| | target；}});}返回目标；}2.5.observableArray.changeTracking(扩展被监控对象的具体实现)

1.该扩展主要监控数组变化，然后计算数组差异并触发相关的订阅事件

2.cacheDiffForKnownOperation:对数组进行缓存操作以进行差异比较

3.beforeSubscriptionAdd和afterSubscriptionRemove相关订阅(功能不完全理解)。

以上是边肖介绍的淘汰赛源代码深度分析的订阅，希望对大家有所帮助。如果你有任何问题，请给我留言，边肖会及时回复你。非常感谢您对我们网站的支持！