前端学习Dart|第四节

前言

这是Dart前端学习笔记第四节: 主要讲解List列表

视频地址:传送门

列表

Dart中以List对象的形式表示数据集合,表现形式上类似于javascript中的Array。提前声明他们并不是一个东西。以后在Dart的语言环境中,我们统称为List对象.

Dart中List对象有两种表现形式:

fixedLengthList

fixedLengthList(固定长度列表)声明方式如下:

image.png

例子中创建了长度为3的列表,因为没有赋值,结合之前章节中未赋值的变量类型都为null

为固定长度列表赋值:

image.png

列表不能在运行时增长或者缩小,任何调整列表大小的尝试都将导致异常。

比如我们直接赋值a[5] =

image.png

异常错误:

image.png

索引无效:不在指定范围之内

上述例子在javascript中的场景如下:

image.png

这样的赋值操作本质上改变了列表的长度,所以Dart中的列表是不可以这样操作的。

这里注意一下,并不是因为上述例子是固定列表才不可以使用索引动态的改变列表长度,可增长列表也不可以通过索引赋值动态的改变列表长度。索引赋值为List operator操作符中的一种,后面讲到操作符的时候会提及,上方报错也是触发了索引赋值的错误边界抛出。下方不再赘述,注意一下就好。

具体语法API:

image.png

还有一些其他场景,下面属性及方法章节会讲解。

growableList

growableList(可增长长度列表)声明方式有两种:

  1. 创建一个列表,包含指定值

image.png

  1. 创建一个空列表

image.png

  1. 为空列表创建给定长度的可增长列表(仅在创建后立即赋予长度)

image.png

  1. 为不可为空列表创建指定长度的增长度列表

image.png

  1. 通过List.empty创建空的可增长长度列表

image.png

如上声明的列表可以使用一些方法进行长度修改,比如:

image.png

或者使用length属性改变:

image.png

这里有个需要注意的知识点:

filled

使用filled初始化列表共享相同的fill值。

看一下下面这个例子:

image.png

参照上面的定理来试着理解,填充的数据是同一个,并不是一个数据拷贝了三分放在里面,而是根本就是一个数据进行共享填充。我们来举另一个例子来论证一下。

image.png

可以看到我们换了一个类型的数据进行填充,并且进行相同的索引赋值操作。结果是一样的。重新理解一下这个概念:

使用filled初始化列表共享相同的fill值。

如何避免这种状况呢,我们不想要共享状态,需要单独操作每一个值。

可以使用List.generate来创建一个列表,每个索引填充都是新的对象:

image.png

List属性及方法

这里举一些常用的属性及方法

first

返回列表第一个元素

image.png

last

返回列表最后一个元素

image.png

isEmpty

是否为空,返回bool值

image.png

length

返回列表长度

add()

在列表最后位置添加元素,扩展一位数组长度

image.png

addAll()

在列表最后位置添加对象元素

image.png

clear()

移除列表中所有元素,长度归0

image.png

fillRange()

填充指定索引范围内元素

image.png

这个fill 与 前面提到的共享filled是一样的。也是共享填充。

indexOf()

返回第一个匹配到元素的索引,与javascript中indexOf相同理解。

indexWhere()

返回第一个符合test规则匹配元素的索引。

image.png

第二个参数为开始匹配的索引位置。 返回值与indexOf一致

insert()

在列表制定位置插入元素

这会将列表的长度增加,并将索引处或索引之后的所有对象移向列表的末尾。

image.png

remove()

移除列表中匹配到的元素

image.png

removeAt()

移除列表制定索引位置元素

List Operators

列表有四种操作符:

image.png

List 循环

除了前面章节讲解的四种循环,List对象自身有几种循环方法。

forEach

image.png

不用怀疑,没有index索引参数返回。只有element

map

map主要用于修改原数组;对原数组进行一些操作(对原数组进行修改)

image.png

where

where查找符合条件的数组 (主要用于筛选)

image.png

any

判断数组中是否有满足条件的数据 返回的是布尔值

image.png

every

判断数组中是每一个值是否满足条件 返回的是布尔值

image.png

reduce

reduce比较特殊,可以看到,并没有像javascript中的第二个参数初始值。

image.png

Dart的reduce中会以数组第一个元素作为初始值,并从第二个元素开始执行回调函数。

如果你用js的reduce不传入第二个参数的话,原理是与这个一样的,可以试一试。

感兴趣可以先看看源码

image.png

Iterable

Dart中的Iterable为可迭代类型。

这里单独开了一篇文章,详细对比了javascript 与 Dart中的迭代概念的区别。 以及List类型的来历。

《前端学习Dart|Iterator》

END

第四节主要讲解了List类型、Iterable类型,并且对比较javascript中的Array与迭代协议。

在讲解的过程中牵扯出一些其他的小知识点也一一进行攻破。

视频中讲解更内容更加丰富详细,传送门(视频后半部分)

© 版权声明
THE END
喜欢就支持一下吧
点赞0 分享