Why is printing the data from response.on("end", callback) different from printing the data from response.on("data", callback)?

I am working on learnyounode's HTTP Client assignment.

I was wondering why console logging the data from response.on("end", callback) outputs only the last part of the expected output while console logging the data from response.on("data", callback) outputs the whole response.

Here's my code for the former:

var http=require("http");
http.get(process.argv[2], function(response){
    var str;
    response.setEncoding('utf-8');
    response.on("error",function(error){
        console.log(error);
    });
    response.on("data", function(data){
        str=data;
    });
    response.on("end", function(){
        console.log(str);
    });

}).end();

The result shows:

                 ACTUAL                                 EXPECTED                
───────────────────────────────────────────────────────────────────────

   "Veg out"                           !=    "Bodgy"                            
   ""                                  !=    "Chuck a sickie"                   
                                       !=    "Cook"                             
                                       !=    "Dag"                              
                                       !=    "Larrikin"                         
                                       !=    "Hit the turps"                    
                                       !=    "Counter meal"                     
                                       !=    "Hottie"                           
                                       !=    "Veg out"                          
                                       !=    ""                                 

──────────────────────────────────────────────────────────────────────

The code for the response.on("data", callback) is this:

var http=require("http");
http.get(process.argv[2], function(response){
    response.setEncoding('utf-8');
    response.on("error",function(error){
        console.log(error);
    });
    response.on("data", function(data){
        console.log(data);
    });


}).end();

The result is:

                 ACTUAL                                 EXPECTED                
────────────────────────────────────────────────────────────────────────────────

   "Amber fluid"                       ==    "Amber fluid"                      
   "Ankle biter"                       ==    "Ankle biter"                      
   "Bities"                            ==    "Bities"                           
   "Slabs"                             ==    "Slabs"                            
   "Captain Cook"                      ==    "Captain Cook"                     
   "Galah"                             ==    "Galah"                            
   "Battler"                           ==    "Battler"                          
   "Sickie"                            ==    "Sickie"                           
   "Chook"                             ==    "Chook"                            
   "Going off"                         ==    "Going off"                        
   ""                                  ==    ""                                 

────────────────────────────────────────────────────────────────────────────────

The former code only logs the last element. Why is this?

Thanks!

via Calvin Chen