2.设计模式的分类—精读《JavaScript 设计模式》Addy Osmani著

同系列友情连接:

---

1.设计模式之初体验—精读《JavaScript 设计模式》Addy Osmani著

3.Contructor(构造器)模式—精读《JavaScript 设计模式》Addy Osmani著

有关类(Class)的要点

---

JavaScript 是一种无类语言，可是能够使用函数来模拟类。

最经常使用的实现方式是定义一个JavaScript 函数，而后使用 new关键字建立新对象。使用 this来定义对象的新属性和方法，以下所示：

// 一个 Car 'class'
function Car(model){
    this.model=model;
    this.color='silver';
    this.year="2012";
    this.getInfo=function(){
        return this.model+" "+this.year;
    }
}
复制代码

而后能够像这样使用咱们上面定义的 car构造函数来实例化该对象：

var myCar=new Car("ford");
myCar.year="2010";
console.log(myCar.getInfo());
// 结果
// "ford 2010"
复制代码

欲了解更多使用 JavaScript 拉斯定义“类”的方法，请查看斯托扬·斯蒂凡诺夫发布的帖子三种定义JavaScript类的方法

下面汇总他的三种定义的 JavaScript 类的方法以下

// 1. using a function
// This is probably one of the most common ways.
// You define a normal JavaScript function and then
// create an object by using the new keyword. To define
// properties and methods for an object created using
// function(), you use the this keyword, as seen in the
// following example.
function Apple (type) {
    this.type = type;
    this.color = "red";
    this.getInfo = getAppleInfo;
}
// anti-pattern! keep reading...
function getAppleInfo() {
    return this.color + ' ' + this.type + ' apple';
}

// To instantiate an object using the Apple constructor
// function, set some properties and call methods you
// can do the following:
var apple = new Apple('macintosh');
apple.color = "reddish";
alert(apple.getInfo());

// result：'reddish macintosh apple'

// 1.1 Methods defined internally
// you can define your methods within
// the constructor function, like this:
function Apple (type) {
    this.type = type;
    this.color = "red";
    this.getInfo = function() {
        return this.color + ' ' + this.type + ' apple';
    };
}


// 1.2 Methods added to the prototype
// The way to prevent pollution of the global namespace,
// you can define your methods within the constructor function, like this:
function Apple (type) {
    this.type = type;
    this.color = "red";
}

Apple.prototype.getInfo = function() {
    return this.color + ' ' + this.type + ' apple';
};

// Again, you can use the new objects exactly
// the same way as in 1. and 1.1.

// 2. Using object literals
// Literals are shorter way to define objects
// and arrays in JavaScript. To create an empty
// object using you can do:
var o = {};
// instead of the "normal" way:
var o = new Object();
// For arrays you can do:
var a = [];
// instead of:
var a = new Array();

// So you can skip the class-like stuff and create an instance (object)
// immediately. Here's the same functionality as described in the previous
// examples, but using object literal syntax this time:

var apple = {
    type: "macintosh",
    color: "red",
    getInfo: function () {
        return this.color + ' ' + this.type + ' apple';
    }
}
// In this case you don't need to (and cannot) create an instance of the class,
// it already exists. So you simply start using this instance.

apple.color = "reddish";
alert(apple.getInfo());

// Such an object is also sometimes called singleton.
// In "classical" languages such as Java, singleton means that
// you can have only one single instance of this class at any time,
// you cannot create more objects of the same class.
// In JavaScript (no classes, remember?) this concept makes no sense anymore
// since all objects are singletons to begin with.


// 3. Singleton using a function
// The third way presented in this article is a combination of the other
// two you already saw. You can use a function to define a singleton object.
// Here's the syntax:
var apple = new function() {
    this.type = "macintosh";
    this.color = "red";
    this.getInfo = function () {
        return this.color + ' ' + this.type + ' apple';
    };
}
// So you see that this is very similar to 1.1. discussed above,
// but the way to use the object is exactly like in 2.
apple.color = "reddish";
alert(apple.getInfo());

// `new function(){...}` does two things at the same time:
// define a function (an anonymous constructor function) and
// invoke it with new. It might look a bit confusing
// if you're not used to it and it's not too common, but hey,
// it's an option, when you really want a constructor function that
// you'll use only once and there's no sense of giving it a name.
复制代码

23种设计模式

设计模式中比较著名的就是“四人组”提到的23种设计模式；

如下是原始表格（由艾丽丝·尼尔森在2004年总结）：

总结：

今天分享了书中第八章 设计模式的分类，主要内容：

1. JavaScript 中的 “类”
2. JavaScript 中三种模拟类的实现方式
3. 23种设计模式包含哪些？
4. 23种设计模式的简单描述

今天的内容你 get 到了吗？😊😊😊