D3 v3 Enter Update Exit Phases

Enter Update Exit Phases D3 v3

v3 - entering elems implicitly included in the update selection.
v4 - merge() function for that
Update does not have a named method, but is an operation performed on the existing data.

<!DOCTYPE html>
<head>
  <meta charset="utf-8">
  <script src="https://cdnjs.cloudflare.com/ajax/libs/d3/3.5.17/d3.min.js"></script>
  <style></style>
</head>

var scale = d3.scale.linear()
      .domain([1, 5])   // Data space
      .range([0, 200]); // Pixel space

var svg = d3.select("body").append("svg")
      .attr("width", 250)
      .attr("height", 250);

function render(data, color) {

var rects = svg.selectAll("rect").data(data);

// Enter
        rects.enter().append("rect")
          .attr("y", 50)
          .attr("width", 20)
          .attr("height", 20);

// Update
        rects
          .attr("x", scale)
          .attr("fill", color);

// Exit
        rects.exit().remove();

}

setTimeout(function () { render([1, 2, 2.5], "red"); }, 1000);
    setTimeout(function () { render([1, 2, 3, 4, 5], "blue"); }, 2000);
    setTimeout(function () { render([1, 2], "green"); }, 3000);
    setTimeout(function () { render([3, 4, 5], "cyan"); }, 4000);
    setTimeout(function () { render([4, 5], "magenta"); }, 5000);

</script>
</body>

https://cdnjs.cloudflare.com/ajax/libs/d3/3.5.17/d3.min.js