DEV Community

Cover image for Top 10 Array utility methods you should know (Dart) 🎯

Posted on • Updated on • Originally published at

Top 10 Array utility methods you should know (Dart) 🎯

As part of my venture in client-side application development with Dart, I began exploring how one could go about working with Array/List types. Aside from the documentation being comprehensive, I was also able to find support on the StackOverflow community and successfully achieved what was needed.

In today’s article we’ll be looking at the “batteries-included” notion of Dart, in particular, the inbuilt utilities for working with Lists. I’ve hand-picked 10 of the most common ones you show know for your next app. I’ve also prepared the example snippets so you could play with those yourself 😁

So, shall we begin?

1. forEach()

Runs a function on each element in the list

var fruits = ['banana', 'pineapple', 'watermelon'];
fruits.forEach((fruit) => print(fruit)); // => banana pineapple watermelon
Enter fullscreen mode Exit fullscreen mode

2. map()

Produces a new list after transforming each element in a given list

var mappedFruits = => 'I love $fruit').toList();
print(mappedFruits); // => ['I love banana', 'I love pineapple', 'I love watermelon']
Enter fullscreen mode Exit fullscreen mode

3. contains()

Checks to confirm that the given element is in the list

var numbers = [1, 3, 2, 5, 4];
print(numbers.contains(2)); // => true
Enter fullscreen mode Exit fullscreen mode

4. sort()

Orders the elements in a list based on the provided ordering function

numbers.sort((num1, num2) => num1 - num2); // => [1, 2, 3, 4, 5]
Enter fullscreen mode Exit fullscreen mode

5. reduce(), fold()

Compresses the elements of a list to a single value, using a given function

var sum = numbers.reduce((current, next) => current + next);
print(sum); // => 15

// with fold() you provide an initial value
const initialValue = 10;
var sum2 = numbers.fold(initialValue, (current, next) => current + next);
print(sum2); // => 25
Enter fullscreen mode Exit fullscreen mode

6. every()

Confirms that every element satisfies the test

List<Map<String, dynamic>> users = [
  { "name": 'John', "age": 18 },
  { "name": 'Jane', "age": 21 },
  { "name": 'Mary', "age": 23 },

var is18AndOver = users.every((user) => user["age"] >= 18);
print(is18AndOver); // => true

var hasNamesWithJ = users.every((user) => user["name"].startsWith('J'));
print(hasNamesWithJ); // => false
Enter fullscreen mode Exit fullscreen mode

7. where(), firstWhere(), singleWhere()

Returns a collection of elements that satisfy a test

// See #6 for users list
var over21s = users.where((user) => user["age"] > 21);
print(over21s.length); // => 1

var nameJ = users.firstWhere((user) => user["name"].startsWith('J'), orElse: () => null);
print(nameJ); // => {name: John, age: 18}

var under18s = users.singleWhere((user) => user["age"] < 18, orElse: () => null);
print(under18s); // => null
Enter fullscreen mode Exit fullscreen mode

firstWhere() returns the first match in the list, while singleWhere() returns the first match provided there is exactly one match.

8. take(), skip()

Returns a collection while including or skipping elements

var fiboNumbers = [1, 2, 3, 5, 8, 13, 21];
print(fiboNumbers.take(3).toList()); // => [1, 2, 3]
print(fiboNumbers.skip(5).toList()); // => [13, 21]
print(fiboNumbers.take(3).skip(2).take(1).toList()); // => [3]
Enter fullscreen mode Exit fullscreen mode

9. List.from()

Creates a new list from the given collection

var clonedFiboNumbers = List.from(fiboNumbers);
print('Cloned list: $clonedFiboNumbers');
Enter fullscreen mode Exit fullscreen mode

As of Dart 2.0, the new keyword is optional when instantiating objects.

10. expand()

Expands each element into zero or more elements

var pairs = [[1, 2], [3, 4]];
var flattened = pairs.expand((pair) => pair).toList();
print('Flattened result: $flattened'); // => [1, 2, 3, 4]

var input = [1, 2, 3];
var duplicated = input.expand((i) => [i, i]).toList();
print(duplicated); // => [1, 1, 2, 2, 3, 3]
Enter fullscreen mode Exit fullscreen mode


I hope this has been insightful and if this is your first exposure to Dart, read my first steps tutorial to grasp the basics. The example snippets for this article are available on DartPad.

Like and follow me😍 for more content on Dart.

And this concludes the tutorial. Thanks for reading.

What to check out next

  1. List<E> class Documentation
  2. Dart screencasts on

Continue reading:

Top comments (6)

stargator profile image

Great job, Jermaine! I love seeing more Dart posts

creativ_bracket profile image

Thanks Stargator!

6temes profile image

I tried Dart on the version 1 and I loved it. It's a pitty that they didn't take it as the de facto language to Angular and they chose Typescript instead.

stargator profile image

AngularDart is still around and about to launch version 5 once Dart 2 is released.

6temes profile image

But, still, for some time they were talking about making Dart the official language for Angular and this is not going to happen, probably...

Thread Thread
stargator profile image

I didn't hear about that, so yeah, that's a lost opportunity for Dart. I think Google or the team behind Angular choose TypeScript in order to avoid pushing developers away.

Though as I recall, it looked like they had TypeScript, Dart, and JavaScript implementations of Angular2. But the docs for the JavaScript implementation didn't stay up to date and I think they frankly weren't interested in supporting it.