"JavaScript Design Pattern" reading notes

JavaScript Design pattern reading

Chapter II: Category

1. Closure implementation class

Closures can be understood as' class generators'

Closure Code:

var Book = (function(){
    var bookNum = 0;
    function checkBook(name){
    }
    return function(newId,newName,newPrice){
        var name,price;
        this.id = newId;
        bookNum++;
        if(bookNum > 100){
            throw new Error('Up to 100 books');
        }
        function checkID(id){}
        this.getName = function(){
            console.log(name);
            return name;
        };
        this.getPrice = function(){
            console.log(price);
            return price;
        };
        this.setName = function (mName) {
            name = mName;
        };
        this.setPrice = function (mPrice) {
            price = mPrice;
        };
        this.copy = function () {};
        // constructor
        this.setName(newName);
        this.setPrice(newPrice);
    }
})();
Book.prototype = {
    isJSBook: false,
    display: function () {
    }
}

Use:

var myBook = new Book('id','name','price');

The usage method is consistent with the common one.
But if you don't add the new keyword

var myBook = Book('id','name','price');

When the new keyword is not used, the Book will only be executed once and this pointer will be window
And all the values are in the

The function of return can be written as a private class, and the external prototype can be written in it to make the closure look more comfortable and more like a whole.

2. Security mode of the object

You may forget to use the new keyword when using classes. This time the call is just like the above. Execute the code once, and this in it points to window.

You can use security mode to avoid forgetting to use new.

The Works of Liezi:

var Book = function (title,time,type) {
    if(this instanceof Book){
        this.title = title;
        this.time = time;
        this.type = type;
    }else{
        return new Book(title,time,type);
    }
}

The essence can be seen as adding a layer of judgment.

3. js prototype chain has no power to reference types.

When the value on the prototype chain is a reference:

var test = function () {
}
test.prototype.nums = [1,2,3,4];
ins1 = new test();
ins2 = new test();
console.log(ins2.nums);
ins1.nums.push(5);
console.log(ins2.nums);

Here you can see that there is a problem if the value on the prototype chain is a reference type.

4. Multiple inheritance

The implementation of multi inheritance is to copy all the properties of the parent classes to a current class.
When you encounter a reference type, you should make a deep copy, but here we only discuss the shallow copy.
The following code is multi inheritance:

var mix = function () {
    var len = arguments.length;
    var target = arguments[1];
    var arg;
    for(var i = 1;i < len;i++){
        arg = arguments[i];
        for(var property in arg){
            target[property] = arg[property];
        }
    }
    return arg;
}

5. Polymorphism

Polymorphism is to count the number of values in arguments and give different responses according to different situations.
Simple example

var add = function () {
    var len = arguments.length;
    switch (len) {
        case 0:
            return 10;
        case 1:
            return 10 + arguments[0];
        case 2:
            return arguments[0] + arguments[1];
    }
}

Tags: Javascript

Posted on Wed, 04 Dec 2019 13:43:35 -0800 by enygma