抽象轻松JavaScript

拆与接

想想看我们在现实中有什么情况需要用拆、接

 东拼西凑!南水北调!

他们都有一个共同点——转移资源(优化资源结构)

拆(split)、接(join)

拆顾名思义——拆解

接顾名思义——拼接         ps:配合上面两个词语更好理解

现实例子:例如有一只笔(数组),那么可以把他拆成两部分,笔芯和笔筒(两个)

                  那么如何组成一只笔呢(数组),只需要把笔芯和笔筒连接起来

如果你学过split就会问,这玩意不是针对字符串的吗?数组也能用?

第一个问题:对,确实是针对字符串的

第二个问题:数组类型能否转换成字符串?yes,数据类型是可以相互转换的!

      let arr1 = "qiudao,yasuo";
      let arr2 = [1,2,3,"秋刀鱼"];
      console.log(arr1.split(","));
      console.log(String(arr2).split("1"));
      console.log(arr2.split(","));

抽象轻松JavaScript_第1张图片

看,上图,第一个输出是字符串,正常输出

                  第二个输出是数组转字符串,正常输出

疑问点:为什么1没有输出来!

                  第三个输出是数组,报错 

解答疑问,split()以括号中的值为分界点,挨个拆解,分界点的值就消失了

连接(join)

    let _arr = [1,2,3];
    let _2arr = ["秋刀鱼","猫和你"];
    console.log(_arr.join(" and"),_2arr.join(" and"));
    console.log([..._arr],[..._2arr]);

抽象轻松JavaScript_第2张图片

细心的人会发现,连接语法返回的是字符串,而拆解语法返回的是数组

第二想要两个数组连接并返回数组时,使用展开语法[...变量名]

抽象轻松JavaScript_第3张图片

 拆,不要注意图片中的拆少了一笔

河对岸有片区域,被称为1区,2区,我们用join("桥")将他们连接成一个整体

                                                          我们用split("桥")将他们拆解成两个部分

曹操赤壁之战,火烧赤壁,我们用join("链子"),将每一艘船连接起来

                                           我们又用split("链子"),将一个整体拆解成多个部分

小结

拆解split(x),以x为分界点,拆成多个部分,返回类型为数组

连接join(x),以x为连接点,连成一个整体,返回类型为字符串

想要连接数组时用最新的展开语法

拆与接,针对的都是内容,对内容的优化

核心目的——优化代码结构

你可能感兴趣的:(抽象js,javascript,前端,开发语言)