selection是Array子类
selection是Array子类，并不是由DOM元素组成的数组，它继承了原生数组的方法（如 array.forEach、array.map）外，还提供了操作选中元素的方法，如设置选中元素的属性（selection.attr）和样式（selection.style）。通常我们不会使用Array的原生方法，因为D3提供了更加方便的方法（比如selection.each），D3还重写了一些原生方法来适应selection的行为（如selection.filter、selection.sort）。
d3.selectAll("h2");
d3.selectAll("tr").selectAll("td");
group
注意：selection并不是元素的数组，而是由group组成的数组，其中每个group才是由元素组成的数组。d3.select返回的selection包含了一个group，这个group包含了选中的body元素。同样，d3.selectAll返回的selection包含了一个group，这个group包含了选中的多个元素。
d3.select 和 d3.selectAll 返回的selection都只有一个group。唯一获得包含多个 group的selection 的方法是 selection.selectAll。
每一个group都有一个parentNode属性用来存储当前group内全部元素共同的父元素。当group被创建时就具有该属性。比如d3.selectAll('tr').selectAll('td')，返回的selection包含了多个group，每个group包含多个td元素，且每个group的parentNode是tr元素。d3.select 和 d3.selectAll返回的group的父元素是document。
大多时候我们不需要去关注selection的group，当我们调用selection.attr或者selection.style时，selection中的所有group的所有子元素都会调用这个函数。group带来的一个需要注意的地方：当调用selection.style('color', function(data, index){...})，第二个函数参数里面的index表示的是元素在group中的索引，而不是在selection中的索引。
什么操作不会改变group
ps: 个人对group没有被修改的理解是：selection中group的个数没有发生改变且每个group的parentNode属性和元素个数也没有改变。
只有selectAll操作会涉及到修改group的结构（包括group的个数和group的parentNode属性），select操作会保留之前的group结构(每个group的parentNode没有改变)，老的selection中每个元素都只会在新的selection中对应一个新的元素。select操作会直接把数据从父元素传递给子元素 (因此也不需要data-join的过程)。
selection.append和selection.insert方法也会保持当前的group结构并传递数据。
数据绑定
注意：data并不是selection的属性，而是selection中元素的属性。当把数据绑定至selection时，data将被存储在DOM元素的data属性上。数据是持久的，而选择可以被认为是瞬时状态：你可以从DOM重新选择元素，它们将保留先前绑定到它们的任何数据。
数据绑定至元素的几种方式：
- selection.data()
- selection.datum()
- 通过调用append、insert、select方法从父元素继承获得。
和selection的其它方法不同，selection.data是为每一个group定义数据而不是为每个元素定义数据，每一个group对应的data应该是一个数组或者返回数组的函数。
selection.data(function(parentNode, groupIndex){...})里面parentNode对应group的父元素，groupIndex对应group的索引。
当selection只包含一个group时，我们可以直接传递group对应的数据数组给selection.data([1, 2, 3...])。那么什么时候需要使用函数作为入参呢，当我们的selection里面包含了多个group时，则需要使用函数入参为不同group分配对应的数据数组,selection.data(function(parentNode, groupIndex){ return data[groupIndex]})，其中data=[[1, 2, 3],[4,5,6],...]。
data-join
将数据绑定到元素，我们需要知道哪个数据该绑定至哪个元素，这一过程是通过匹配key来完成的。key可以是一个简单的字符串(比如‘name’), 当数据和元素的键相等时，认为数据和元素是绑定。
指定key值最简单的方法就是直接使用索引：第一个数据绑定至第一个元素，第二个数据绑定至第二个元素，以此类推....
var numbers = [4, 5, 18, 23, 42];d3.selectAll("div").data(numbers);
数据绑定后的selection:
除了使用索引作为key值，也可以自定义指定key函数作为selection.data(data, function(){...})的第二个参数，key函数为当前的数据或元素返回一个key值。
Enter, Update and Exit
进行数据绑定时，有三种可能的结果出现：
- Update： 对于某一个数据, 有相同 key 值的 DOM 元素与其对应
- Enter：对于某一个数据, 没有相同 key 值的 DOM 元素与其对应
- Exit：对于某一个 DOM 元素, 没有相同 key 值的数据与其对应
分别对应selection.data，selection.enter和selection.exit返回的三种状态的selection。
合并Enter & Update
对于Enter 和 Update 选择集，我们通常都需要进行更新样式、位置等操作，因此为了减少重复代码，可以先对这2个选择集使用selection.merge进行合并操作，再进行更新。
