Cascade notation (..)

Cascades (..) allow you to make a sequence of operationson the same object. In addition to function calls,you can also access fields on that same object.This often saves you the step of creating a temporary variable andallows you to write more fluid code.

Consider the following code:

  1. querySelector('#confirm') // Get an object.
  2. ..text = 'Confirm' // Use its members.
  3. ..classes.add('important')
  4. ..onClick.listen((e) => window.alert('Confirmed!'));

The first method call, querySelector(), returns a selector object.The code that follows the cascade notation operateson this selector object, ignoring any subsequent values thatmight be returned.

The previous example is equivalent to:

  1. var button = querySelector('#confirm');
  2. button.text = 'Confirm';
  3. button.classes.add('important');
  4. button.onClick.listen((e) => window.alert('Confirmed!'));

You can also nest your cascades. For example:

  1. final addressBook = (AddressBookBuilder()
  2. ..name = 'jenny'
  3. ..email = 'jenny@example.com'
  4. ..phone = (PhoneNumberBuilder()
  5. ..number = '415-555-0100'
  6. ..label = 'home')
  7. .build())
  8. .build();

Be careful to construct your cascade on a function that returnsan actual object. For example, the following code fails:

  1. var sb = StringBuffer();
  2. sb.write('foo')
  3. ..write('bar'); // Error: method 'write' isn't defined for 'void'.

The sb.write() call returns void,and you can’t construct a cascade on void.

Note: Strictly speaking, the “double dot” notation for cascades is not an operator. It’s just part of the Dart syntax.