58_尚硅谷_Vue_源码分析_数据绑定_Dep与Watcher之间的关系

啊，去研究它，研究这。我是要把这个好再说它就比较好说一点啊，因为这个东西，这个东西在哪呢？大家看到它是不是在compel里面去做的。哎，涉及到一个what，诶大家有见过what吧？啊，大家应该见过what，来看一下。啊，我先把这个里面的这个断点都给它去了。去掉啊过去好，我们来说一下在哪个里面有东西了，在compare里面，Compare里面我们主体任务干嘛去了。是不是编译模板对吧，在编译模板啊，编译模板的最后，大家看看我们编译模板的操作，是不是最后都会执行这个办的。但有一个东西不会进入，这里面就四件指令。就是我们在编译事件指令的时候会调用B吗？

不会，因为编译事件指令最终是执行它绑定监听，对不但是我编译别的指令，一般指令或者是大卦表达是都会经过这个什么。Band band最先前面做了个什么事情？是不是更新我的节点去。让节点能显示一个数据对吧。显示完了以后呢。创建了一个什么？是不是创建了一个我。我选的什么意思？是不是监隙观察者监隙好监视器监视谁，关键就是对吧监视谁。前面的这个我们实现了是不是指令或者表大化表达式的，是不是初始化显示。那后面就有一个什么，是不是它们所对应的更新显示，哎，这个就是用来实现更新显示的监视。

溜了一个，我想就了一个观察者，或者叫间隙里面看传了些什么，首先VM这没什么是吧，好，关键来了。这是什么表达式？那也就是说在页面里面呢，或者在模板里面的每一个表达式。都有一个对应的什么监视器，那说白了监视器监视谁。是不是监视他呀，相当于对不，也就是说我这个监视器得知道你什么时候需要更新吧。能懂吗？啊OK，这要有一个对应关系啊，我的我是跟我的表达式是对应的。但是表达式有两种来源，一种是大括号表达式，一种是指令的表达式。是这意思吗？啊，有两个来源啊，好，下面有一个回调函数，大家可以理解一下这个回调函数。回调函数我们说过有两个问题要研究哪两个问题？所有的回调函数都要关注两个问题。

哪两个问题？所有的回调函数都有两个问题需要你搞明白哪两个。毁掉函数。啊，这不跟事件明显关系了，回调函数需要关注两个点，哪两个点。是不是说了好多遍了，回调函数需要关注哪两个点？回调函数是你调的吗？不是，那你得知道什么就什么时候来调，因为不是你在执行，不是你在亲自调用，所以说你必须得知道回调函数什么时候调。能懂吧，还有一个它调用它是干嘛去的，就是这个回调函数应该做个什么事情。再次强调一遍啊，回调函数我们需要知道几个式，如果再说就需要知道，还要知道回调函数的意思是谁。听懂吗？啊，如果说多就三个点啊看。

什么时候料用来做什么？This是谁啊？有的时候呢，可能不关注this，譬如这个就没有关注this，对吧？所以我们知道这两个好，大家看一下这个函数，自己通过自己的一些经验，你自己学现有学的东西，你就要去想这个方法用来干嘛，你可以看一下。更新什么？是不是更新某一个节点，说白了是更新界面去了。是吧，那你说它什么时候掉啊。这一个是不是就更新界面去了，我们前面说过更新界面我只需要更新什么呀数据。那也就是说它什么时候掉数据变了就掉对吧，那现在假设啊，大家知道啊，这个里面是不是这回函数不是对应一个表达式啊。数据变可以一定掉吗？

譬如说我有两个数据A跟B，我的界面里面就有一个表达式A对吧？我去改变B第二吗？不调。对吧，所以更新什么数据就会掉了，哎，就是更啊去更新这个表达式所对应的数据，比如说表达式C，那就根据A吧，那如果表达是a.B了。那更新什么就会掉啊，我的表达是a.B那我更新A不掉吗？对啊，你说你说说B，那也不太完全对，对不对。那不懂啊，如果是a.B无论你是更新A还是更新B，那它都得掉。是这意思吧，啊OK。好，这个地方再说一遍，我们这个函数什么时候执行当我的表达式所对应的属性数据。

表达式，一个表达式是不是对应一些属性一个或者多个？譬如说我是a.B对应几个属性，两个，一个A，一个B。对应的属性发生变化的时候，我的这个回调函数是不是就应该执行？自行干嘛去？更新啊，我的这个对应的节点的内容对吧，更新界面我叫更新对应的啊界面的元素是吧。能不能或者叫节点。因为有可能是一个元素，也可能是文本节点，对吧。先要搞清楚啊，至于怎么做到的，那是另外一回事，你先要知道结果，对结果有了一个预测以后，你再去看，就有一个目标啊，OK，好，那也就是说我们在这里面打一个断点。

是吧，打个断点，那他在解析什么时候会执行呢？看一下。在做什么事情的时候会执行到这里来，我们需要一个预测呀，有个推测呀，哪个这一个。对吧，解析它的时候会不会过来。不会，为什么，它是世界之林。对吧，是一个世界之地。能看懂不？哎，好，那如果说我这里面。再写一个啊，We tax。内，哎这个地方，哎不是正确啊，错了正。对吧，进不进是不是也进了啊，也一样的，对不对，无论是大括号表达式还是这个一般指令他都进来吧。好，当前我肯定只写了一个是吧，来我们来看，我们现在写两个，我刷一下啊，刷一下再说，那就应该。

看我们看一下进的次数，一次是不是又来了一次。能看懂啊，OK，好。来，那下面呢，我们就来看一下啊看一下。看一下我new了这个water啊new water内部到底在做什么呢？我们可以进去看一下，稍微的看一下记录。他CB什么东西啊。Call back。回调函数。啊，回调函数cb back的意思，保存一下，保存一下VM，保存一下什么表达式。啊，诶，这个地方又有一个有一个对象啊，什么deep ids。S，我们前面说过一般的数组，但它这里是什么对象啊，注意它这里面是一个对象。

好，接着去取一下this点什么呢？Get，那this get是干嘛去的呢？来看一下，进去看一下。哎，这个地方就又要涉及到我们那个deep了。啊，所以现在啊，我们不去看待deep了，都不太合适了，这个地呢，我们得稍微有一个理解啊，OK，来。我们看一下，看一下那个deep，它到底是个什么东西啊。这个力来构成函数吧，它自身有一个什么ID，而且每一创建ID都是什么加一。是吧，啊OK，说明ID是这个地方的什么标识属性对不对，这个标识吗？从几开始啊就。从零开始，因为佳佳在后面嘛，是吧，好接着有一个什么呢？z.sub等于一个空数组，这个sub它是一个什么样的一个意思呢？它是一个简写啊，是subscribe的意思，还记得subscribe吧，订阅或者subscribe订阅者。

啊，它这里面是订阅者，那订阅者加S什么意思。是不是多个订阅者？多个订阅者的一个什么数组？这个怎么能懂，也就是说我这个地里面是不是有多个订阅者的一个数组，什么叫订阅者啊，其实这个订阅者有的类似于监听。有一点类似于监听，我还告诉大家一个结果，这个里面每一个都放了什么呢？都放的是what。监视器。都是一个watch。

啊，OK，前面我们说过一个事来啊，我得去写，来个TT啊，有些东西得写一写啊，写一写，列在这上面，一点一点积点就能看得出来，首先我们要研究的两个东西啊，现在重点是两个东西，其实把这两个东西研究明白就好了。再一个什么呢，Water water来。先来说一下这一个对象什么时候创建。哎，不用不用这个啊。用这种打开方式一点一点搞，因为这个是这里面最难的一个东西啊，因为关系比较复杂。这个里面啊，我的这个地啊，我的这个deep对象啊，他的对象他的实力什么时候创业对吧，我们来看一下。来啊，找一下他的这个实力什么时候创建呢？在这里前面我们简单说一下，在这。

是不是来？我要问大家，现在你说我们这一个对象什么时候创建的，首先整体的时机是在初始化的时候创建呢，还是更新的创建，大的时间是一个什么样的时间段？你就得想嘛，我们的这个方法给数据结实。属性是在什么时候，是在初始化还是更新啊，初始化过程中啊，我们前面做的准备工作吗？就我们前面是不是会去六这个去启动监设。对吧，而且我们后面会一句6COMP对吧？啊是在初始化，首先这是大的方面啊，先说大的方面在初始化的什么时候呢。啊啊监视，或者给date中。

对它的属性啊实施。啊嗯，进行什么术语劫持劫词。哎解劫持是劫持是创建的对吧。能不能看到啊，也就是说我们再去所说的对数据进行结识，就是给它添加set方法嘛。对吧，给这个属性添加赛来网，而且还要说啊创建多少个了。对不啊，就是个数的问题。有人说老师一个两个三个，这个肯定没法定是到几个，关键它的个子跟谁有关系，对吧？哎。与date中的属性一一什么对应？那么懂与date中的属性是一一对应的关系。

要搞清楚这些问题都很关键啊，只要把这个问题搞清楚，后面就好了。那也就是说啊，这个地方我有一个date中啊，譬如说举个例子吧，我就问咱现在。有几个地？你告诉我。啊，有几个地方。我们说过前面说过，我们会对所有层次的属性都会进行截止是吧？是这意思吧，我们不是所有层次的属性吗？对不对，所有层次的属性都会进行结食，那要想节食是必须调用这个方法才能结食啊。对不对，好调这个话就会六一个什么D，那我们一共几个四个。

能理解吧，啊OK，咱一点一点的磨啊。好，那来下面。下面啊，继续，而每一个water里面是个什么结构啊，这个deep里面是什么结构，要说一下deep的结构，Deep的结构它是不是两个属性。对吧，一个是ID是标识啊名称。标识就写个标识吧，其实它是个数值吧，012345嘛，那也就是说，哎，现在有个问题了。他们一是对应的标号ID是多少呢？啊，这个挺有意思啊，这个要说一说啊，他先拿到内，接着拿到外是吧？外里面是不是有name和age啊，那现在我们就要去看一下。

说谁最先先变成谁内，那也就是说内姆的ID是几零？没问题吧，没问题，那接着变成到谁了。外辅吧，那变离的外辅是不是先为它创建一个对应的地方，那就说外辅的ID是一一。是不是意思好，接着我又去对我的它的value是不是进行结石进行观察。那也就是说后面依次。他的ID是零，他的ID是一，他的ID是二，他的ID是吧？是。大概能懂吧，啊，OK，好。好了啊。那下面。啊，下面我们就可以，我们实际上是这个事情可以看一看啊，就是一点一点看，这东西是确实有点小麻烦，得一点一点的给它过去。

啊，先让他过去啊，过去以后呢，我在这。我在我的observe这里。打个断点没刷一下就能知道啊，看到第一个啊，先是未遂。看到吗？他的是一，你好，再走一个。减外部，它的是以一。而最先开始的时候，他们这个SS这个数组里面是不是什么都没有啊，后面才能添加啊，好继续。接着啊，内哪一个里面name，外里面的name。认了，不外里面会分二嘛，好接着它的ID什么二是不是一是最后一个是什么ID是三，对应的是什么A。

没问题吧，啊，要没问题啊好。这是这一个。啊，这一个，那另外有一个啊，另外一个事情啊，另外一个事情，我们现在来去看，另外一个就是这个watch啊，先研究一下他们各自再把他们关系给梳理一下就好了，还是一样，他的实力什么时候创建。首先是在初始化还是在更新？对不来，我们来看一下，我们前面说过，这个water的创建是在compare的这个里面创建的，Compare的这个执行编译是在什么阶段。更新这怎么可能呢，我们现在在编译解析指令解析表达式初始化嘛，只是说回调函数后面是在更新的阶段，对吧，New是不是前面的准备工作呀，啊，OK，来。

停下。什么时候呢，在初始化的什么时候做了。编译或者叫解析对吧，解析解析什么。模板对吧，是。或者解析表达式吧，啊解析其实两种，一种是大括号表达式，还有一种是什么一般指令对吧，是是不是创建。那也就是说他他跟我们的。什么对应呢？就是个数的问题。啊，这个个数它到底多少个呢？看什么呢？哎呀，它也不固定啊，就是动态的确定与什么对应，哎，对与表达式的个数对应模板中。表达式的个数。

一表达式一对一嘛，但是这个有一种表达式要排除。事件之力非是吧，四件之力啊，就是非事件之力啊，四件之力啊，就四件指令排除吧，啊事件主令。包含四这里，这能不能懂。啊，OK，那我就要问大家了啊，我要问大家假设。啊，我想了现在啊，现在我们来看一看，首先我刚才问过了，我们的deep有多少个。1234对吧，那现在我们的五层有多少个。你看吧。大块表时两个什么一般指令，这个事件指令是不排除啊，几个三个嘛。

这个一定要看懂，先看懂这些基本的问题，咱再研究他们之间的关系。好，接着再说，它也有自己的一个什么呢，结构。啊，我的结构啊好，但它的结构就相当于麻烦一点啊，大家看一下它的结构。里面好一些是吧，OK，这里面都拿过来。好，这个结构倒其实看的多啊，倒并并不说是说特别复杂啊，一个一个看，首先这一个是什么回调用于什么，用于什么的回调，用于更新界面的什么回调。对吧，那当需要调用的时候，是不是采取调用。

这个没什么好说的，谁VM这个也不用解释啊，这个什么表达式啊，对应的表达式，我们刚刚说过了，我者跟谁的。表达四对对吧，好这一个。这是啊，相关的啊，N个地的容器定下。能看到不好，诶刚才有一个没说啊，这里还有一个属性的。N个相关的我对象的容器好，那也就是说它们是不是有一个相互引用关系的容器。

能看到吧，只是一个用的是数组，它是用的数组。能看懂吧，而它下面用的什么对象。用数组还是用对象，它是有讲究的啊，有讲究后面我们再慢慢看这一个得到的是什么呢？当前当前啊，表达式所表达式所表达是对应的什么value，一个表达式是不是一个值啊，它把这个以前的值线值给它相成什么存起来。你只有存了才能知道到时候改有没有改成新的。能懂吧，好。那下面我们就要去啊，分析一下啊，是怎么回事了啊，大家想啊，大家现在就要想一下啊，想一个事情好，现在我做一件事，我做一件什么事，我做一件vm.name等于一个新的值啊，假设等于ABC，看看是个怎么回事啊。

我这一改，导致于导致于谁变化了。是不是date中的什么变化了，Name属性质变化了对吧？而内属性质变化导致于啊，谁知道了。啊，大家看，那还能最终踩到我起，我跟你说。啊，谁在去知道这个data的变化啊，我们每一个name属性是不是都有一个啊，都有一个对应的set方法。是吧，啊，就name的什么啊，Name的side知道了。啊，调用是这意思吧，啊调用，那你看它调用它干嘛去了，我们来看一下了啊，这个很关键，看一下。

前面呢，其实你都可以不用看，你就看它就行。也就是说先谁知道了呀，哎，对，地婆知道了。啊，那也就是说现在啊，接着得到控制的是谁deep是吧，因为我的deep跟谁一一对应。跟属性名是不是一一对应的是吧，跟属性名一对应，也就是说我这个name啊，一旦变化了，是不是会通知得去对应的地方好。那deep看一下，Deep通水句，我们来看一下结果线啊，来这里面一个楼梯。你看它this.subs我们说这个subs是watch，相当watch对不对？抱一起，Sub一个个，我起了什么意思？下面通知谁去？

通知谁去，是不是通知所有相关的，我想。啊，工资啊，所有相关的吧，啊相关的所有我是吧，啊相关的所有我想呃，What，那下一步我要看谁去。看谁的update方法。谁的谁的update的方法，关键我去哪个文件去看了water对很好water，那water它是不是有一个update的方法，我们来看一下里面是不是调用run，调用run里面啊重点其他的那那句话都不用看，就看最后一句话。Z减CBCB是什么？是不是更新界面的回调函数啊，终于到头了是吧？啊，OK，现在是不是通知就相当于调用这个回调函数去变行界面去。

那也就是说这个watch啊，去调用回调函数去更新界面，调用CB嘛，对吧，而CB里面实际上是调用谁去的更新界面。还记得要想跟界面的调用水的方法啊，我们有一个有一个人的方法非常重要吗？谁知。看了吧，Our date。啊，其实啊，我刚才写的这个流程，咱如果用一个箭头来去说的话。我一旦变化了数据，Set是不是先知道了set，知道以后通知谁去deep，而deep通知谁去我，而我调用水去更新update？对吧，其实这个还好说啊，这个其实不算最难的，最难的是这个。

就他们的关系，我又我现在还没有分析他们的关系怎么建立呢。对吧，我们只是现在你看到我们只是说说了一些东西，他他个他自己有什么特点是吧，他有什么东西。那现在有问题了，就是deep与什么water啊之间的关系，就是这里有两个问题啊，一个是什么关系，到底是什么关系，对吧，什么样的关系，还有一个这个关系是如何建立的。能理解吧？OK啊，这个关系啊，这个关系是什么关系倒好说，我就说一下结果就行了，重点在于这个结果是怎么样产生的。他们有，大家知道啊，事物与事物之间关系就这几种。啊，一个事物与另外一个事物的关系一对一。

一对多。对吧，这个N就代表多啊多对，一再整合起来就多得多。比如说。比如说啊，你跟你父母的关系。是什么一对一对吧，啊不是，那跟你不能说父母是吧，跟你父亲对吧，啊，你不能说父母啊，父母就包含两个吧，是吧。好，有的呢，有的事物它是纯粹的是一对一的关系，不懂啊，但是啊，但是有的事物是一对多的关系。啊，一对多的关系，那一对多的关系怎么理解呢？譬如说啊，譬如说站在我的角度啊，我现在我就教一个班，对吧，我我跟你们就是一对多的关系。这个能看到吧，能不能能，那譬如说再说一个你啊，站在你的角度啊，站在你的角度，你一个人是不是有多个老师教过你，那就什么。

站在你的角度是什么一对多对吧，难道不？好，那有没有多的一的情况。啊，如果看整体，如果看整体所有的学生，我站在我的角度，我我我就跟你们去比的话，大家想啊，我跟你们要我看到我的角度是不是一对多呀，我但是你们觉得你们是很多学生对应我吧，不去考，先去假设我就一直从头带到尾那种感觉，对吧，如果我一直从头到到尾是这意思吧，好，那但是实际情况不是从头到到尾啊，对不对。那如果是学生跟老师之间什么关系？学生跟老师之间，因为是多个老师嘛，对吧，能不能听懂，这是多个老师对应多个学生嘛。

能不能听懂啊，其实多得多是怎么产生的？就两个方向的什么一对多。能能不懂，其实说白了就是两他们两者是么？是不是合并产生的结果就双向一对多，或者双向多对一，产生的一个结果就是最终就是什么多对多，其实我们的这个deep跟我就是一个什么呢。多对多的关系。多等于多的关系怎么理解啊，大家看啊，怎么想呢？大家想啊，譬如说举个例子啊，我们的这个地假设我有一个类。我的有一个类目属性嘛。Name属性，那一个name属性是不是就对应一个地。

李。美女吧，好，那这一个deep会对应多少个what呢？也不可能多多个。有没有可能要怎么情况下对应多个，你要告诉我。那它就对应N个我这N个是可能一个可能多个，也可能是零个对吧？好，那什么情况下就对应多个我，你要说出一种情况。啊OK，大家想想看啊，就是举个例子，我在模板里面啊，我在模板里面写了两次这个表达式。或者说我写一次这个写一次啊we。等于name。能不能？看着吧，啊，OK。也就是说现在来说啊，现在来说啊，我们一个name就对一个地方嘛。

是吧，而一个地方对应N的我，那什么时候我的这个N是大于一的。啊，怎么说。也就是说就是呃表这个属性在模板中多次备什么使用，在模板中多次被什么使用。能不懂这能理解吧，好，那下面我们来从另外一个方向看，另外一个方向方啊，我们一个表达式对应一个什么。对应一个什么东西，一个表示对应一个什么东西，对应一个water嘛，对吧，那一个water。那又对应几个地图呢？

啊，如果是多对多的关系，是不是应该对N个对吧，N个地方为什么时候这个N是多个呢。什么时候是多个呢？大侠举例子，你得举例子，譬如说我的表达式。是A。我的这个表达式就是A，那是不是对应一个我首先，而这个我相关的地几个。为什么是一个，因为就一个A嘛，那什么时候是多个呢？你得举一个例子出来就好办了啊，假设我a.B。对吧，a.B首先a.B这个表达式对应几个窝小，一个窝起一个表达式永远只对应一个我小，对不对？但是它是不是包含有两个属性了，那两个属性就对应什么，从两个地回啊。

是这意思，不，那也就是说最终的结果是不是一个我小对应两个地方，你说老师我能不能对应三个地方？可不可以，可以，那说明什么？三层的表达式。是不是这概念？那也就是说，你在想什么时候地是多个呀。多层表达式对。能不能看懂就是一个多层的表达式。这个有点小难度啊，OK，其实你搞清楚就行，你一定要最好是能够去自己举例子，想出来，分析出来，你不能完全靠背啊，靠背那你绝对不行。一定要想清楚什么时候是多个啊，OK。那啊这样。

啊，OK，假设我们的表达式啊，我们就写一个啊啊嗯，如果是name目的话，这里面P就写表达式。这个地方啊，再把这个再强调一遍啊，我们的一个属性啊，属性就写个属性嘛，啊，或者叫date属性是吧？啊date一个date属性对应一个什么deep，一个deep呢，对应什么N个water。啊，等于N的我小，而这个N什么时候大于一呢？啊，这一个属性在模板中被什么多次使用到，也就是说有多个表达式用到了这个属性。对不对啊，模板中有什么多个表达式使用了。是属性是不是这意思，你想想看嘛，多个表达是不对应多个我吗？

是不是这概念啊，好，下面那一个模板中的表达式对应一个什么。我那一个watch了，等于什么？N个地，那什么时候N是大于一了？是吧？OK，我的那个表达式是什么？多层的表达式，举个例子就是比如说a.b.c这是三层的吧，那也就是说这个N应该等于几三？对吧，啊，如果这个要说举个例子的话，譬如说我们有这样一个表达式叫内是吧啊或者叫A吧，直接写一个都行啊，没关系。A，现在ins赛是吧，好，这个里面，比如说假设我这里面呢，有一个A，这是一个吧，这就对应一个了呗，好比如说我再来一个V-T的也等于什么，哎，那此时我们就应该是几个。

两个对吧，嗯，没什么问题啊，这是这个关系呢，咱都已经知道了。难截断代，我们后面他是如何去把关系给他什么建立起来，其实后面就还好，你只要把关系确定以后，我们就针对这个目标去看。就应该问题不大了。这个需要大家自己下去你也分析一下，你就光听我说不行，你自己根据实际习惯来看一看，过来我们先休息会，再把这个给看一看就差不多了。嗯。