00:01
好在刚才的这个视频讲解当中啊,我们把这个纯盗墓法给大家介绍清楚了啊,纯盗墓法呢,呃,实际上是非常非常呆萌啊,非常的笨拙,没有任何实战价值啊,很笨。那么呃,现在呢,我们就来给大家介绍一下数组的照应法,数组是有一个照应方法啊,那么数组的照应出来什么呢?出来字符串对吧?咱们大家知道数组如果给它校引出来的话呢,那么最后的结果呢,是字符串啊,那实际上数组join应法的本质呢,就是字符串,哎,我们来看一下到底是怎么回事啊。嗯,咱们来看一下零二啊,咱们把这个先把这个复制一下,这个名字叫零二。好,然后叫诶啊没复制成功啊,那咱们直接打啊,叫数据变为视图杠啊,数组join引法。点HTML啊。
01:02
OK,那么在这样子的一种啊方法啊,咱们先给大家来做一下储备知识啊。就是什么呢?我们的字符串呢,如果你要用引号或者单引号啊,来进行定线符引号或者单引号啊,双引号或者单引号啊。那么它呢,是不能够呃转弯的,我们现在来看一下,比如说我们现在把字符串进行转弯。啊,就是进行换行啊,就是所谓的转弯吧,那它实际上是不允许这样子的一种啊,不允许这样子的一个书写方法的啊,这样的书写方法是不对的。哎,就是说单引号,你看他这直接报错了啊,那么双引号也是不行的。哎,双引号也是不行的啊,那唯一能让字符串转弯的呢,那就是反引号,但是反引号不是ES6才有的嘛,对吧?哎,那么在以前啊,就是。啊,就是呃,以前那它是没有这种反引号表示法的,所以这个时候呢,你这个字符串它不能转弯。
02:05
它不能转弯的话呢,但是我又想表示那种结构化的啊,就结构化的一种,呃,就是HTML这种这种字符串,那这个时候呢,就不知道啊啊有有有有哪个神人想到了用数组照应。啊,什么意思呢?因为大家知道数组,比如说这里有一个字符串,这里有一个字符串对吧?这里有个字串,这里有个字符串对吧,我可以叫一个空啊校一个空之后呢,那这个时候它就变成了abcd这个字符串对吧?它到最后的合成结果是什么abcd。这个大家应该了解吧,对吧,你不信我们输出一下,然后我们运行一下看一下啊。那这里果然输出abcd啊。哎,那这里不能不加,如果不加的话,它就变成A逗号B逗号C逗号D了。对吧,哎,所以这样的话呢,我们在这里要来个空字符串啊,那它这块呢,就变成了abcd。
03:05
啊,就变成了这个abcd好,那呃,这样的话你会发现它能换行。看到了吗?他是不是能换行啊。发现了吗?能换行,哎,然后abcd,那你可能没听懂,说老师那能换行什么意思,那我现在就问问你这部分这几个字符串。对吧,他是不是就能表达出那种层次啊,哎,你肯定还没听懂啊,那你看邵老师给你变个魔术啊,邵老师给你变个魔术注意看什么呢?我们现在呢,先写啊,你看咱们平时HTML结构,咱们要的结构是不是就是力,力里头是div HD对吧,然后是BD吧,好,然后是三个P,姓名什么年龄什么啊,性别什么或者年龄啊或者性别。OK,姓名,年龄姓名。啊HTBD好,那这个东西你看啊,看老师给你变个魔术啊,注意看不要眨眼,我们给它复制复制粘进来,然后我们现在怎么办?诶,我们现在拉下来。
04:11
啊,怎么叫拉下来,按住鼠标滚轮啊,按住鼠标滚轮拉下来,那这个时候是不是就可以进行多行编辑对吧?这个大家应该知道吧,按住鼠标滚轮拉下来。诶,那这个时候他就能进行这种多行编辑。发现了吗?他就能进行这种多行编辑对吧,那这个时候给他补一个单引号诶。然后按N的符号E啊,EDN的符号,那这个时候这个光标是不是会跑到每行的最尾,然后再补个单引号诶。对吧,哎,当然多补了一个啊,咱们啊删掉好再补上逗号,诶好,当然最后多了一个逗号,再给它缩进。怎么样?有有有感觉了没?是不是觉得很神奇,有没有觉得很神奇是吧,兄弟们,这很神奇吧?
05:05
啊,很觉觉得很神奇啊。那也就是相当于现在这数组当中是一个字符串,两个,三个,四个,五个,六个,七个,八个,八个字符串能够被叫印到一起。啊,那这样的话,这个字符串就相当于拐弯了,因为咱们刚才说了,如果没有这个字符串标记,它是不能转弯的,对吧?哎,单引号这个里头是不能转弯的,但是呢,可以给它一行一个字符串加逗号数组的每一项交印到一起。哎,你说想出这个人的是不是神人?是不是神人,那这样的话,大家可以看见这个字符串最后被叫印到一起的时候呢,是没有换行的。啊,因为叫你到一起当然没有换行了,但是你看上看代码阅读的时候,它是不是带有这种换行的感觉呀。明白吗?代码阅读的时候,它是有这种换行的感觉的,而我们就是要追求这种换行的感觉。对吧,哎,这种,所以那这样的话,你是不是就觉得哇,好好神奇好神奇啊,对吧,这很神奇很神奇啊,因为这不就是一个字符串,然后教育一下吗。
06:10
啊,然后这个里头呢,还可以斩断连接,哎,就这个地方你还可以斩断连接。看。你是不是还可以斩断连接呀?哎,把那些你的数据拼在里头去,好,我们先不斩断连接,我们先把那个数据咱们写好啊,来从上一个案例当中,我们把这个都复制过来啊。好,然后这块还得有一个ul list的ID是I list啊,然后写循环语句for let I等于零,好,I小于例子,哎,I小于AR的Les,我们还是要遍利这个数据,但是这回很简单了,对,我们这回是不是每遍历一个就要往这里添加HTML片段就可以了。对吧,每遍历一条数据啊,就往这里添加HTML片段就行,所以就相当于是以字符串的视角啊,再说一遍,我们是以字符串的视角啊,来去怎么样,对吧?以字符串的视角没错,来去往里添加HTML啊,往里追这一段HTML添加到里头去,然后再以字符串的视角添加到里头去,再以字符串的视角添加到里头去。
07:25
那是不是就比刚才方法一要来的好一点,对吧,所以说就便历啊,咱们现在来说便利数据。遍历AR数组,然后每遍历一项就以字符串的视角,明白吗?就是字符串的视角啊,将。哎,将咱们的HTML字符串。是不是添加到粒子的中就行了。明白吗?哎,所以就是list它的inner HTML我们加等于啊,就让它的内部HTML代码要用inner HTML,不是T的啊,不是inner X的,因为inner text是不编译HTML标签的啊,Inner HTML呢,是编译HTML标签的。
08:10
好吧,哎,那加什么呢?对,就加这个数组照应。啊,你可能觉得这代码很乱,但是你看一看你就明白了,就是每遍历一项,我们要让list的inner HTML呢,加上一个数组的照应,那问问大家数组的照应结果是什么?是不是字符串啊?对吧?哎,那这样的话是不是就相当于把这个ul里头就添加了一个字符串,然后再变了一项又添加了一个字符串,再变了一项,是不是又添加了一个字符串啊。明白了吗?那这样的话我们是不是就可以斩断连接呀,对吧,AR的第二项的什么内幕的信息好玩儿吧。哎,我们先不。不不碰它,咱们先看看程序运行结果啊。你看小明的小红的小强呢?为什么?因为它是字符串的思维。
09:02
懂了吧,字符串的思维就是它以字符串的思维把力往里添加,把力往里添加,然后把这个力往里添加,啊,字符串的这样的一个思维是这样子的。好,那这样的话,你就可以发现这块也可以斩断连接,为什么可以斩断连接,废话,它是字符串啊,当然可以斩断连接了,对不对,哎,所以这块就是斩断连接,这块斩断连接。战斗连接这个应该听说过啊。咱们都是搞前端的啊,都是技术直男是吧,哎萨啊,没问题吧。是吧,那这样的话你看。诶是不是很方便,所以。美其名曰数组照应法啊,数组照应法的本质是什么?对,数组照应法的本质是不是叫做什么?对叫做啊,字符串啊,所以说数组这用法本质就是字符串的这样的一个方法。哎,但是它要比咱们普通的字符串方法要优雅,为什么呢?因为它有这种换行的形式啊,换行的形式非常的优雅啊,简直是太漂亮了,简直是是吧,哎,就能把这个给弄出来啊。那么大家要注意看,这句话说的绝不夸张,叫曾几何时非常流行的方法啊,是曾经的前端避讳知识啊,其实在有些场合下就是不让用VE的时候。
10:24
对吧,那这种方法或者说没有VE环境的时候,这种方法是非常好的啊,那大家一定要注意,刚才咱们是怎么给它生成的啊,老师可以再演示一遍啊,就是你先打你的结构。我先把语法换成HTML啊,给你再演示一下,你看ul力对吧,Div div p PP啊,然后按住鼠标滚轮诶,划下来多行编辑摁一个单引号,然后按摁的键再打一个单引号啊,当然它就会多补一个啊退回来,诶,然后在这个键盘上有一个ED这个键对吧。
11:00
啊,它就能到每行的末尾啊这样子哎,就把这个数组不就能拼成了吗。对吧?哎,所以所以这些东西呢,都是这不是老师发明的啊,我老师也没有这么大能耐能发明这种东西啊,这些都是咱们的前人的这个创作啊,然后甚至呢,还有一些网站啊,有一些提供一些工具哎,能够自动帮你去拼成这种数组的教育形式啊,有一些啊在线的工具是可以帮你拼成自动帮你啊转成照应的这种写法啊,但是没必要用那工具啊,咱们直接拉下来写这个单引号不是也很方便吗?对吧?哎,所以这个呢,就叫数组的正引法啊好,那么咱们在下个视频当中呢,我们再去介绍一下ES6的反引号法啊,ES6的反引号法。
我来说两句