00:00
哈喽,大家好。这个小节呢,我们来模拟实现一下Excel的制造过程。啊,因为光去说,你很难理解和记忆它的制造过程和一个技巧。所以说我们亲自来实践一下。首先呢,我们需要一个构造函数。然后exce。它呢接受一个参数。是一个配置对象。我们可以在里边做一个初始化啊。this.defaults。Default。等于一个config。这个呢,是为了去创建default。那个默认属性。还一个呢,是this.intercept。Intercept。OK,然后等于这里边是一个对象。啊,里边有两个,一个是request,一个呢是response。
01:03
这里其实是一个intercept式的实例啊,我这呢为了方便就不再去写那个,那样的话就增加这个结构的复杂性了,我就把它先先把这个结构写到这儿。然后呢,我们还要再做一个事情,就是。原型上面需要添加方法。原型。添加。相关的方法。access.pro.request。等于一个function。啊,这块也是一样。好,我们可以呢,在这去做一个文字的,就是做一个输出的一个说明。发送啊价格式请求。搞定。当然除了这个之外呢,还有一些别的啊,包括这个get。还有呢,Post。等等等等一些方法。那么这些方法呢,他们也可以发送啊加格线球。
02:01
其实在这儿他们为他们能发送贾克斯请求的原因呢,就在于他们内部调用了request的方法。一起来给大家看一下。点开exile。啊,这个够,这个核心文件这。把它折起来。看下边这。大家看着啊,Get delete head方法往这放,它内部是掉了request方法。所以说呢,他们也能够发送请求,而其原理就是因为掉了request方法。那好,既然这样的话,我们也是一样,Return this.request。Config。啊,当然了,这个位置也是如此。啊,然后完成。好了,那完成之后,为了区分开啊,咱这样来做吧。我往里边呢,加加一些东西做一些识别,比如说method等于get。
03:00
这个位置呢。来一个method等于一个post。但是区分开嘛,对不对,发送阿贾克斯请求,然后呢,请求的类型。请求的类型为。类型为。好,加上config.method。这样的话咱们也好区分。好了,那完成之后他呢。这个构造函数的整体结构就已经搭建完毕了啊,接下来开始。声明一个函数。Function create instance。这里呢,它也是接受一样啊,接受一个参数啊,Config配置对象。里边的第一步要做的就是实例化一个对象。啊,怎么实例化呢?这个简单啊,Let,因此let这个context等于new的exce,把config传进来。我为了让大家看的清楚一些啊,咱把代码往折一折,折一折,折一折得能看到这个Excel这个构造函数。
04:07
那么此时你想,Contacts这个对象身上就有了defaul intercept。并且原型上面呢,有这些东西,它也可以去调用啊,调request,调get,调post。好了,这是第一步,实例化一个对象。所以说他此时就能够。家具使用。但是它不能,但是呢,不能当做函数使用。也就是说,你不能这么玩。这个是不行的。啊,这是不行的,好,接下来咱们看往下往下继续啊,接下来的话,我们去创建请求对象函数啊,请请求函数啊。来一个let instance等于。这个ce.pro type.request。
05:01
然后呢,我用B来实现。我们不使用它这套啊,它这个方式是这样子的,就是用了一下半的函数,那个函数是他自个儿封装的,一起来看一看,然后点开。啊,在这儿。啊,然后。大家看这。它是BY的函数。其作用。与我们的函数对象函数原型上面的BY作用是一样的。好,那么此时你想instance就已经是一个函数了。并且。可以干嘛可以呢?去调用instance,然后往里边传对象,这就可以发请求了。对吧,就可以拿去调里边的代码了。OK。但是呢,这个instance不能当对象使。啊,此时。斯坦。不能当做。啊,对象使用。啊,这样说其实不是很准确啊,不能这样使用instance。
06:02
点get.post这个他用不了。所以为了能够让他去用。我们现在就要将。excel.pro type。对象中的方法。添加到instance。这个函数对象中。所以说我们可以怎么办呢?我们就可以对他做一个便利。怎么个便利法呢?咱可以这样来做啊,object.values。括弧把excel.pro拿进来。这样一来呢,哎,咱们就把它这个键啊键键键键什么呀键呀,咱们这样子吧,把K拿过来吧。别拿直了,把剑拿过来。拿过来见之后,此时它的结果就是request get和post。这三个属性。然后接下来咱们for each遍历一下。啊,咱们这写一个K。
07:01
Log输出一下。这块呢,可能有点绕不过来了啊,咱们需要呢,做一个测试,演示一下let Excel等于一个create instance。然后传递一个对象进来,Method等于一个get。保存。咱们来看看他的一个输出结果是怎样的。好,然后呢,我把上面这个咱们先注掉,抱歉。打开浏览器验证一下。刷新点开它。你看这request get post就来了。来了,那下一步我们就要往他身上去放。怎么个放法呢?咱可以这样来做啊,Instance下标K。就应该等于excel.pro type,然后后边跟上这个K。但是这个时候呢,它有个小的瑕疵啊,注意啊,这个时候其实咱们已经加成功了啊,不行的话,咱们可以在这输出一下。
08:00
Log打印一下这个instance。保存切过来刷新里面,你看这。等一下啊,这个这个instance咱们看的不清楚,咱们来个dar输出,你瞅一眼。点开它。You get you post your request。就有了,但是呢,这个函数啊,在叫的时候呢,它可能。就是不能指向咱们指向到这个实力对象身上。所以说呢,为了更加严谨一些,咱们给他来一个bad。给他绑到这个context的上边。这样一来呢,你的get post request方法在调的时候呢,你内部的this指向始终是指向这个实例对象的。所以说你可以使用什么?this.default。啊,然后呢,this.intercept。上就可以来获取到这些属性。其实呢,你要是。直接去用的话,比方说点点post,它默认也是指向那个实例对象的。
09:02
啊,不过为了保险严谨一些,咱们这样来做一下。好了,那么这一步在完成之后。咱这个Excel,它就是这个instance啊,它就既可以当函数,又可以当对象。但是呢,这个instance上面还缺点东西。啊来来来,再看一眼啊,没看完。然后拿过来刷新页面。换D。刷新页面。注意啊,这个对象啊。他最后是要。去跟这个Excel齐平的。也就是说,它其实就是X。那他身上还缺两个属性,一个呢,是default。啊,一个呢是intercept他没有啊。对吧,这哥们他没有,所以说咱们再来一下。啊,怎么来一下呢,就是为他。为instance in。
10:00
这个函数对象。添加属性defaults,还有呢,这个intercept。那么怎么添加呢?简单,我们对它做一个便利。啊,咱们可以对它去做一个便利,好也是一样,object.case。然后下边。啊,把context放进来。啊,放进来之后下边也是一样啊,直接for each。然后K拿过来。输出一下看看它的内容。保存。切过来,刷新页面,瞅一眼,你看a intercepts就来了。啊,没有问题。那没有问题之后呢,下边咱们就开始呢,进行一个复制。啊,进行一个赋值啊,然后来一个instance下标K就应该等于。啊,等于谁啊等于这个实例对象上面那个值。
11:01
好,然后下边来一个呃,中括号K。这样的话,它就与最终的Excel的结构就一模一样了。来看一下。保存,切过来刷新一面啊,大家D看一眼。Default get post intercepts就都有了。都有了啊好了,那么有了之后的话,最后就只需要做一件事情,那就是干嘛return完成。Instance。然后刷新们瞅一眼啊,最后的话在这咱就可以发送发送请求了啊。然后create。调完它之后调request。点开它。这有一个小瑕疵,什么瑕疵呢?就是我们掉了它之后啊,咱们只是创建了对象,所谓啊,咱们还没有去发送请求呢。哦,发送群要试一试Excel,首先来说。
12:00
他可以呢,直接去。呃,咱们这传也行,其实不传也行啊,咱们这先不传了吧。啊,这不传的话。然后这个地方的话就是一个unDeFined。啊,没关系啊,咱们尽量话在这穿。Method冒号I get。看看能不能当函数去使。切过来看这。发送了阿贾克斯请求,请求类型为get。换成POS试一下。切过来刷新页面,你看有没有问题。好,然后呢,咱们还可以当函数去使,当对象去使excel.get。也可以往里边传菜。切过来看这get的请求没有问题。再来把post放过来。切过来刷新一边。完成。这样来的话呢,我们就成功的模拟实现了整个Excel的创建过程。它既可以呢当函数去使,又可以呢啊,当做对象调方法去使。
13:01
好了,这条街我们就先到这儿。
我来说两句