集合
GoJS provides its own collection classes: List, Set, and Map. You can iterate over a collection by using an Iterator.
These collection classes have several advantages over using JavaScript arrays as lists or objects as maps. They raise an error when trying to get the next item of an iterator if the collection has been modified since getting the iterator. They can be made read-only to avoid unexpected modifications. They offer methods not found on simple arrays or objects, such as Iterator.any, Iterator.all, and Iterator.each. If you are writing in TypeScript, they optionally enforce compile-time type checking of the item types.
In GoJS most of the properties and methods that return collections describing the structure of the diagram return an Iterator. That is because the implementation of the collections are internal -- you only need to know how to iterate over the result collection. Other methods or properties will allow you to modify the diagram. An example is Diagram.nodes, which returns the current collection of Nodes and Groups in the diagram as an Iterator. The collection is automatically modified as the programmer adds or removes node data in the model or by direct calls to Diagram.add or Diagram.remove.
However there are a few properties that return collections that are allowed to be modified. Examples include collections on classes that are usually frozen after initialization: Geometry.figures, PathFigure.segments, and Brush.colorStops. Other examples include collections that are modified very infrequently, usually only upon diagram initialization: ToolManager.mouseDownTools (and the other lists of tools) and Diagram.nodeTemplateMap (and other template maps).
See samples that make use of collections in the samples index.
List
列表 List 是一个有序的集合,其值由 0 ~ (数据长度 -1) 的整数来索引。
var l = new go.List(); l.add("A"); l.add("B"); l.add("C"); assert(l.count === 3); assert(l.elt(0) === "A"); assert(l.has("B")); assert(l.indexOf("B") === 1); l.setElt(1, "z"); // replace an item assert(l.elt(1) === "z"); l.removeAt(1); // remove an item assert(l.count === 2); assert(l.elt(1) === "C");
In 2.0, the optional argument to the List constructor has been removed. However, if you are writing in TypeScript, GoJS collections classes (List
, Map
, Set
) are now generic, and will help you enforce types:
// TypeScript: var l = new go.List<string>(); // Create a list of only strings l.add("A"); l.add(23); // throws an error during compilation or in an IDE l.add({}); // throws an error during compilation or in an IDE
To iterate over a List, get its List.iterator and call Iterator.next on it to advance its position in the list. Its Iterator.value will be a list item; its Iterator.key will be the corresponding index in the list.
var l = new go.List(); l.add("A"); l.add("B"); l.add("C"); var it = l.iterator; while (it.next()) { console.log(it.key + ": " + it.value); } // This outputs: // 0: A // 1: B // 2: C
Set
Set 是一个不允许有重复值的无序集合。这个类和 ECMAScript 2015 (ES6) 中的 Set
对象类似。
The optional argument to the Set constructor specifies the type of the items that may be added to the set.
var s = new go.Set(); s.add("A"); s.add("B"); s.add("C"); s.add("B"); // duplicate is ignored assert(s.count === 3); assert(s.has("B")); s.remove("B"); // remove an item assert(s.count === 2); assert(!s.has("B"));
As with List
and Map
, in 2.0 the optional argument to the Set constructor has been removed, but it is now a generic class in TypeScript and can enforce types:
// TypeScript: var s = new go.Set<string>(); // Create a set of only strings s.add("A"); s.add(23); // throws an error during compilation or in an IDE s.add({}); // throws an error during compilation or in an IDE
Iterating over the items in a Set is just like iterating over a List, except that the order of the items may vary.
var s = new go.Set(); s.add("A"); s.add("B"); s.add("C"); s.add("B"); // duplicate is ignored var it = s.iterator; while (it.next()) { console.log(it.value); } // This might output, perhaps in different order: // A // B // C
Map
Map 是一个无序的 key-value 形式的集合,值通过 key 来索引。这个类和 ECMAScript 2015 (ES6) 中的 Map
对象类似。
The two optional arguments to the Map constructor specifies the types of the keys and the types of the item values that may be added to the map.
var m = new go.Map(); m.add("A", 1); // associate "A" with 1 m.add("B", 2); m.add("C", 3); assert(s.count === 3); assert(s.has("B")); assert(s.get("B") === 2); m.add("B", 222); // replace the value for "B" assert(s.get("B") === 222); s.remove("B"); // remove an item assert(s.count === 2); assert(!s.has("B")); assert(s.get("B") === null);
As with List
and Set
, in 2.0 the optional arguments to the Map constructor have been removed, but it is now a generic class in TypeScript and can enforce types:
// TypeScript: var m = new go.Map<string, number>(); // Create a map of strings to numbers m.add("A", 1); m.add(23, 23); // throws an error during compilation or in an IDE m.add({}, 23); // throws an error during compilation or in an IDE
Iterating over the items in a Map is just like iterating over a List, but offering access to both the keys and the values. As with Sets the order of the items may vary.
var m = new go.Map(); m.add("A", 1); // associate "A" with 1 m.add("B", 2); m.add("C", 3); m.add("B", 222); // replace the value for "B" // Normal iteration lets you get both the key and its corresponding value: var it = m.iterator; while (it.next()) { console.log(it.key + ": " + it.value); } // This might output, perhaps in different order: // A: 1 // B: 222 // C: 3 // To get a collection of the keys, use Map.iteratorKeys: var kit = m.iteratorKeys; while (kit.next()) { console.log(kit.value); } // This might output, perhaps in different order: // A // B // C // To get a collection of the values, use Map.iteratorValues: var vit = m.iteratorValues; while (vit.next()) { console.log(vit.value); } // This might output, perhaps in different order: // 1 // 222 // 3
Typically one uses Map.iteratorKeys or Map.iteratorValues when needing to pass a collection on to other methods that take an Iterator.
更多迭代操作示例
遍历图形中选中的的部分(Parts):
for (var it = diagram.selection.iterator; it.next(); ) { var part = it.value; // part 可能是 Node、Group、Link 或其他的组件 if (part instanceof go.Node) { . . . } else if (part instanceof go.Link) { . . . } }
或
diagram.selection.each(function(part) { // part 可能是 Node、Group、Link 或其他的组件 if (part instanceof go.Node) { . . . } else if (part instanceof go.Link) { . . . } });
遍历图形中所有节点(Nodes):
for (var it = diagram.nodes; it.next(); ) { var n = it.value; // n is now a Node or a Group if (n.category === "Special") { . . . } }
遍历节点(Node)中所有端口,及与该端口相连的连线(Links)
for (var pit = node.ports; pit.next(); ) { var port = pit.value; // port is now a GraphObject within the node for (var lit = node.findLinksConnected(port.portId); lit.next(); ) { var link = lit.value; // link is now a Link connected with the port if (link.data.xyz === 17) { . . . } } }
遍历面板(Panel)中所有元素:
for (var it = panel.elements; it.next(); ) { var elt = it.value; // elt is now a GraphObject that is an immediate child of the Panel if (elt instanceof go.TextBlock) { . . . } else if (elt instanceof go.Panel) { . . . recurse . . . } }
for (var mit = group.memberParts; mit.next(); ) { var part = mit.value; // part is now a Part within the Group if (part instanceof go.Node) { . . . maybe work with part.data . . . } }