06_尚硅谷_Vue_计算属性之set与get

好，我们还有一个效果啊，一起说完啊，还有一个效果啊，什么效果呢？看前面都单向的，什么概念呢，你看我改它，它变吗是不变啊，不用管这个紧巴，包括下面的。他变吗？是不对，对不对，没有同步变化啊，那没有同步变化，我现在想实现同一个效果。上面变，下面跟着变，下面发生变化，上面也得变，这不双向改变吗？我想实现一个双向的改变。那这个时候。啊，如果啊，有两种做法，一种是用握起，一种是用计算属性，如果我要握起的话，你说我还要握起谁。我最终是不是要去改变他呀，对不，我是不是握起他的改变。好来啊，但是其实我们现在主体要讲另外一个东西啊，哪一个为model看着啊。我们取个名字叫三。

好，这一次我跟大家演示的是如何通过计算属性来去实现双向的一个效果。啊，如果一旦写计算属性，就没有必要在这里面写date了啊，直接写个它是吧，写了它之后看到这里啊，它的值不是一个函数，而是一个对象。这个对象呢，有两个方法。一个叫get。一个叫赛，而且写法固定，先把这个固定的写法先给他写一下。诶，是一个方法。可以吧，好，Get里面的写法怎么写的？跟这一个函数的写法是一模一样的。能没有看到英文而想get用来干嘛呢？啊，得到当前属性的值对吧，或者计算出当前属性值啊计算啊并返回。

当前属性的值。就这一个。而且它还是概念叫回调函数，前面我们说回调函数什么函数，回调函数。那三个条件赶紧说一下。回掉函数那三个描述。嗯。没做过吗？不可能的事啊。郑鹏。你声音从哪回来干嘛人呢？你干啥呢？你你说一下什么样函数是回调函数。你是在睡觉还是干嘛呀？对，是，前面肯定会说强调，反复强调过回调函数要满足三个条件。

每三个条件。因为这个很重要啊，我就不信没说过你定义的你没有掉。但最后他执行了。那肯定是要在某一个条件下，某一个时间段，某一个时间点才执行，对吧，而且回调函数并不是立即就执行，也不是说你定义了就马上执行，不是定义和执行是两是两步，对吧，先有定义后面才会执行是吧？那现在就说你说这一个函数。我掉了吗？没有是你定义的吧，最后他执行没有执行了，这就是一个回调函数。

啊OK，关于回调函数，你要知道两个事情，知道两个事啊，第一个事情。啊，什么时候掉。什么时候调用啊，第二个事情啊，第二是用来干嘛的，也就是说这个回调函数啊，这个回调函数执行的时候用来去做什么。就执行这个回单，最终干什么事？啊，譬如说。这个啊，先说这个吧，因为这个我们学过了是吧。这个什么时候掉。是不是已经说过啦？是吧，啊OK，初始化显示或者相关的对的属性发生变化的时候，改变发生了改变是不是要用，那好了，下面用来干嘛呀，做什么的呀。OK，做什么就决定了你里面要写什么代码。

是不是这意思干嘛？OK，不计算返并返回当前属性的值吗？自己怎么计算，那得看你到底是从哪里读啊，OK，这个啊，是计算并返回当前属性的值，而具体需要取first name last name中间又什么连，那就得看你了。啊。这个一定要清楚啊，关于计算属性啊，关于这个回调函数的。尤其是回调函数基本啊，什么是回调函数以及回调函数的作用。一定要在你脑子里面记得非常非常熟练，而且是你要是懂了，你不懂肯定是不行的。同时我也觉得这东西也并不并不难啊。好，下面我们来说get啊，Get它是一个回调函数，那我就要关注两个方面。

对吧，一个是啊，什么时候执行。啊，当我去读取啊，读取当前属性值，或者叫需要当前属性值的时候，哎。三需要读取当前属性值是回调，OK，用来干什么呢？计算并返回当前的属性值，至于根据什么来计算，那就看我当前的值跟谁有关系对不对？跟谁有关系。OK，也就是我根据什么计算，大家看看我再写详细点，根据相关的数据。这些相关的是什么数据，那就看你具体要根据谁来算了。我现在相关的数据是谁啊。First name和last name。对吧。

这个应该没问题了啊，那我当前需不需要得到当前的这个值。就需要吗？我一上来是不是要显示他吗？没问题，好下面一个。小明哥啊，这个这个也是回调函数，对不对，也是回调函数，那现在就问了，什么时候掉了。当。啊，属性值发生什么改变时回调。对吧，那我什么时候发生改变呢。我是不是在输入框里面输入这个数据就会发生改变，好了，那我在里面该干什么去了？更新相关的属性数据。谁是我相关的属性数据啊。For name和什么last name，那你现在应应该知道了，我在这里面该干嘛去对不对？我最终是不是要写this.for name啊，等于一个什么值啊。

对吧，啊，能看到吧，好，接着还有一个什么this时间last name等于一个什么值。对吧，关键这值从哪来的。是不是这一个是不是就我最新输入的数据啊，OK，这个value就是什么。Four几三的？最新属性值对不对。能不懂？好，那请问我怎么得到firstli？我这个输入值是不是由属性first name，空格last name组成，那我怎么办？什么空格对不对。是吧，接着我得到的是个数组啊，那我可以取个名字叫names。

可以，下面呢，你说names。中你，接着names中你。是吧？嗯，好啦，你再来看一下。看他初始化显示没问题吧，没问题，关键就是下面几个操作，首先正面变吧。变吧，好啊，注意我改变下面看上面改不改啊看这里。有没有看？有个，诶有人跟说老师这两个怎么也改了呢。对，因为上面改了，才导致这个中间两个。是这意思，你要关注的是啊，我改变这个输入框的数据上面会不会发生改变，对不对，能看到吧，应该能看懂啊。

那也就是说，我要实现一个双向的关联，是不是要给我的这个计算属性添加get和什么sat方法set用来干嘛呢？监视当前属性质的变化啊，这个要知道啊。嗯，OK。一定别说成什么设置了，你直接翻译，马上立马只要听到设置这两个字，你下面不用说了，它肯定会打到你，你不用说，你肯定不可能说对了。因为这个是监视，不是设置。没问题吧，好。其实呢，我们要去通过watch也能做这样类似的事，但是啊，用用那个计算属性，其实非常简单的事啊，挺好做的。好，最后还有一个，还有一个事情啊，还有一个事啊，说完就可以了，还有什么事吧，来看这里啊，我这里呢，来一个来一个就是P标签。

P标签来去显示一下。我铂金来一个，我来多个。大家要知道啊，我要显示first name必然要调用谁啊，First name不是first name啊，这个这four name1。没意思。大家知道一是不是通过调用这个方法来返回的。你想也就是说我要去读取这个值，是不是调用一次这个方法，那我现在要读几次了？三次对不对，按正常情况来说，应该把这个方法执行什么。三遍或者四遍了，你问下面三遍嘛，上面一遍嘛，不四遍了嘛，对不对。能看到吧，好，现在你来看。

刷新。什么意思，就一遍是吧，这要想实现一遍，你说让你设计应该怎么做，这怎么做到的。怎么就执行一遍呢？那后面再学。怎么办呀，那说明第一次肯定要肯定要计算吧，第一遍那是必然要算，你说函数必然的调用，调用完之后呢。下次为什么不掉了呀？对吧，你详细的显示没有。显示说明，显示说明书里有啊，对不对，那关键他没执行函数啊。怎么样才能做到我又能显示正确的数据？好了，我又不执行那个函数了。说明中间做了件事情了。干嘛？就缓存嘛。也就是说我计算一次调用那个函数以后，是不是得到一个结果啊，得到一个相当于得到一个A空格什么B这样一个结果。

他会把这个结果给他什么缓存起来。对吧，那缓存一下，下面又需要这个怎么。对吧，他是不是直接去取啊，那你说那个缓存用一个什么容器来存呢。大家觉得诶，这是大家如果大家能知道的话，说明我们前面讲的东西大家是懂的。用一个对象好了。对象我接着说那个值对象里面不k value吗？Value肯定是那个值，也就是A啊，空格B。关键我就要问大家。属性名用什么？属戏迷用什么？也就是说我存我缓存到容器里面去，存的肯定是那个那个值啊，因为我缓存那个值嘛，标识这个标识属就属性名嘛。用什么标识呢？

啊。大家得知道啊，我们就说白了，我去取的时候，我去显示它用的什么用的什么去取的嘛，那个不就是标识嘛。谁这是一嘛。说白了就是用这个表达式来作为。缓存的K对吧？A value是不是我存这个值，一旦你根据这个K，根据这个表的是去取值的时候，我先看缓存有没有。是吧，有没有，是不是得根据这个属性名去取属性值啊。如果能取出来说明什么？是不是有啊，有还要加函数吗？不用，那如果没有了。那就掉呗，掉了一次是不是就存进来呀？诶这个缓存的思想大家应该要是能够理解的啊。OK，就这个里面计算属性，它有一个概念叫缓存，因为这个呢是在面试中。

啊，容易问到的，只要问计算属性，必然会涉及到缓存这个事。因为这个呢是容易被忽略的。其实我们写东西对我们来说啊，没有任何的关系，就是他还不完成，好像对我们来说一点。对我们编码来说没有影响，能懂吧，但是对于效率有影响。这能理解吧，啊，OK，好。那这里面呢，我们就给大家去讲两个技术啊，一个叫计算属性，涉及到一个配置叫什么computing，还有一个啊叫监视，涉及到另外一个配置叫什么。Watch。啊，下面我这个用的少一些，计算手机用的特别多啊。好，最后给大家去说了一下啊，计算属性的一个非常重要的一个概念叫什么呢？缓存就多次读取只需要执行一次，什么呢？Get a这个地方有一个概念啊，有两个概念，一个叫get，一个叫set。

啊，这是两个概念，这个概念对应属性的什么呢？Get方法。而这概念对于什么呢？属性的set方法。能看到吧，这是为了交流取得一个概念而已啊，这不就是相当于一个是这个。一个这个能看到吧。嗯。行，那整个的就是这么多啊，行，大家先休息会，休息一会，下节课就开始啊，练一练。