This article has participated in the “Digitalstar Project” and won a creative gift package to challenge the creative incentive money.

This series of articles, belong to the study of “JavaScript design patterns” book, so as to do the harvest summary

Flexible language -JavaScript

• Scenario 1: The login module needs to verify the name, email address, and password, and whether to enter the password according to the rules

This is the most basic scenario and requirement

• Once I, a word of disagreement, a shuttle began to masturbate

function checkName() {
    // Verify the name
}
function checkEmail() {
    // Verify the mailbox
}
function checkPassword() {
    // Verify password
}
Copy the code

That’s fine, it’s implemented, and it can be implemented in business but for an ape with a little bit of insight, it’s like declaring three variables globally and assigning functions to them, something like this

var checkName = function () {
    // Verify the name
}
var checkEmail = function () {
    // Verify the mailbox
}
var checkPassword = function () {
    // Verify password
}
Copy the code

• Scenario 1 (an object marshalling variable)

var checkObject ={
    checkName: function () {
    // Verify the name
    }
    checkEmail: function () {
    // Verify the mailbox
    }
    checkPassword: function () {
    // Verify password}}Copy the code

At this point we use all the functions as CheckObject methods, so we have only one object, and it is easy to use them, such as checking the name checkObject.checkname (), but the object name in front of the function we used before

• Scheme 2 (another form of object)

var CheckObject = function () {};
CheckObject.checkName = function () {
    // Verify the name
}
CheckObject.checkEmail = function () {
    // Verify the mailbox
}
CheckObject.checkPassword = function () {
    // Verify password
}
Copy the code

Use the same method as before, such as checkObject.checkname (), but there is a problem when someone else tries to use your object methods, because the object cannot be copied, or when the object class creates a new object with the new keyword, the newly created object cannot inherit the methods

• Reform (1)

var CheckObject = function () {
    return {
        checkName: function () {
            // Verify the name
        }
        checkEmail: function () {
            // Verify the mailbox
        }
        checkPassword: function () {
            // Verify password}}}Copy the code

• Reform (2)

var CheckObject = function () {
    this.checkName = function () {
        // Verify the name
    }
    this.checkEmail = function () {
        // Verify the mailbox
    }
    this.checkPassword = function () {
        // Verify password}}Copy the code

var check = new CheckObject();
check.checkName();
Copy the code

• Reform (3)

var CheckObject = function () {
    checkName: function () {
        // Verify the name
        return this;
    }
    checkEmail = function () {
        // Verify the mailbox
        return this;
    }
    checkPassword = function () {
        // Verify password
        return this; }}Copy the code

When we want to use it, we can do this:

CheckObject.checkName().checkEmail().checkPassword();
Copy the code

• Reform (4)

var CheckObject = function () {};
CheckObject.prototype = {
    checkName: function () {
        // Verify the name
        return this;
    }
    checkEmail = function () {
        // Verify the mailbox
        return this;
    }
    checkPassword = function () {
        // Verify password
        return this; }}Copy the code

To use it, create it:

var check = new CheckObject()
check.checkName().checkEmail().checkPassword();
Copy the code

To consider

• How do I implement chained calls to methods?
• Try defining an addMethod method that can add multiple methods to a function

To be continued, continuously updated…