2020/02/09 01-解构和数组操作

最新推荐文章于 2022-09-20 18:00:11 发布

48N6E

最新推荐文章于 2022-09-20 18:00:11 发布

阅读量153

点赞数

分类专栏： 54前端开发之ES6入门(三)

本文链接：https://blog.csdn.net/qq_42227818/article/details/104248057

版权

54前端开发之ES6入门(三) 专栏收录该内容

5 篇文章 0 订阅

订阅专栏

JS的解构跟python类似，JS的可变参数…三个点，就一直把三个点用到底

在这里插入图片描述
python是不可以在一个列表里把参数解构的，JS可以，这里的列表叫数组，拿到数组可以把里面的参数解构，解开，插入到新数组里

直接可以得到新的数组，数组是有顺序的，插入的位置决定了顺序，这个数组其实就是一个列表
在这里插入图片描述
数组这样解构就可以了

这个是变量定义

想要把里面的东西解开‘

有逗号表达式，就不能这么写，等于b等于这个数组’
在这里插入图片描述
这样就解开了

abc就没人要了

悬空就等于没定义

这个地方就是一个数组

剩余参数必须在最后，不然是不允许的

剩余参数必须是最后一个

现在有点像丢弃变量的意思，最后…c是尽可能的收集，出来应该是数组
在这里插入图片描述

x=100，y=200，z=300

在这里插入图片描述
只要中间的，本来也可以两边不对应

少了多了都没问题，可变的是一个数组

还支持默认值

可以两边不一样，可以用缺省值

解构的时候，变量从左到右和元素对齐，可变参数放最右边。
能对应的数据就对应，对应不到返回默认值，没有默认值返回undefined
在这里插入图片描述

对象解构需要用到大括号

属性是没有顺序的，是靠名字对应的。对象跟数组解构的最大区别，数组解构的时候，数组是没什么名字可用的，数组是有顺序的，对象是没有顺序的，所以现在写一个变量，除了拿名字找其他没什么办法
在这里插入图片描述
解开的时候用a，b，赋值的时候用m，n

报错是因为拿a去解构，但是出来赋值的变量是m，

所有这里应该是m，n，这个就跟重命名一样

d没有定义，所以是x，这样用别名的方式，就把属性解构的时候变化了，缺省值可多可少，找不到就undefined
在这里插入图片描述
别名，缺省值

是用属性名来分的，所以xyz没有用，用abc可以使用别名
更加复杂的解构

能否把里面值取出来
保持一致就完全解开了

结构一致只要对应起来即可

剩余参数必须在最后
在这里插入图片描述
d是把4的中括号括起来

复杂一点的对象解构

想拿到url，或者两个title

在这里插入图片描述
如果要解构该怎么做

后面这里名字变了，所以未定义

可以拿回t2，有了冒号相当于后面是别名

可以先拿出来然后单独解构也可以，先拿translation，然后再解一次构

之前写的main函数，就是理解高阶函数如何使用，实际上JS提供了，知道你用数组的目的就是为了这个事情

想要把数组里的元素都偏移10，可以用map函数，这是放在数组上才有的方法
在这里插入图片描述
每一个元素都要调用一回，等于元素处理回调函数

找到大于5的

在这里插入图片描述
所以有些语言里在对象调用方法，python是给你不同方法塞不同类型进来

forEach，意思是每一个，undefined，python里又就地修改和返回新的对象，看一下这里，处理完了，arr的值还是没有变化
在这里插入图片描述
所以forEach这家伙比较懒，可以传参数，但是做什么事情需要你自己来，不会给你return任何值

建立一个新的数组，在新的数组里将它的结果推进去，返回值没有，但是可以自己处理
在这里插入图片描述
有的时候做映射map，有的时候做过滤filter，还有一种拿到元素做其他处理（给forEach函数，通过回调函数方式处理一个个元素）
所以可以写成for循环，也可以写成 forEach

**这个y是index，x是元素element，z是数组
**
在这里插入图片描述
这样拿到了每一次的索引

forEach是每一个元素都要循环，所以里面加break和return都是没意义的