Today, an old friend just chatted about jQuery source code. He didn't know the source code. I explained the core implementation to him with the attitude of learning and communication. (it seems that I have been pigeoning for a long time.)

By the way, which CDN service provider can find a jQuery file to open. I use version 1.2.3 as an example. The latest version is similar, with only two or three changes https://cdnjs.cloudflare.com/ajax/libs/jquery/1.2.3/jquery.js

Source code analysis

17-20 lines Pass in the selector and return the init method of its own new. I guess you haven't used it $() The second parameter is omitted here

 var jQuery = window.jQuery = function(selector) {
    return new jQuery.prototype.init(selector);
}

Lines 26-27 This is why it always starts with $and is mounted under the window object, which is a global variable

 // Map the jQuery namespace to the '$' one
window.$ = jQuery;

Lines 36-547 Get rid of what we don't need, keep the core, stay init Method, the internal judge of jQuery instance and selector is made. Here we ignore and simplify

 JQuery. FN = jQuery. Prototype = {init: function (selector) {var nodes = document. Queryselectorall (selector); 
 for (VaR I in nodes) {this [i] = nodes [i]; 
} return this; 
} 
 / / omit 100000 words 
}}

549 lines In the previous paragraph, the jQuery prototype chain is passed to the init method prototype under the jQuery prototype. Looking back at the new code, it is very clear

 jQuery.prototype.init.prototype = jQuery.prototype;

Complete implementation

If you continue to add functions to the jQuery prototype, it will be very close to the original version of jQuery. Here I will simply implement it text() method

 var jQuery= function (selector) {
        return new jQuery.fn.init(selector);
    }

    jQuery.fn = jQuery.prototype = {
        init: function (selector) {
            var nodes = document.querySelectorAll(selector);
            for (var i in nodes) {
                this[i] = nodes[i];
            }
            return this;
        },
         element: function (callback) {
            for (var i = 0; i < this.length; i++) {
                callback(this[i]);
            }
        },
        text: function (content) {
            if (content == '' || content) {
                this.element(function (node) {
                    node.innerHTML = content;
                })
                 return content;
            } else {
                return this[0].innerHTML;
            }
        },
    }

    jQuery.prototype.init.prototype = jQuery.prototype;

    window.$ = jQuery;

end

In fact, the core is not complicated at all. I like the implementation of plug-ins. I think most of their functions are implemented by plug-ins. The ingenious design of the tool itself and the convenience.

In the traditional page production, jQuery is very comfortable to use, but the emergence of MVVM has changed our way of thinking. We only need to pay attention to business logic, do not need to manually operate DOM, and do not need to pay attention to the synchronization of data status. It is much easier for project management.

If there are simple requirements on a single page, jQuery still has a place to use, MVVM can only be added to the trouble.

If there is a novice to learn nodejs , get url post The same problem will occur when the parameter is returned. Let's solve this small problem today

node.js No php This old back-end language has specific methods to obtain external parameters. After all, it is a new force. I hope the later version can be more convenient and efficient

 //Normal acquisition values 
 app. Get ('/', (req, RES) = > {console. Log (req. Query); 
 res.send ('complete '); 
}); 
 app. Post (' / '(req, RES) = > {console. Log (req. Body); 
 res.send ('complete'); 
};

Normal output, your expectation is like this

 //Get request 
 {Name: 'Feng Xiaoxian', 
 age: '18' 
} completed

or

 //Post request 
 {Name: 'Feng Xiaoxian', 
 age: '18' 
} completed

But it's not!!!

 //Twice the output will be like this!!! 
{ }
undefined

This is because we lack a module, express middleware body-parser

Official statement
Node.js body parsing middleware.
Parse incoming request bodies in a middleware before your handlers, available under the req.body property.

Basically, parsing the content in the body of the client request, JSON encoding processing and URL encoding processing

Next we'll install it body-parser

 //Install body parser
npm install body parser

 //Import app.js/var varbodyparser = require ('body-parser '); app.use (bodyparser());;; 
 / / / so you can use req.body to get the value passed by post, using req.body to get the value passed by post. App.post (' / ', (req, RES) = > {app.post (' / ', (req, RES) = > > {app.post (' / ', (req, res, RES) = > {console.log (req.body); 
res.send ('complete'); 
 
;;; 
;;; 
;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;. Json())

There is no motivation for learning, so eating jujube is? In the process of learning nodejs, I will give you a little refreshing?

Here I used the most simple crawler tutorial of cnodejs community to do the basic change eel, completed

 //Initialize the project 
 NPM init 
 / / start app. JS 
 node app. JS 
 / / and you can enjoy it ♂ Play fast (see the end of the article for the code)

If you don't know how to use nodejs
Linux players can watch My article ; windows players can go to the official website to download. MSI and install it next Through train

Basic crawling ideas

1. Page pagination button, catch all the page links of little sister that appear on this page, and store them
2. Use eventproxy to access the pages of each little sister concurrently
3. In the process of accessing, cherio (a module similar to jQuery) is used to match the image address we need and record all the image addresses found
4. HTTP to request each image address, save the binary data stream
5. FS will binary data stream, output into a picture file, the file name is extracted from the original address
6. Save to folder

Here I am afraid that because the request is too large, use express to build a static page to provide query and download To reduce the possibility of crawling to death

Download address: xjj.zip