Misunderstanding of the data method in jQuery

Today xie liang brother and I discuss a thing, about the performance, he is the attr operation custom attribute data-uid, I said to use data good, because it is a dataset implementation, and then he went to the jQuery source code and I said, did not find this thing, I wonder. So I went to carefully read the data method source code, only to find that I have been misunderstood, again, to ask me before the data method group friends apologize, I "cheated" you, you hit me.

Today I have to explain the data method, first look at the jQuery 1.11.0 how to say in the manual, please visit (link: http://shouce.jb51.net/jquery/data.html),
The usage is clear here, but how is it implemented internally? (link: https://github.com/jquery/jquery/blob/master/src/data.js#L77-L165)   (it doesn't matter if you don't understand, I will briefly analyze his process.)

 This is what happens when we execute a statement like this  $("#id").data("test"); ( A simplified process ) 
 The first step : jQuery  Will get to the  $("#id")  Elements, right?  
 The second step :  Perform to  data methods   When he will pass  attributes  Take the corresponding value that we want.  
 The third step :  Return the result to us, and then  jQuery  Cache the value into the internal object  
 The first time we take it, we get it  undefined , string, number or parsed json .  
 
 So someone would say this sum  attr  What's the difference?  
 When we execute the second time  $("#id").data("test");  When:  
 The first step : jQuery  Will get to the  $("#id")  Elements, same as above.  
 The second step :  Perform to  data methods   When from  jQuery  Value in the cache  
 The third step :  Return the result to us  
 
 Notice the second step is different, right? Why not from  attributes  And instead of taking it from the cache?  
 The cache is actually js The object of  var cache = {}; jQuery  It's saved to this cache object after the first value, so that when we do it again, it's very fast,  
 Often the performance loss is in  dom  Operationally, so avoid duplicate operations  dom  It is very necessary.  
 
 And here, you can see that he's the sum  attr  The biggest difference, for example  <div id="id" data-test="hehe"></div> 
$("#id").data("test", "123");  It still is after execution  data-test="hehe"
$("#id").attr("data-test", "123");  It's going to be  data-test="123"
 
 So what's the difference when we want to assign a value to an element, or an object? Such as  <div id="id" data-test="hehe"></div> 
$("#id").data("test", {str: "hehe"});  the  {str: "hehe"}  Assigned to   Cache, still on the element node  data-test="hehe"
$("#id").attr("data-test", {str: "hehe"});  It's going to be  data-test="[object Object]"
 I think a lot of people have come across this, at least a lot of people in the group have asked this question. 

In fact, I didn't lie to you before, custom attributes don't have to always attr him, data is jQuery gave us a Swiss army knife, very sharp.

Ok, I am lazy, lazy illustration, have written a lot of words, if there is something said wrong place, you come to hit me