Misunderstanding of the data method in jQuery _ jquery-js tutorial

I have always thought that data in the new version is implemented by calling dataset. for IE in earlier versions, using getAttribute has always been a misunderstanding, I don't know how this idea came about. Today, when Xie Liang talked to me about performance, he used attr to operate the custom attribute data-uid, I said it would be nice to use data because it was implemented by dataset. Then he flipped through the jQuery source code and told me that I didn't find this thing, so I wondered. So I carefully read the source code of the data method and found that I had been misunderstanding. Then, I apologized to the group friends who asked me about the data method. I "lied" to you, you can beat me.

Today, I will explain the data method again. Let's take a look at the swollen words in the jQuery 1.11.0 manual. Please go to http://shouce.jb51.net/jquery/data.html,
The usage here is very clear, but how is it implemented internally? Poke me to view the source code (it doesn't matter if I don't understand it)

In fact, when we execute a statement like this $ ("# id "). data ("test"); (simplified process) Step 1: jQuery gets the $ ("# id") element, right, Step 2: when the data method is executed, attributes is used to obtain the corresponding value. Step 3: return the result to us. Then, when jQuery caches the value to an internal object for the first time, we can get undefined, String, number, or parsed json. So what is the difference between this and attr? When we execute $ ("# id") for the second time "). data ("test"); time: Step 1: jQuery gets the $ ("# id") element, which is the same as above. Step 2: when the data method is executed, take the value from the jQuery cache Step 3: return the result to us and find that the second step is different, right? Why not take the value from attributes, but from the cache? The cache is actually a js object. In short, it is similar to var cache ={}. jQuery will save the value to this cache object after the first value, in this way, the operation is very fast again, and the performance loss is often on the dom operation, so it is necessary to avoid repeated dom operations. This shows the biggest difference between attr and him, for example
$ ("# Id "). data ("test", "123"); after execution, it is still data-test = "hehe" $ ("# id "). attr ("data-test", "123"); after execution, it will be data-test = "123". Then we need to assign a value to an element, or what are the differences between objects? For example
$ ("# Id "). data ("test", {str: "hehe"}); {str: "hehe"} is assigned to the cache, data-test = "hehe" $ ("# id") on the element node "). attr ("data-test", {str: "hehe"}); after execution, data-test = "[object Object]" may also be encountered by many people, at least many people in the group have asked this question.

In fact, I did not lie to you before. It is not necessary to always attr Custom Attributes. data is a Swiss Army knife that jQuery has given us. It is very sharp.

Well, I'm a lazy, lazy figure, and I have already written a lot of words. If anything is wrong, Please hit me.