215
votes

Sometimes I see this List list = [];

Then list..add(color)

What's the difference between using 1 dot(.) and 2 dot(..)?

5

5 Answers

361
votes

.. is known as cascade notation. It allows you to not repeat the same target if you want to call several methods on the same object.

List list = [];
list.add(color1);
list.add(color2);
list.add(color3);
list.add(color4);

// with cascade

List list = [];
list
  ..add(color1)
  ..add(color2)
  ..add(color3)
  ..add(color4);
116
votes

It's the cascade operator of Dart

var l1 = new List<int>()..add(0)..addAll([1, 2, 3]);

results in l1 being a list [0, 1, 2, 3]

var l1 = new List<int>().add(0).addAll([1, 2, 3]);

results in an error, because .add(0) returns void

.. (in the former example) refers to new List(), while . (in the later) refers to the return value of the previous part of the expression.

.. was introduced to avoid the need to return this in all kinds of methods like add() to be able to use an API in a fluent way.

.. provides this out of the box for all classes.

29
votes

Cascades (..) allow you to make a sequence of operations on the same object. read doc for details

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

The previous example is equivalent to:

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

.. Is known as the cascading operator in dart.

It allows you to use more than one subsequence operation:

Examples:

banerad..load()..show().

List coursename;
coursename..add("java")..add("flutter" )..add("dart");

Here is another example

Here is another example

2
votes

Cascade in Dart Because Dart developers make uses of method chaining heavily, cascade feature is provided to support.

See the following code:

class Calculator {
  double _accumulator = 0;

  Calculator(double startValue) {
    this._accumulator = startValue;
  }

  void add(double val) {
    this._accumulator += val;
  }

  void subtract(double val) {
    this._accumulator -= val;
  }

  double result() {
    return this._accumulator;
  }
}

It is almost the same as ChainCalculator class; only one difference, where return this has been removed in each method.

Let’s use cascade feature.

Calculator calculator = Calculator(0.0)
    ..add(12.0)
    ..subtract(10.0)
    ..add(5.0)..subtract(8.0);

print("Result: " + calculator.result().toString());

It works perfectly and similar to previous code, but instead of . notation, cascade uses .. (double-dot) notation in order to access current modifying instance.

Why cascade in Dart?

Generally speaking, cascade is super-helpful for:

building complex objects (lots of property configuration) making objects better for encapsulation. return this makes objects too open. building objects faster with nested cascade. less lines of code.

it is taken from : Method chaining using Cascade in Dart